truncating filename without extension (#1363)

app/js/directives.js

@@ -390,6 +390,20 @@ angular.module('myApp.directives', ['myApp.filters'])
         $scope.videoOpen = function () {
           AppDocsManager.openVideo($scope.media.document.id, $scope.messageId)
         }
+        if ($scope.media.document.file_name) {
+          var fileNameParts = $scope.media.document.file_name.split('.')
+          if (fileNameParts.length > 1) {
+            $scope.media_file_ext = '.' + fileNameParts.pop()
+            $scope.media_file_name_without_ext = fileNameParts.join('.')
+            if (!$scope.media_file_name_without_ext) {
+              $scope.media_file_name_without_ext = $scope.media_file_ext
+              $scope.media_file_ext = ''
+            }
+          } else {
+            $scope.media_file_ext = ''
+            $scope.media_file_name_without_ext = fileNameParts[0]
+          }
+        }
       }
     }
   })
@@ -482,7 +496,25 @@ angular.module('myApp.directives', ['myApp.filters'])
       scope: {
         'media': '=myMessagePending'
       },
-      templateUrl: templateUrl('message_attach_pending')
+      templateUrl: templateUrl('message_attach_pending'),
+      link: link
+    }
+
+    function link ($scope, element, attrs) {
+      if ($scope.media.file_name) {
+        var fileNameParts = $scope.media.file_name.split('.')
+        if (fileNameParts.length > 1) {
+          $scope.media_file_ext = '.' + fileNameParts.pop()
+          $scope.media_file_name_without_ext = fileNameParts.join('.')
+          if (!$scope.media_file_name_without_ext) {
+            $scope.media_file_name_without_ext = $scope.media_file_ext
+            $scope.media_file_ext = ''
+          }
+        } else {
+          $scope.media_file_ext = ''
+          $scope.media_file_name_without_ext = fileNameParts[0]
+        }
+      }
     }
   })
 

app/less/app.less

@@ -1872,6 +1872,20 @@ img.im_message_document_thumb {
   vertical-align: text-top;
   white-space: nowrap;
   text-overflow: ellipsis;
+
+  &:after {
+    content: attr(data-name);
+    display: block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  &:before {
+    content: attr(data-ext);
+    float: right;
+  }
+  &:hover:before {
+    text-decoration: underline;
+  }
 }
 .im_message_document_size {
   color: #999;

app/partials/desktop/message_attach_document.html

@@ -64,7 +64,7 @@
 
     <div class="im_message_document_info">
       <div class="im_message_document_name_wrap">
-        <span class="copyonly">[</span><a href="" ng-attr-title="{{media.document.file_name}}" ng-click="docOpen()" class="im_message_document_name" ng-bind="::media.document.file_name"></a><span class="copyonly">]</span>
+        <a href="" ng-attr-title="{{media.document.file_name}}" ng-attr-data-name="{{media_file_name_without_ext}}" ng-attr-data-ext="{{media_file_ext}}" ng-click="docOpen()" class="im_message_document_name"></a><span class="copyonly">[<span ng-bind="::media.document.file_name"></span>]</span>
         <span class="im_message_document_size" ng-if="!media.document.progress.enabled" ng-bind="::media.document.size | formatSize"></span>
         <span class="im_message_document_size" ng-if="media.document.progress.enabled" ng-bind="media.document.progress | formatSizeProgress"></span>
       </div>

app/partials/desktop/message_attach_pending.html

@@ -4,7 +4,7 @@
   </div>
   <div class="im_message_document_info">
     <div class="im_message_document_name_wrap">
-      <span ng-attr-title="{{media.file_name}}" class="im_message_document_name" ng-bind="::media.file_name"></span>
+      <span ng-attr-title="{{media.file_name}}" ng-attr-data-name="{{media_file_name_without_ext}}" ng-attr-data-ext="{{media_file_ext}}" class="im_message_document_name"></span>
       <span class="im_message_document_size" ng-if="media.progress" ng-bind="media.progress | formatSizeProgress"></span>
     </div>
     <div class="clearfix im_message_cancelable_progress_wrap">

app/partials/mobile/message_attach_document.html

@@ -41,7 +41,7 @@
 
     <div class="im_message_document_info">
       <div class="im_message_document_name_wrap">
-        <a href="" ng-click="docOpen()" class="im_message_document_name" ng-bind="::media.document.file_name"></a>
+        <a href="" ng-attr-data-name="{{media_file_name_without_ext}}" ng-attr-data-ext="{{media_file_ext}}" ng-click="docOpen()" class="im_message_document_name"></a>
         <span class="im_message_document_size" ng-if="!media.document.progress.enabled" ng-bind="::media.document.size | formatSize"></span>
         <span class="im_message_document_size" ng-if="media.document.progress.enabled" ng-bind="media.document.progress | formatSizeProgress"></span>
       </div>

app/partials/mobile/message_attach_pending.html

@@ -4,7 +4,7 @@
   </div>
   <div class="im_message_document_info">
     <div class="im_message_document_name_wrap">
-      <span class="im_message_document_name" ng-bind="::media.file_name"></span>
+      <span class="im_message_document_name" ng-attr-data-name="{{media_file_name_without_ext}}" ng-attr-data-ext="{{media_file_ext}}"></span>
       <span class="im_message_document_size" ng-if="media.progress" ng-bind="media.progress | formatSizeProgress"></span>
     </div>
     <div class="clearfix im_message_cancelable_progress_wrap">