Fixed #60, https://github.com/zhukov/webogram/issues/87#issuecomment-36752447

app/css/app.css

@@ -1025,6 +1025,15 @@ div.im_message_video_thumb {
   background-image: url(../img/icons/IconsetW_1x.png?2);
 }
 
+.im_message_selected .icon-document,
+.im_message_selected .icon-photo,
+.im_message_selected .icon-video,
+.im_history_selectable .im_message_outer_wrap:hover .icon-document,
+.im_history_selectable .im_message_outer_wrap:hover .icon-photo,
+.im_history_selectable .im_message_outer_wrap:hover .icon-video {
+  background-color: #dae6f0;
+}
+
 .im_message_document_info {
   float: left;
 }
@@ -2219,8 +2228,8 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status {
   display: none;
   width: 26px;
   height: 26px;
-  margin: 14px 0 0 40px;
-  background: url(../img/icons/IconsetW.png?1) -9px -515px no-repeat;
+  margin: 13px 0 0 40px;
+  background: url(../img/icons/IconsetW.png?1) -9px -516px no-repeat;
   background-size: 42px 560px;
 }
 .is_1x .icon-select-tick {
@@ -2233,7 +2242,7 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status {
 .im_message_selected .icon-select-tick,
 .im_history_selectable .im_message_outer_wrap:hover .icon-select-tick,
 .im_content_message_select_area:hover .icon-select-tick {
-  background-position: -9px -480px;
+  background-position: -9px -481px;
   opacity: 0.5;
 }
 .im_message_selected .icon-select-tick {
@@ -2424,4 +2433,34 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status {
 }
 .peer_select_modal_wrap .modal-body {
   padding: 10px 10px 15px;
-}
+}
+
+
+/* Colorized user names
+
+c03d33 red
+4fad2d green
+d09306 yellow
+348cd4 blue
+8544d6 purple
+cd4073 pink
+2996ad sea
+ce671b orange
+ */
+.user_color_1,
+.user_color_1:hover {color: #c03d33;}
+.user_color_2,
+.user_color_2:hover {color: #4fad2d;}
+.user_color_3,
+.user_color_3:hover {color: #d09306;}
+.user_color_4,
+.user_color_4:hover {color: #348cd4;}
+.user_color_5,
+.user_color_5:hover {color: #8544d6;}
+.user_color_6,
+.user_color_6:hover {color: #cd4073;}
+.user_color_7,
+.user_color_7:hover {color: #2996ad;}
+.user_color_8,
+.user_color_8:hover {color: #ce671b;}
+

app/js/controllers.js

@@ -509,7 +509,7 @@ angular.module('myApp.controllers', [])
     }
 
     function selectedFlush () {
-      if (confirm('Are you sure? This can not be undone!') !== true) {
+      if (safeConfirm('Are you sure? This can not be undone!') !== true) {
         return false;
       }
       AppMessagesManager.flushHistory($scope.curDialog.inputPeer).then(function () {
@@ -798,7 +798,7 @@ angular.module('myApp.controllers', [])
     };
 
     $scope.flushHistory = function () {
-      if (confirm('Are you sure? This can not be undone!') !== true) {
+      if (safeConfirm('Are you sure? This can not be undone!') !== true) {
         return false;
       }
       AppMessagesManager.flushHistory(AppPeersManager.getInputPeerByID($scope.userID)).then(function () {
@@ -915,7 +915,7 @@ angular.module('myApp.controllers', [])
 
 
     $scope.flushHistory = function () {
-      if (confirm('Are you sure? This can not be undone!') !== true) {
+      if (safeConfirm('Are you sure? This can not be undone!') !== true) {
         return;
       }
       AppMessagesManager.flushHistory(AppPeersManager.getInputPeerByID(-$scope.chatID)).then(function () {

app/js/directives.js

@@ -658,7 +658,7 @@ angular.module('myApp.directives', ['myApp.filters'])
             />\
           </div>\
           <div class="video_full_player" ng-if="player.src">\
-            <embed ng-src="{{player.src}}" width="{{video.full.width}}" height="{{video.full.height}}" autoplay="true" CONTROLLER="TRUE" loop="false" pluginspace="http://www.apple.com/quicktime/" ng-if="player.quicktime"/>\
+            <embed ng-src="{{player.src}}" width="{{video.full.width}}" height="{{video.full.height}}" autoplay="true" CONTROLLER="TRUE" SHOWCONTROLS="TRUE" controller="true" loop="false" pluginspace="http://www.apple.com/quicktime/" ng-if="player.quicktime"/>\
             <video width="{{video.full.width}}" height="{{video.full.height}}" controls autoplay  ng-if="!player.quicktime">\
               <source ng-src="{{player.src}}" type="video/mp4">\
             </video>\
@@ -685,13 +685,13 @@ angular.module('myApp.directives', ['myApp.filters'])
       };
 
       var hasQt = false, i;
-      // if (navigator.plugins) {
-      //   for (i = 0; i < navigator.plugins.length; i++) {
-      //     if (navigator.plugins[i].name.indexOf('QuickTime') >= 0) {
-      //       hasQt = true;
-      //     }
-      //   }
-      // }
+      if (navigator.plugins) {
+        for (i = 0; i < navigator.plugins.length; i++) {
+          if (navigator.plugins[i].name.indexOf('QuickTime') >= 0) {
+            hasQt = true;
+          }
+        }
+      }
 
       MtpApiFileManager.downloadFile(scope.video.dc_id, inputLocation, scope.video.size, null, {mime: 'video/mp4'}).then(function (url) {
         scope.progress.enabled = false;

app/js/lib/mtproto.js

@@ -1503,10 +1503,8 @@ factory('MtpNetworkerFactory', function (MtpDcConfigurator, MtpMessageIdGenerato
 
   var updatesProcessor,
       iii = 0,
-      offline;
-
-  $rootScope.offline = true;
-  $rootScope.offlineConnecting = true;
+      offline,
+      offlineInited = false;
 
   $rootScope.retryOnline = function () {
     $(document.body).trigger('online');
@@ -1543,6 +1541,12 @@ factory('MtpNetworkerFactory', function (MtpDcConfigurator, MtpMessageIdGenerato
 
     this.longPollInt = $interval(this.checkLongPoll.bind(this), 10000);
     this.checkLongPoll();
+
+    if (!offlineInited) {
+      offlineInited = true;
+      $rootScope.offline = true;
+      $rootScope.offlineConnecting = true;
+    }
   };
 
   MtpNetworker.prototype.updateSession = function () {

app/js/services.js

@@ -243,8 +243,11 @@ angular.module('myApp.services', [])
       cachedPhotoLocations[id] = user && user.photo && user.photo.photo_small || {empty: true};
     }
 
+    var num = (Math.abs(id) % 8) + 1;
+
     return {
-      placeholder: 'img/placeholders/' + placeholder + 'Avatar'+((Math.abs(id) % 8) + 1)+'@2x.png',
+      num: num,
+      placeholder: 'img/placeholders/' + placeholder + 'Avatar' + num + '@2x.png',
       location: cachedPhotoLocations[id]
     };
   }

app/js/util.js

@@ -76,3 +76,12 @@ function safeReplaceObject (wasObject, newObject) {
     }
   }
 }
+
+function safeConfirm (message) {
+  try {
+    return confirm(message);
+  } catch (e) {
+    // Sorry, temp solution until UI boxes are done
+    return true;
+  }
+}

app/partials/im.html

@@ -113,10 +113,10 @@
                 Cancel
               </a>
               <div class="im_edit_selected_actions">
-                <a class="btn btn-danger im_edit_delete_btn" ng-click="selectedDelete()">
-                  Delete <strong class="im_selected_count" ng-show="selectedCount > 0" ng-bind="selectedCount"></strong>
-                </a><a class="btn btn-primary im_edit_forward_btn" ng-click="selectedForward()">
+                <a class="btn btn-primary im_edit_forward_btn" ng-click="selectedForward()">
                   Forward <strong class="im_selected_count" ng-show="selectedCount > 0" ng-bind="selectedCount"></strong>
+                </a><a class="btn btn-danger im_edit_delete_btn" ng-click="selectedDelete()">
+                  Delete <strong class="im_selected_count" ng-show="selectedCount > 0" ng-bind="selectedCount"></strong>
                 </a>
               </div>
             </div>

app/partials/message.html

@@ -80,7 +80,7 @@
 
       <div class="im_message_body">
 
-        <a class="im_message_author" ng-click="openUser(historyMessage.from_id)" ng-bind-html="historyMessage.fromUser.rFullName" ng-if="historyMessage.to_id.chat_id > 0"></a>
+        <a class="im_message_author user_color_{{historyMessage.fromPhoto.num}}" ng-click="openUser(historyMessage.from_id)" ng-bind-html="historyMessage.fromUser.rFullName" ng-if="historyMessage.to_id.chat_id > 0"></a>
         <a class="im_message_author" ng-click="openUser(historyMessage.from_id)" ng-bind-html="historyMessage.fromUser.rFirstName" ng-if="!historyMessage.to_id.chat_id"></a>