r4sas/webogram-i2p
1
0
Fork 0
Code Issues Releases Wiki Activity

Emoji menu improved on mobile

Browse Source
This commit is contained in:
Igor Zhukov 2014-07-28 16:45:17 +04:00
parent d2eb2535ea
commit d8b8726fb1
3 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/css/app_mobile.css
View File

@ -1104,6 +1104,10 @@ a.im_message_fwd_author {
.emoji-menu { .emoji-menu {
margin-left: -20px; margin-left: -20px;
margin-top: -267px; margin-top: -267px;
width: 262px;
}
.emoji-menu .emoji-items a {
padding: 5px;
} }
.im_head_attach { .im_head_attach {

2
app/partials/head.html
View File

@ -114,7 +114,7 @@
<ul ng-switch-when="true" class="nav navbar-nav navbar-offline"> <ul ng-switch-when="true" class="nav navbar-nav navbar-offline">
<li ng-show="!offlineConnecting"><span class="navbar-offline-text">Waiting for network<span my-loading-dots></span></span></li> <li ng-show="!offlineConnecting"><span class="navbar-offline-text">Waiting for network<span my-loading-dots></span></span></li>
<li ng-show="!offlineConnecting"><a href="" ng-click="retryOnline()">Retry</a></li> <li ng-show="!offlineConnecting" class="hidden-xs"><a href="" ng-click="retryOnline()">Retry</a></li>
<li ng-show="offlineConnecting"><span class="navbar-offline-text">Connecting<span my-loading-dots></span></span></li> <li ng-show="offlineConnecting"><span class="navbar-offline-text">Connecting<span my-loading-dots></span></span></li>
</ul> </ul>

19
app/vendor/jquery.emojiarea/jquery.emojiarea.js vendored
View File

@ -240,20 +240,21 @@
/*! MODIFICATION START /*! MODIFICATION START
This function was modified by Andre Staltz so that the icon is created from a spritesheet. This function was modified by Andre Staltz so that the icon is created from a spritesheet.
*/ */
EmojiArea.createIcon = function(emoji) { EmojiArea.createIcon = function(emoji, menu) {
var category = emoji[0]; var category = emoji[0];
var row = emoji[1]; var row = emoji[1];
var column = emoji[2]; var column = emoji[2];
var name = emoji[3]; var name = emoji[3];
var filename = $.emojiarea.spritesheetPath; var filename = $.emojiarea.spritesheetPath;
var xoffset = -($.emojiarea.iconSize * column); var iconSize = menu && Config.Navigator.mobile ? 26 : $.emojiarea.iconSize
var yoffset = -($.emojiarea.iconSize * row); var xoffset = -(iconSize * column);
var scaledWidth = ($.emojiarea.spritesheetDimens[category][1] * $.emojiarea.iconSize); var yoffset = -(iconSize * row);
var scaledHeight = ($.emojiarea.spritesheetDimens[category][0] * $.emojiarea.iconSize); var scaledWidth = ($.emojiarea.spritesheetDimens[category][1] * iconSize);
var scaledHeight = ($.emojiarea.spritesheetDimens[category][0] * iconSize);
var style = 'display:inline-block;'; var style = 'display:inline-block;';
style += 'width:' + $.emojiarea.iconSize + 'px;'; style += 'width:' + iconSize + 'px;';
style += 'height:' + $.emojiarea.iconSize + 'px;'; style += 'height:' + iconSize + 'px;';
style += 'background:url(\'' + filename.replace('!',category) + '\') ' + xoffset + 'px ' + yoffset + 'px no-repeat;'; style += 'background:url(\'' + filename.replace('!',category) + '\') ' + xoffset + 'px ' + yoffset + 'px no-repeat;';
style += 'background-size:' + scaledWidth + 'px ' + scaledHeight + 'px;'; style += 'background-size:' + scaledWidth + 'px ' + scaledHeight + 'px;';
return '<img src="img/blank.gif" class="img" style="'+ style +'" alt="' + util.htmlEntities(name) + '">'; return '<img src="img/blank.gif" class="img" style="'+ style +'" alt="' + util.htmlEntities(name) + '">';
@ -609,7 +610,7 @@
for (var key in options) { for (var key in options) {
/* MODIFICATION: The following 2 lines were modified by Andre Staltz, in order to load only icons from the specified category. */ /* MODIFICATION: The following 2 lines were modified by Andre Staltz, in order to load only icons from the specified category. */
if (options.hasOwnProperty(key) && options[key][0] === (category - 1)) { if (options.hasOwnProperty(key) && options[key][0] === (category - 1)) {
html.push('<a href="javascript:void(0)" title="' + util.htmlEntities(key) + '">' + EmojiArea.createIcon(options[key]) + '<span class="label">' + util.htmlEntities(key) + '</span></a>'); html.push('<a href="javascript:void(0)" title="' + util.htmlEntities(key) + '">' + EmojiArea.createIcon(options[key], true) + '<span class="label">' + util.htmlEntities(key) + '</span></a>');
} }
} }
} else { } else {
@ -619,7 +620,7 @@
for (i = 0; i < curEmojis.length; i++) { for (i = 0; i < curEmojis.length; i++) {
key = curEmojis[i] key = curEmojis[i]
if (options[key]) { if (options[key]) {
html.push('<a href="javascript:void(0)" title="' + util.htmlEntities(key) + '">' + EmojiArea.createIcon(options[key]) + '<span class="label">' + util.htmlEntities(key) + '</span></a>'); html.push('<a href="javascript:void(0)" title="' + util.htmlEntities(key) + '">' + EmojiArea.createIcon(options[key], true) + '<span class="label">' + util.htmlEntities(key) + '</span></a>');
} }
} }
} catch (e) {} } catch (e) {}