Add a way to cycle through nicks on mobile
This was heavily inspired by https://github.com/maxpoulin64/lounge/commit/a877e46. Clearly not a definitive solution but a good start to have and to improve upon.
This commit is contained in:
parent
61a582f71f
commit
ddaf7ff300
@ -141,6 +141,7 @@ button {
|
|||||||
#footer .icon,
|
#footer .icon,
|
||||||
#chat .count:before,
|
#chat .count:before,
|
||||||
#settings #play:before,
|
#settings #play:before,
|
||||||
|
#form #cycle-nicks:before,
|
||||||
#form #submit:before,
|
#form #submit:before,
|
||||||
#chat .invite .from:before,
|
#chat .invite .from:before,
|
||||||
#chat .join .from:before,
|
#chat .join .from:before,
|
||||||
@ -186,6 +187,8 @@ button {
|
|||||||
#footer .settings:before { content: "\f013"; /* http://fontawesome.io/icon/cog/ */ }
|
#footer .settings:before { content: "\f013"; /* http://fontawesome.io/icon/cog/ */ }
|
||||||
#footer .sign-out:before { content: "\f011"; /* http://fontawesome.io/icon/power-off/ */ }
|
#footer .sign-out:before { content: "\f011"; /* http://fontawesome.io/icon/power-off/ */ }
|
||||||
|
|
||||||
|
#form #cycle-nicks:before { content: "\f007"; /* http://fontawesome.io/icon/user/ */ }
|
||||||
|
|
||||||
#form #submit:before { content: "\f1d8"; /* http://fontawesome.io/icon/paper-plane/ */ }
|
#form #submit:before { content: "\f1d8"; /* http://fontawesome.io/icon/paper-plane/ */ }
|
||||||
|
|
||||||
#chat .invite .from:before {
|
#chat .invite .from:before {
|
||||||
@ -1362,16 +1365,22 @@ button {
|
|||||||
align-self: center;
|
align-self: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#form #cycle-nicks,
|
||||||
#form #submit {
|
#form #submit {
|
||||||
color: #9ca5b4;
|
color: #9ca5b4;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
transition: opacity .2s;
|
transition: opacity .2s;
|
||||||
width: 32px;
|
width: 24px;
|
||||||
-webkit-flex: 0 0 auto;
|
-webkit-flex: 0 0 auto;
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#form #submit {
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#form #cycle-nicks:hover,
|
||||||
#form #submit:hover {
|
#form #submit:hover {
|
||||||
opacity: .6;
|
opacity: .6;
|
||||||
}
|
}
|
||||||
|
@ -66,6 +66,9 @@
|
|||||||
--><span id="save-nick-tooltip" class="tooltipped tooltipped-e" aria-label="Save"><button id="submit-nick" type="button" aria-label="Save"></button></span>
|
--><span id="save-nick-tooltip" class="tooltipped tooltipped-e" aria-label="Save"><button id="submit-nick" type="button" aria-label="Save"></button></span>
|
||||||
</span>
|
</span>
|
||||||
<textarea id="input" class="mousetrap"></textarea>
|
<textarea id="input" class="mousetrap"></textarea>
|
||||||
|
<span id="cycle-nicks-tooltip" class="tooltipped tooltipped-w" aria-label="Cycle through nicks">
|
||||||
|
<button id="cycle-nicks" type="button" aria-label="Cycle through nicks"></button>
|
||||||
|
</span>
|
||||||
<span id="submit-tooltip" class="tooltipped tooltipped-w" aria-label="Send message">
|
<span id="submit-tooltip" class="tooltipped tooltipped-w" aria-label="Send message">
|
||||||
<button id="submit" type="submit" aria-label="Send message"></button>
|
<button id="submit" type="submit" aria-label="Send message"></button>
|
||||||
</span>
|
</span>
|
||||||
|
@ -721,6 +721,12 @@ $(function() {
|
|||||||
})
|
})
|
||||||
.tab(complete, {hint: false});
|
.tab(complete, {hint: false});
|
||||||
|
|
||||||
|
// Cycle through nicks for the current word, just like hitting "Tab"
|
||||||
|
$("#cycle-nicks").on("click", function() {
|
||||||
|
input.triggerHandler($.Event("keydown.tabcomplete", {which: 9}));
|
||||||
|
focus();
|
||||||
|
});
|
||||||
|
|
||||||
$("#form").on("submit", function(e) {
|
$("#form").on("submit", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
var text = input.val();
|
var text = input.val();
|
||||||
|
Loading…
Reference in New Issue
Block a user