Browse Source

Merge branch 'pr/508'

Also improved styles for new material design

Conflicts:
	app/css/desktop.css
	app/partials/desktop/im.html
	app/vendor/jquery.emojiarea/jquery.emojiarea.js
master
Igor Zhukov 10 years ago
parent
commit
2dbffb6154
  1. 28
      app/css/desktop.css
  2. 3
      app/js/directives.js
  3. 5
      app/partials/desktop/im.html
  4. 42
      app/vendor/jquery.emojiarea/jquery.emojiarea.js

28
app/css/desktop.css

@ -635,6 +635,8 @@ a.footer_link.active:active { @@ -635,6 +635,8 @@ a.footer_link.active:active {
border-radius: 0;
float: right;
min-width: 0;
margin-top: 5px;
margin-left: 10px;
width: auto;
padding: 0;
font-weight: bold;
@ -644,6 +646,25 @@ a.footer_link.active:active { @@ -644,6 +646,25 @@ a.footer_link.active:active {
background: inherit;
}
.im_emoji_quick_select_area {
display: block;
height: 30px;
overflow: hidden;
max-width: 210px;
}
.im_emoji_quick_select_area a {
display: inline-block;
padding: 5px;
}
.im_emoji_quick_select_area a:hover {
background-color: #edf2f5;
}
.im_emoji_quick_select_area a .label {
display: none;
}
.im_message_selected .im_message_date,
.im_message_selected .im_message_document_size,
.im_message_selected .im_message_audio_duration,
@ -795,6 +816,7 @@ a.footer_link.active:active { @@ -795,6 +816,7 @@ a.footer_link.active:active {
.im_send_panel_wrap {
max-width: 554px;
padding-bottom: 23px;
}
.im_send_form {
max-width: 382px;
@ -873,7 +895,7 @@ a.im_panel_peer_photo .peer_initials { @@ -873,7 +895,7 @@ a.im_panel_peer_photo .peer_initials {
}
.im_send_field_wrap {
margin-bottom: 20px;
margin-bottom: 15px;
}
.emoji-wysiwyg-editor,
.im_message_field {
@ -904,7 +926,7 @@ a.im_panel_peer_photo .peer_initials { @@ -904,7 +926,7 @@ a.im_panel_peer_photo .peer_initials {
width: 18px;
height: 17px;
margin-right: 28px;
margin-top: 1px;
margin-top: 6px;
}
.icon-paperclip {
@ -938,6 +960,8 @@ a.im_panel_peer_photo .peer_initials { @@ -938,6 +960,8 @@ a.im_panel_peer_photo .peer_initials {
width: 20px;
height: 18px;
margin-top: 5px;
margin-right: 25px;
}

3
app/js/directives.js

@ -1061,9 +1061,10 @@ angular.module('myApp.directives', ['myApp.filters']) @@ -1061,9 +1061,10 @@ angular.module('myApp.directives', ['myApp.filters'])
fileSelects = $('input', element),
dropbox = $('.im_send_dropbox_wrap', element)[0],
emojiButton = $('.im_emoji_btn', element)[0],
emojiQuickSelect = !Config.Mobile ? $('.im_emoji_quick_select_area', element)[0] : false,
editorElement = messageField,
dragStarted, dragTimeout,
emojiArea = $(messageField).emojiarea({button: emojiButton, norealTime: true}),
emojiArea = $(messageField).emojiarea({button: emojiButton, norealTime: true, quickSelect: emojiQuickSelect}),
emojiMenu = $('.emoji-menu', element)[0],
submitBtn = $('.im_submit', element)[0],
richTextarea = $('.emoji-wysiwyg-editor', element)[0];

5
app/partials/desktop/im.html

@ -182,6 +182,8 @@ @@ -182,6 +182,8 @@
</div>
<div class="clearfix">
<button type="submit" class="btn btn-md im_submit" my-i18n="im_submit_message"></button>
<div class="im_attach pull-left">
<input type="file" class="im_attach_input" size="28" multiple="true" title="{{'im_attach_file_title' | i18n}}" />
<i class="icon icon-paperclip"></i>
@ -192,7 +194,8 @@ @@ -192,7 +194,8 @@
<i class="icon icon-camera"></i>
</div>
<button type="submit" class="btn btn-md im_submit" my-i18n="im_submit_message"></button>
<div class="im_emoji_quick_select_area"></div>
</div>
</form>
</div>

42
app/vendor/jquery.emojiarea/jquery.emojiarea.js vendored

@ -172,7 +172,7 @@ @@ -172,7 +172,7 @@
/*! MODIFICATION START
This function was added by Igor Zhukov to save recent used emojis.
*/
util.emojiInserted = function (emojiKey, menu) {
util.emojiInserted = function (emojiKey, menu, quickSelect) {
ConfigStorage.get('emojis_recent', function (curEmojis) {
curEmojis = curEmojis || defaultRecentEmojis || [];
@ -189,6 +189,14 @@ @@ -189,6 +189,14 @@
}
ConfigStorage.set({emojis_recent: curEmojis});
if (menu) {
menu.updateRecentTab(curEmojis);
}
if (quickSelect) {
quickSelect.load(0);
}
})
};
/*! MODIFICATION END */
@ -204,6 +212,11 @@ @@ -204,6 +212,11 @@
this.$editor.on('blur', function() { self.hasFocus = false; });
this.setupButton();
if (this.options.quickSelect) {
var $items = $(this.options.quickSelect);
this.quickSelect = new EmojiQuickSelectArea(self, $items);
}
};
EmojiArea.prototype.setupButton = function() {
@ -275,7 +288,7 @@ @@ -275,7 +288,7 @@
if (!$.emojiarea.icons.hasOwnProperty(emoji)) return;
util.insertAtCursor(emoji, this.$textarea[0]);
/* MODIFICATION: Following line was added by Igor Zhukov, in order to save recent emojis */
util.emojiInserted(emoji, this.menu);
util.emojiInserted(emoji, this.menu, this.quickSelect);
this.$textarea.trigger('change');
};
@ -394,7 +407,7 @@ @@ -394,7 +407,7 @@
/*! MODIFICATION END */
/* MODIFICATION: Following line was added by Igor Zhukov, in order to save recent emojis */
util.emojiInserted(emoji, this.menu);
util.emojiInserted(emoji, this.menu, this.quickSelect);
this.onChange();
@ -597,12 +610,12 @@ @@ -597,12 +610,12 @@
if (path.length && path.charAt(path.length - 1) !== '/') {
path += '/';
}
/*! MODIFICATION: Following function was added by Igor Zhukov, in order to add scrollbars to EmojiMenu */
var updateItems = function () {
self.$items.html(html.join(''));
if (!Config.Mobile) {
if (!Config.Mobile && self.$itemsWrap) {
setTimeout(function () {
self.$itemsWrap.nanoScroller();
}, 100);
@ -680,4 +693,21 @@ @@ -680,4 +693,21 @@
};
})();
})(jQuery, window, document);
var EmojiQuickSelectArea = function(emojiarea, $items) {
var self = this;
this.emojiarea = emojiarea;
this.$items = $items;
this.load(0);
this.$items.on('click', 'a', function(e) {
var emoji = $('.label', $(this)).text();
self.onItemSelected(emoji);
e.stopPropagation();
return false;
});
};
util.extend(EmojiQuickSelectArea.prototype, EmojiMenu.prototype);
})(jQuery, window, document);

Loading…
Cancel
Save