Improved games on mobile

app/js/lib/utils.js

@@ -383,6 +383,7 @@ function templateUrl (tplName) {
     reply_message: 'desktop',
     message_body: 'desktop',
     message_media: 'desktop',
+    message_attach_game: 'desktop',
     forwarded_messages: 'desktop',
     chat_invite_link_modal: 'desktop',
     reply_markup: 'desktop',

app/less/mobile.less

@@ -584,6 +584,17 @@ html {
     margin-top: 0;
   }
 
+  .im_message_game {
+    padding: 5px;
+    border-radius: 3px;
+    background: #f1f1f1;
+    margin-top: 0;
+
+    .im_message_webpage_wrap {
+      margin-left: 3px;
+    }
+  }
+
   .im_message_geopoint {
     width: 200px;
     height: 100px;

app/partials/desktop/message_attach_game.html

@@ -1,17 +1,19 @@
-<div class="im_message_webpage_wrap clearfix">
+<div class="im_message_game">
-  <div class="im_message_webpage_photo">
+  <div class="im_message_webpage_wrap clearfix">
-    <div class="im_message_webpage_title">
+    <div class="im_message_webpage_photo">
-      <a href=""  ng-click="openGame()" target="_blank" rel="noopener noreferrer" ng-bind-html="media.game.rTitle"></a>
+      <div class="im_message_webpage_title">
+        <a href=""  ng-click="openGame()" target="_blank" rel="noopener noreferrer" ng-bind-html="media.game.rTitle"></a>
+      </div>
+      <div class="im_message_webpage_description im_message_game_description" ng-bind-html="::media.game.rDescription"></div>
+      <div class="im_message_webpage_description im_message_game_message"></div>
+      <a class="im_message_photo_thumb" ng-click="openGame()" ng-style="::{width: media.game.photo.thumb.width + 'px'}">
+        <img
+          class="im_message_photo_thumb"
+          my-load-thumb
+          thumb="media.game.photo.thumb"
+          alt="[{{::media.game.title}}]"
+        />
+      </a>
     </div>
-    <div class="im_message_webpage_description im_message_game_description" ng-bind-html="::media.game.rDescription"></div>
-    <div class="im_message_webpage_description im_message_game_message"></div>
-    <a class="im_message_photo_thumb" ng-click="openGame()" ng-style="::{width: media.game.photo.thumb.width + 'px'}">
-      <img
-        class="im_message_photo_thumb"
-        my-load-thumb
-        thumb="media.game.photo.thumb"
-        alt="[{{::media.game.title}}]"
-      />
-    </a>
   </div>
 </div>

app/partials/mobile/message_service.html

@@ -30,6 +30,14 @@
   <span ng-switch-when="messageActionChannelEditPhoto" my-i18n="message_service_changed_channel_photo"></span>
   <span ng-switch-when="messageActionChannelDeletePhoto" my-i18n="message_service_removed_channel_photo"></span>
 
+  <span ng-switch-when="messageActionGameScore" my-i18n="message_service_scored_game">
+    <my-i18n-param name="scored">
+      <ng-pluralize count="historyMessage.action.score"
+                     when="message_service_scored_X"></ng-pluralize>
+    </my-i18n-param>
+    <my-i18n-param name="message"><a class="im_service_message_pinned" my-pinned-message="::historyMessage.reply_to_mid"></a></my-i18n-param>
+  </span>
+
   <span ng-switch-when="messageActionPinMessage" my-i18n="message_service_pinned_message">
     <my-i18n-param name="message"><a my-pinned-message="historyMessage.reply_to_mid"></a></my-i18n-param>
   </span>