feat(chat): emoji support on maker group create popup side overlay

#20
This commit is contained in:
OldHawk
2017-12-12 17:27:27 +08:00
parent 4cac13f594
commit 190e34d513
4 changed files with 59 additions and 9 deletions

View File

@@ -169,7 +169,7 @@
width: 100%;
height: ~"calc(100% - 50px)";
overflow: auto;
padding: 30px 15px;
padding: 30px 10px;
.maker-form {
margin-top: 20px;
input {
@@ -192,7 +192,6 @@
bottom: 0;
padding: 8px 10px;
}
}
.maker-view-top {

View File

@@ -13,7 +13,7 @@
width: 100%;
height: ~"calc(100% - 50px)";
overflow: auto;
padding: 30px 15px;
padding: 30px 10px;
.collection-form {
margin-top: 20px;
input {
@@ -21,7 +21,6 @@
}
textarea {
resize: vertical;
margin-top: 20px;
width: 100%;
min-height: 200px;
}

View File

@@ -202,6 +202,55 @@
SideOverlay.close(null, 'tagsPopupSlide');
};
/**
* initOverviewComplete
*/
vm.initOverviewComplete = function () {
$('.overview-textarea').textcomplete([
{ // emoji strategy
match: /\B:([\-+\w]*)$/,
search: function (term, callback) {
callback($.map(window.emojies, function (emoji) {
return emoji.indexOf(term) === 0 ? emoji : null;
}));
},
template: function (value) {
return '<img class="ac-emoji" src="/graphics/emojis/' + value + '.png" />' + '<span class="ac-emoji-text">' + value + '</span>';
},
replace: function (value) {
return ':' + value + ': ';
},
index: 1
}
]);
};
/**
* onOverviewKeyDown
* @param e
*/
vm.onOverviewKeyDown = function (e) {
if (e.keyCode === 27) { // ESC
var hasPopupMenu = false;
var emojiMenu = $('.textcomplete-dropdown');
angular.forEach(emojiMenu, function (e) {
if (e.style.display === 'block') {
hasPopupMenu = true;
}
});
if (hasPopupMenu) {
e.stopPropagation();
}
}
};
/**
* onPopupMessageOpen
*/
vm.onPopupMessageOpen = function () {
$('#coll-name').focus();
};
/**
* setTorrentTags
*/

View File

@@ -436,18 +436,21 @@
<!-- =================================================================
side-overlay collections create
================================================================== -->
<div id="collectionsCreateSlide" side-overlay="right" side-class="collections-side-overlay" side-close-on-esc side-modal>
<div class="collection-popup">
<div id="collectionsCreateSlide" side-overlay="right" side-class="collections-side-overlay" side-opened="vm.onPopupMessageOpen();"
side-close-on-esc side-modal>
<div class="collection-popup" ng-init="vm.initOverviewComplete();">
<legend class="h4"
translate="COLLECTIONS.FORM_FOR" translate-values="{cid: vm.torrentLocalInfo.resource_detail_info.belongs_to_collection.id}">
</legend>
<div class="collection-form">
<input type="text" class="form-control" id="name" placeholder="{{'COLLECTIONS.FORM_NAME' | translate}}"
<input type="text" class="form-control margin-bottom-10" id="coll-name" placeholder="{{'COLLECTIONS.FORM_NAME' | translate}}"
ng-model="vm.collection.name" autofocus>
<textarea class="form-control" id="overview" placeholder="{{'COLLECTIONS.FORM_DESC' | translate}}"
ng-model="vm.collection.overview"></textarea>
<textarea class="form-control overview-textarea" id="overview-textarea" name="overview-textarea"
ng-model="vm.collection.overview" data-hidden-buttons="cmdPreview" ng-keydown="vm.onOverviewKeyDown($event);"
placeholder="{{'COLLECTIONS.FORM_DESC' | translate}}"
mt-markdown-editor="overview-textarea"></textarea>
<div class="margin-top-10" style="display: table;">
<a class="message-extra" href="https://guides.github.com/features/mastering-markdown/" target="_blank"