Browse Source

聊天界面

dgf 8 years ago
parent
commit
f6a3cdf494
2 changed files with 134 additions and 72 deletions
  1. 56 35
      talkview/src/js/directive/currentmessage.js
  2. 78 37
      talkview/src/js/directive/historymessages.js

+ 56 - 35
talkview/src/js/directive/currentmessage.js

@@ -58,8 +58,9 @@
 
             var getFileInfo = function(item) {
                 var file = '“' + getFileName(item) + '”' + '(' + getFileSize(item) + ')';
-
-            }
+                var fileInfo = new Array('您取消了' + file + '的发送,文件传输失败。', '您取消接收' + file + ',文件传输失败。', '对方取消了' + file + '的发送。', '对方取消接收' + file + ',文件发送失败。', '您终止了' + file + '的发送。', '您终止了' + file + '的接收。', '对方中断了' + file + '的发送。', '对方中断了' + file + '的接收。', '对方取消在线传输,转为发送离线文件' + file + '。');
+                return fileInfo;
+            };
 
             var replaceSystemFace = function(content) {
                 //匹配表情
@@ -119,12 +120,7 @@
 
             var replaceImage = function(content) {}
             var html = '';
-            scope.appContent.font = {
-                style: "normal",
-                weight: "normal",
-                size: 9,
-                family: '微软雅黑'
-            };
+            console.log(scope.appContent.font);
             //var message = document.getElementById("sendmessage");
             if (scope.msg.senderDisplayName === undefined || scope.msg.senderDisplayName == '')
                 scope.msg.senderDisplayName = scope.msg.sender;
@@ -134,7 +130,7 @@
             } else if (scope.msg.contentType == 1) {
                 //var style = { style: "normal", weight: "normal" };
                 if (getUserID()) {
-                    var style = scope.msg.style === "" || scope.msg.style === undefined ? {
+                    var style = scope.appContent.font === "" || scope.appContent.font === undefined ? {
                         style: 'normal',
                         weight: 'normal',
                         size: 9,
@@ -146,10 +142,10 @@
                         size: 9,
                         family: '微软雅黑',
                         color: 16777215
-                    }, JSON.parse(scope.appContent.font));
+                    }, scope.appContent.font);
                     style.color = 16777215;
                 } else {
-                    var style = scope.msg.style === "" || scope.msg.style === undefined ? {
+                    var style = scope.appContent.font === "" || scope.appContent.font === undefined ? {
                         style: 'normal',
                         weight: 'normal',
                         size: 9,
@@ -161,7 +157,7 @@
                         size: 9,
                         family: '微软雅黑',
                         color: 0
-                    }, JSON.parse(scope.appContent.font));
+                    }, scope.appContent.font);
                     style.color = 0;
                 }
                 html = '<span class="text-message"' + ' style="font:' + style.style + ' ' + style.weight + ' ' + style.size + 'pt' + ' ' + style.family + ';color:#' + _.padStart(style.color.toString(16), 6, '0') + '">' +
@@ -175,7 +171,8 @@
             } else if (scope.msg.contentType == 3) {
                 var content = JSON.parse(scope.msg.content);
                 console.log(content);
-                html = '<div class="file-message" style="width:265px">' +
+                if (content.status == 2)
+                    html = '<div class="file-message" style="width:265px">' +
                     '<img src="' + getSuffix(content) + '" onError= "this.src = \'../img/file/unkown.png\'">' +
                     '<p><input type="text" readonly="readonly" value="' + getFileName(content) + '"></p>' +
                     '<span>大小:' + getFileSize(content) + '</span>' +
@@ -185,6 +182,30 @@
                     '<a class="text-primary" role="button"><span ng-click="OpenDirectory(msg.content)">打开文件夹</span></a>' +
                     '</div>' +
                     '</div>';
+                else if (content.way == 0 && content.status == 0 && content.direction == 0) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[0] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[1] + '</span></div>';
+                } else if (content.way == 0 && content.status == 0 && content.direction == 1) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[3] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[2] + '</span></div>';
+                } else if (content.way == 0 && content.status == 1 && content.direction == 0) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[4] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[5] + '</span></div>';
+                } else if (content.way == 0 && content.status == 1 && content.direction == 1) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[7] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[6] + '</span></div>';
+                } else if (content.way == 1) {
+                    if (!getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-info"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[8] + '</span></div>';
+                }
             } else if (scope.msg.contentType == 4) {
                 html = '<span class="text-message">' +
                     '<iframe class="map" border=0 src="' + scope.msg.content + '" frameBorder=no></iframe>' +
@@ -194,30 +215,28 @@
                     '<audio src="' + scope.msg.content + '" controls="controls">' +
                     '</audio>' +
                     '</span>';
-            } else if (scope.msg.contentType == 6) {
-                var content = JSON.parse(scope.msg.content);
-                html = getFileInfo(content);
-                // html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error">' +
-                //     '<div><span class="glyphicon glyphicon-remove-sign"></span><span>您取消了“办公微助引导页.rar”(22.72MB)的发送,文件传输失败。</span>' +
-                //     '</div></div>';
             }
 
-            if (getUserID()) {
-                var html_g = '<p><strong>' +
-                    scope.msg.senderDisplayName +
-                    '</strong><small class="text-muted">-' +
-                    getTime(scope.msg) + '</small></p>' +
-                    '<div class="wellself m-l-xs m-t-xs fit-content" >' +
-                    '<div class="text-point"></div>' + html +
-                    '</div>';
+            if (scope.msg.contentType == 3 && content.status !== 2) {
+                var html_g = html;
             } else {
-                var html_g = '<p><strong>' +
-                    scope.msg.senderDisplayName +
-                    '</strong><small class="text-muted">-' +
-                    getTime(scope.msg) + '</small></p>' +
-                    '<div class="well m-l-xs m-t-xs fit-content" >' +
-                    '<div class="text-point"></div>' + html +
-                    '</div>';
+                if (getUserID()) {
+                    var html_g = '<p><strong>' +
+                        scope.msg.senderDisplayName +
+                        '</strong><small class="text-muted">-' +
+                        getTime(scope.msg) + '</small></p>' +
+                        '<div class="wellself m-l-xs m-t-xs fit-content" >' +
+                        '<div class="text-point"></div>' + html +
+                        '</div>';
+                } else {
+                    var html_g = '<p><strong>' +
+                        scope.msg.senderDisplayName +
+                        '</strong><small class="text-muted">-' +
+                        getTime(scope.msg) + '</small></p>' +
+                        '<div class="well m-l-xs m-t-xs fit-content" >' +
+                        '<div class="text-point"></div>' + html +
+                        '</div>';
+                }
             }
             console.log(html_g);
 
@@ -233,13 +252,15 @@
     };
     /* @ngInject */
     function ControllerController($scope, $timeout, $location, $anchorScroll, $sce) {
+        $scope.$on('font_changed', function(event, data) {
+            $scope.appContent.font = JSON.parse(data);
+        });
         $scope.OpenFile = function(item) {
             var file = JSON.parse(item);
             return lxtalkClient.Invoke('{15180DEF-D508-45F7-BAEB-6486CD8752C8}', 'OpenFile', JSON.stringify(file), $scope);
         };
         $scope.OpenDirectory = function(item) {
             var file = JSON.parse(item);
-            console.log(JSON.stringify(file));
             return lxtalkClient.Invoke('{15180DEF-D508-45F7-BAEB-6486CD8752C8}', 'OpenDirectory', JSON.stringify(file), $scope);
         };
         $scope.onLoad = function() {

+ 78 - 37
talkview/src/js/directive/historymessages.js

@@ -5,9 +5,9 @@
         .module('appMessage')
         .directive('ngHistoryMsg', HistoryMsg);
 
-    HistoryMsg.inject = ['$location', '$anchorScroll', '$filter', '$compile'];
+    HistoryMsg.inject = ['$location', '$anchorScroll', '$filter', '$compile', '$timeout'];
 
-    function HistoryMsg($location, $anchorScroll, $filter, $compile) {
+    function HistoryMsg($location, $anchorScroll, $filter, $compile, $timeout) {
         var directive = {
             link: link,
             restrict: 'A',
@@ -58,6 +58,12 @@
                 return $filter("date")(item.ts, "yyyy-MM-dd HH:mm:ss");
             };
 
+            var getFileInfo = function(item) {
+                var file = '“' + getFileName(item) + '”' + '(' + getFileSize(item) + ')';
+                var fileInfo = new Array('您取消了' + file + '的发送,文件传输失败。', '您取消接收' + file + ',文件传输失败。', '对方取消了' + file + '的发送。', '对方取消接收' + file + ',文件发送失败。', '您终止了' + file + '的发送。', '您终止了' + file + '的接收。', '对方中断了' + file + '的发送。', '对方中断了' + file + '的接收。', '对方取消在线传输,转为发送离线文件' + file + '。');
+                return fileInfo;
+            };
+
             var replaceSystemFace = function(content) {
                 //匹配表情
                 var g = (/\/\:([\w]+)/).exec(content);
@@ -70,11 +76,13 @@
                 //匹配截图
                 var g = (/\[image\-src=\"([\w\W]+?)\"\]/i).exec(content);
                 while (g !== null) {
-                    content = content.replace(g[0],
-                        '<a class="thumbnail"' + '>' +
-                        '<img ng-load="scrollController()" ng-error="scrollController()" onclick="javascript:window.open(this.src,\'\',\'height=600,width=800,top=200,left=200\')" style="max-width:300px;max-height:250px;" src="local://' + scope.appContent.directory.received + g[1] + '.JPG' + '" alt="截图缩略图" >' +
-                        '</a>'
-                    );
+                    content = content.replace(g[0], function() {
+                        scope["img_" + g[1]] = "local://" + scope.appContent.directory.received + g[1] + ".JPG";
+                        var html = '<a class="thumbnail"' + '>' +
+                            '<img ng-click="showImage(\'' + g[1] + '\')" ng-error="onFaceLoadError(\'' + g[1] + '\')" ng-load="scrollController()" style="max-width:300px;max-height:250px;" ng-src="{{img_' + g[1] + '}}">' +
+                            '</a>';
+                        return html;
+                    });
                     g = (/\[image\-src=\"([\w\W]+?)\"\]/i).exec(content);
                 }
                 //匹配网址
@@ -113,13 +121,8 @@
             };
             var replaceImage = function(content) {}
             var html = '';
-            scope.appContent.font = {
-                style: "normal",
-                weight: "normal",
-                size: 9,
-                family: '微软雅黑'
-            };
             //var message = document.getElementById("loadmore");
+            console.log(scope.appContent.font);
             if (scope.msg.senderDisplayName === undefined || scope.msg.senderDisplayName == '')
                 scope.msg.senderDisplayName = scope.msg.sender;
             // 消息类型([1,文本消息],[2,图片消息],[3,文件消息], [4,位置消息],[5,语音消息])
@@ -128,7 +131,7 @@
             } else if (scope.msg.contentType == 1) {
                 //var style = { style: "normal", weight: "normal" };
                 if (getUserID()) {
-                    var style = scope.msg.style === "" || scope.msg.style === undefined ? {
+                    var style = scope.appContent.font === "" || scope.appContent.font === undefined ? {
                         style: 'normal',
                         weight: 'normal',
                         size: 9,
@@ -140,10 +143,10 @@
                         size: 9,
                         family: '微软雅黑',
                         color: 16777215
-                    }, JSON.parse(scope.appContent.font));
+                    }, scope.appContent.font);
                     style.color = 16777215;
                 } else {
-                    var style = scope.msg.style === "" || scope.msg.style === undefined ? {
+                    var style = scope.appContent.font === "" || scope.appContent.font === undefined ? {
                         style: 'normal',
                         weight: 'normal',
                         size: 9,
@@ -155,7 +158,7 @@
                         size: 9,
                         family: '微软雅黑',
                         color: 0
-                    }, JSON.parse(scope.appContent.font));
+                    }, scope.appContent.font);
                     style.color = 0;
                 }
                 html = '<span class="text-message"' + ' style="font:' + style.style + ' ' + style.weight + ' ' + style.size + 'pt' + ' ' + style.family + ';color:#' + _.padStart(style.color.toString(16), 6, '0') + '">' +
@@ -169,7 +172,8 @@
             } else if (scope.msg.contentType == 3) {
                 var content = JSON.parse(scope.msg.content);
                 console.log(content);
-                html = '<div class="file-message" style="width:265px">' +
+                if (content.status == 2)
+                    html = '<div class="file-message" style="width:265px">' +
                     '<img src="' + getSuffix(content) + '" onError= "this.src = \'../img/file/unkown.png\'">' +
                     '<p><input type="text" readonly="readonly" value="' + getFileName(content) + '"></p>' +
                     '<span>大小:' + getFileSize(content) + '</span>' +
@@ -179,6 +183,30 @@
                     '<a class="text-primary" role="button"><span ng-click="OpenDirectory(msg.content)">打开文件夹</span></a>' +
                     '</div>' +
                     '</div>';
+                else if (content.way == 0 && content.status == 0 && content.direction == 0) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[0] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[1] + '</span></div>';
+                } else if (content.way == 0 && content.status == 0 && content.direction == 1) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[3] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[2] + '</span></div>';
+                } else if (content.way == 0 && content.status == 1 && content.direction == 0) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[4] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[5] + '</span></div>';
+                } else if (content.way == 0 && content.status == 1 && content.direction == 1) {
+                    if (getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[7] + '</span></div>';
+                    else
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-error"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[6] + '</span></div>';
+                } else if (content.way == 1) {
+                    if (!getUserID())
+                        html = '<div class="well m-l-xs m-t-xs fit-content" id="file-info"><span class="glyphicon glyphicon-remove-sign"></span><span>' + getFileInfo(content)[8] + '</span></div>';
+                }
             } else if (scope.msg.contentType == 4) {
                 html = '<span class="text-message">' +
                     '<iframe class="map" border=0 src="' + scope.msg.content + '" frameBorder=no></iframe>' +
@@ -190,24 +218,26 @@
                     '</span>';
             }
 
-            if (getUserID()) {
-                var html_g =
-                    '<p><strong>' +
-                    scope.msg.senderDisplayName +
-                    '</strong><small class="text-muted">-' +
-                    getTime(scope.msg) + '</small></p>' +
-                    '<div class="wellself m-l-xs m-t-xs fit-content" >' +
-                    '<div class="text-point"></div>' + html +
-                    '</div>';
+            if (scope.msg.contentType == 3 && content.status !== 2) {
+                var html_g = html;
             } else {
-                var html_g =
-                    '<p><strong>' +
-                    scope.msg.senderDisplayName +
-                    '</strong><small class="text-muted">-' +
-                    getTime(scope.msg) + '</small></p>' +
-                    '<div class="well m-l-xs m-t-xs fit-content" >' +
-                    '<div class="text-point"></div>' + html +
-                    '</div>';
+                if (getUserID()) {
+                    var html_g = '<p><strong>' +
+                        scope.msg.senderDisplayName +
+                        '</strong><small class="text-muted">-' +
+                        getTime(scope.msg) + '</small></p>' +
+                        '<div class="wellself m-l-xs m-t-xs fit-content" >' +
+                        '<div class="text-point"></div>' + html +
+                        '</div>';
+                } else {
+                    var html_g = '<p><strong>' +
+                        scope.msg.senderDisplayName +
+                        '</strong><small class="text-muted">-' +
+                        getTime(scope.msg) + '</small></p>' +
+                        '<div class="well m-l-xs m-t-xs fit-content" >' +
+                        '<div class="text-point"></div>' + html +
+                        '</div>';
+                }
             }
             console.log(html_g);
 
@@ -227,14 +257,16 @@
         }
     };
     /* @ngInject */
-    function ControllerController($scope, $location, $anchorScroll) {
+    function ControllerController($scope, $timeout, $location, $anchorScroll, $sce) {
+        $scope.$on('font_changed', function(event, data) {
+            $scope.appContent.font = JSON.parse(data);
+        });
         $scope.OpenFile = function(item) {
             var file = JSON.parse(item);
             return lxtalkClient.Invoke('{15180DEF-D508-45F7-BAEB-6486CD8752C8}', 'OpenFile', JSON.stringify(file), $scope);
         };
         $scope.OpenDirectory = function(item) {
             var file = JSON.parse(item);
-            console.log(JSON.stringify(file));
             return lxtalkClient.Invoke('{15180DEF-D508-45F7-BAEB-6486CD8752C8}', 'OpenDirectory', JSON.stringify(file), $scope);
         };
         $scope.scrollController = function() {
@@ -243,5 +275,14 @@
             } else
                 window.scrollTo(0, document.body.scrollHeight - $scope.height);
         };
+        $scope.onFaceLoadError = function(md5) {
+            $scope["img_" + md5] = "local://" + $scope.appContent.directory.base + "Images\\" + "Loading.gif";
+            $timeout();
+            lxtalkClient.Invoke('{15180DEF-D508-45F7-BAEB-6486CD8752C8}', 'LoadImages', JSON.stringify({ uid: $scope.msg.uid, md5: [md5] }), function() {
+                console.log($scope["img_" + md5]);
+                $scope["img_" + md5] = "local://" + $scope.appContent.directory.received + md5 + ".JPG";
+                $timeout();
+            });
+        };
     }
 })();