Commit 5016151a by Takuya Ogawa

Merge branch 'features/1.3.0_chat' into 'features/1.3.0'

Features/1.3.0 chat

See merge request !44
parents 5b22d85f bd960d1d
package jp.agentec.abook.abv.bl.acms.client.json;
import com.sun.org.apache.bcel.internal.generic.PUSH;
import jp.agentec.abook.abv.bl.acms.client.AcmsClient;
import jp.agentec.abook.abv.bl.common.exception.AcmsException;
import jp.agentec.abook.abv.bl.common.exception.JSONValidationException;
......
const SERVER_URL = "http://192.168.1.22:3000"
const SERVER_URL = CHAT_SERVER_URL + ':' + CHAT_SERVER_PORT;
const socket = io(SERVER_URL);
// 招待するメンバーを保存する変数
......@@ -84,12 +84,12 @@ function isLandscapeMode(){
return $(this).width() > $(this).height()
}
//userProfileImagePathが使えるpathかをcheckしてpathをreturn
function profileImgPathValidCheck(path) {
if(path == undefined || path.includes('acms/images/') == false) {
//userProfileImagePathが使えるイメージの拡張子をcheckしてpathをreturn
function profileImgPathValidCheck(path, checkProfileExist) {
if (checkProfileExist == 1 && path.length > 0) {
path = './images/user-profile.png'
}
return path
return path;
}
window.onload = function(){
......@@ -228,14 +228,17 @@ socket.on('refreshRoomList', function(rooms, activeRoomId = null){
});
}
});
jQuery('.roomListIcon').show()
jQuery('#createChatRoom').show()
// チャットルームリストに追加する
jQuery('#room_list').append(obj);
});
if(rooms.length > 0){
jQuery('.roomListIcon').show()
} else {
jQuery('.roomListIcon').hide()
}
jQuery('#createChatRoom').show()
// Rotate
if(isLandscapeMode()) {
$(".chat_list").removeClass("col-12").addClass("col-6");
......@@ -363,7 +366,7 @@ socket.on('newMessage', function (message){
}
let messageTime = formatDate(message.createdAt);
//userProfilePathが使えるpathかをcheckして使えないpathの場合、default画像の経路に変更
message.profileImagePath = profileImgPathValidCheck(message.profileImagePath)
message.profileImagePath = profileImgPathValidCheck(message.profileImagePath, message.checkProfileExist)
try {
message.text = decodeURIComponent(message.text)
......@@ -420,7 +423,7 @@ socket.on('loadMessages', function(messages, shopMemberId){
let messageTime = formatDate(message.time.time);
//userProfilePathが使えるpathかをcheckして使えないpathの場合、default画像の経路に変更
message.profileImagePath = profileImgPathValidCheck(message.profileImagePath)
message.profileImagePath = profileImgPathValidCheck(message.profileImagePath, message.checkProfileExist)
try {
message.message = decodeURIComponent(message.message)
......@@ -490,24 +493,82 @@ jQuery('#image-form').on('submit', function(e){
jQuery('.loader').addClass('active');
showLoadingIndicator();
var fd = new FormData($(this)[0]);
// ファイルアップロード
//画像の大きさが500pixelより大きかったら、thumbnailを生成
createThumbnailAndUpload(file, function(resizeFile, thumbnailCreated){
if(resizeFile && thumbnailCreated) {
//ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
fd.append('thumb', resizeFile)
}
// イメージをアップロード
uploadImage(fd)
})
// // ファイルアップロード
// jQuery.ajax({
// async: true,
// url: SERVER_URL+"/upload",
// type: "post",
// data: fd,
// contentType: false,
// processData: false
// }).done(function( res ) {
// let imgPath = SERVER_URL + res.path;
// let downloadPath = SERVER_URL + '/download' + res.path;
// // アップロードが終了した後ローディング画面から離れてメッセージをメッセージを転送する
// const lightbox = jQuery('<a/>',{href:imgPath, 'data-lightbox':'attachedImages','data-title':res.fileName});
// const image = jQuery('<img/>',{src:imgPath, width:'auto',style:'max-width:100%'});
// const downloadIcon = jQuery('<a/>',{href:downloadPath, class:'fa fa-download', download:res.fileName});
// lightbox.append(image);
// lightbox.append(downloadIcon);
//
// let text = lightbox.prop('outerHTML')
// let encodedText
// try {
// encodedText = encodeURIComponent(text)
// } catch(e) {
// encodedText = text;
// }
//
// socket.emit('createMessage', {
// text: encodedText
// }, 1);
// jQuery('.overlay').removeClass('active undismissable');
// jQuery('.loader').removeClass('active');
// dismissLoadingIndicator();
// });
}
});
// Ajaxでイメージをアップロードする
function uploadImage(formData) {
jQuery.ajax({
async: true,
url: SERVER_URL+"/upload",
type: "post",
data: fd,
data: formData,
contentType: false,
processData: false
}).done(function( res ) {
let imgPath = SERVER_URL + res.path;
}).done(function( res ){
//8
var imgPath = SERVER_URL + res.path;
var imageName = res.fileName
if(res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath = SERVER_URL + res.thumbnailPath;
imageName = 'thumb_' + imageName;
}
let downloadPath = SERVER_URL + '/download' + res.path;
// アップロードが終了した後ローディング画面から離れてメッセージをメッセージを転送する
const lightbox = jQuery('<a/>',{href:imgPath, 'data-lightbox':'attachedImages','data-title':res.fileName});
const lightbox = jQuery('<a/>',{href:imgPath, 'data-lightbox':'attachedImages','data-title':imageName});
const image = jQuery('<img/>',{src:imgPath, width:'auto',style:'max-width:100%'});
const downloadIcon = jQuery('<a/>',{href:downloadPath, class:'fa fa-download', download:res.fileName});
lightbox.append(image);
lightbox.append(downloadIcon);
let text = lightbox.prop('outerHTML')
let encodedText
try {
......@@ -519,12 +580,64 @@ jQuery('#image-form').on('submit', function(e){
socket.emit('createMessage', {
text: encodedText
}, 1);
jQuery('.overlay').removeClass('active undismissable');
jQuery('.loader').removeClass('active');
dismissLoadingIndicator();
})
}
// Thumbnailのファイルを生成する。
function createThumbnailAndUpload(sourceImage, callback) {
const fileReader = new FileReader();
const img = new Image();
fileReader.onloadend = function(){
img.src = fileReader.result
}
img.onload = function() {
const elem = document.createElement('canvas');
var rate
var width = img.width
var height = img.height
if((img.width <= 500) && (img.height <= 500))
{
callback(undefined, false)
return
}
if(img.width > img.height)
{
rate = 500/img.width
} else {
rate = 500/img.height
}
elem.width = width * rate;
elem.height = height * rate;
const ctx = elem.getContext('2d')
ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, elem.width, elem.height);
//ctx.drawImage(img, 0, 0, width, height);
fetch(elem.toDataURL("image/jpeg"))
.then(function(res){
return res.arrayBuffer();
})
.then(function(buf){
const newFile = new File([buf], sourceImage.name, {type:"image/jpeg"});
callback(newFile, true)
}).catch((error) => { //fetch Error catch Block
if(error) {
console.log(error)
}
});
}
});
fileReader.readAsDataURL(sourceImage);
}
/* --------------------------------------------------- */
/* Nav Bar Functions */
......@@ -747,11 +860,11 @@ socket.on('refreshUserListInGroup', function(users, isInvite){
//loadingIndicatorを表示
showLoadingIndicator();
user.profileimagepath = profileImgPathValidCheck(user.profileimagepath);
user.profileImagePath = profileImgPathValidCheck(user.profileImagePath, user.checkProfileExist);
let html = Mustache.render(template, {
id: user.shopMemberId,
profileImage: user.profileimagepath,
profileImage: user.profileImagePath,
name: user.loginId
});
......@@ -764,7 +877,7 @@ socket.on('refreshUserListInGroup', function(users, isInvite){
})
} else {
//add
globalSelectedUserList.push({loginId:user.loginId, shopMemberId : user.shopMemberId, profileImagePath: user.profileimagepath});
globalSelectedUserList.push({loginId:user.loginId, shopMemberId : user.shopMemberId, profileImagePath: user.profileImagePath});
}
jQuery(this).find('.userCheckBox').toggleClass('active');
......@@ -878,7 +991,7 @@ jQuery('a[data-toggle="pill"]').on('show.bs.tab', function (e) {
dismissLoadingIndicator();
break;
case '#pills-chatlist':
jQuery('.roomListIcon, .titleRoomName, #backButton').show();
jQuery('.titleRoomName, #backButton').show();
jQuery('.chatRoomIcon, #backButton, #userSelectionConfirmBtn, #newRoomName, #userSelectionDeleteBtn').hide();
// set Title
......
var CHAT_SERVER_URL = "Node Server Address";
var CHAT_SERVER_PORT = 3000;
......@@ -351,10 +351,7 @@
<script src="./js/language_ko.js" charset="UTF-8"></script>
<script src="./js/language_ja.js" charset="UTF-8"></script>
<script src="./js/language_en.js" charset="UTF-8"></script>
<script src="./js/config.js"></script>
<script src="./js/chat.js"></script>
<script>
document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] +
':35729/livereload.js?snipver=1"></' + 'script>')
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment