Skip to content

C
chat_webview
Commit 643b084a by Lee Munkyeong
Options

Merge branch 'origin/develop_apply_design_contant' into 'origin/develop_apply_design' 

Origin/develop apply design contant

See merge request !8
parents 40227def c38bbcc4
Showing with 3080 additions and 374 deletions
public_new/chat.html
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail4 thubnail"> <div class="thumbnail4 thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
...@@ -96,7 +96,7 @@ ...@@ -96,7 +96,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail3 thubnail"> <div class="thumbnail3 thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
...@@ -128,7 +128,7 @@ ...@@ -128,7 +128,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail2 thubnail"> <div class="thumbnail2 thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
...@@ -158,7 +158,7 @@ ...@@ -158,7 +158,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -194,7 +194,7 @@ ...@@ -194,7 +194,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -221,7 +221,7 @@ ...@@ -221,7 +221,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -248,7 +248,7 @@ ...@@ -248,7 +248,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -274,7 +274,7 @@ ...@@ -274,7 +274,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -301,7 +301,7 @@ ...@@ -301,7 +301,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -328,7 +328,7 @@ ...@@ -328,7 +328,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -355,7 +355,7 @@ ...@@ -355,7 +355,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -382,7 +382,7 @@ ...@@ -382,7 +382,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -409,7 +409,7 @@ ...@@ -409,7 +409,7 @@
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
......
public_new/chat_add_user.html
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -96,7 +96,7 @@ ...@@ -96,7 +96,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -123,7 +123,7 @@ ...@@ -123,7 +123,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -150,7 +150,7 @@ ...@@ -150,7 +150,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -181,7 +181,7 @@ ...@@ -181,7 +181,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -208,7 +208,7 @@ ...@@ -208,7 +208,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -239,7 +239,7 @@ ...@@ -239,7 +239,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -266,7 +266,7 @@ ...@@ -266,7 +266,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -301,7 +301,7 @@ ...@@ -301,7 +301,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -328,7 +328,7 @@ ...@@ -328,7 +328,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -358,7 +358,7 @@ ...@@ -358,7 +358,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -385,7 +385,7 @@ ...@@ -385,7 +385,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
......
public_new/chat_add_user_confirm.html
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -94,7 +94,7 @@ ...@@ -94,7 +94,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -110,7 +110,7 @@ ...@@ -110,7 +110,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -126,7 +126,7 @@ ...@@ -126,7 +126,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -142,7 +142,7 @@ ...@@ -142,7 +142,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -158,7 +158,7 @@ ...@@ -158,7 +158,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -174,7 +174,7 @@ ...@@ -174,7 +174,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
......
public_new/chat_make_room.html
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail4 thubnail"> <div class="thumbnail4 thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -118,7 +118,7 @@ ...@@ -118,7 +118,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -145,7 +145,7 @@ ...@@ -145,7 +145,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -176,7 +176,7 @@ ...@@ -176,7 +176,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -203,7 +203,7 @@ ...@@ -203,7 +203,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -234,7 +234,7 @@ ...@@ -234,7 +234,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -261,7 +261,7 @@ ...@@ -261,7 +261,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -296,7 +296,7 @@ ...@@ -296,7 +296,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -323,7 +323,7 @@ ...@@ -323,7 +323,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -353,7 +353,7 @@ ...@@ -353,7 +353,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -380,7 +380,7 @@ ...@@ -380,7 +380,7 @@
</div> </div>
</div> </div>
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
......
public_new/chat_make_room_confirm.html
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -68,7 +68,7 @@ ...@@ -68,7 +68,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -100,7 +100,7 @@ ...@@ -100,7 +100,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -116,7 +116,7 @@ ...@@ -116,7 +116,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -132,7 +132,7 @@ ...@@ -132,7 +132,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -148,7 +148,7 @@ ...@@ -148,7 +148,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -164,7 +164,7 @@ ...@@ -164,7 +164,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -180,7 +180,7 @@ ...@@ -180,7 +180,7 @@
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
......
public_new/collaboration_overlay_add_user_list.html
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -109,7 +109,7 @@ ...@@ -109,7 +109,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -133,7 +133,7 @@ ...@@ -133,7 +133,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
...@@ -181,7 +181,7 @@ ...@@ -181,7 +181,7 @@
</div> </div>
</div> </div>
<div class="user_item_l"> <div class="user_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div> </div>
</div> </div>
......
public_new/contact.html
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
</div> </div>
<div class="col-4 p-0"> <div class="col-4 p-0">
<div class="nav-item p-0"> <div class="nav-item p-0">
<h1 class="nav-ttl">コンタクト</h1> <h1 class="nav-ttl" id="title" >コンタクト</h1>
</div> </div>
</div> </div>
<div class="col-4 pl-0"> <div class="col-4 pl-0">
...@@ -48,204 +48,55 @@ ...@@ -48,204 +48,55 @@
<a href="#" class="cancel none">キャンセル</a> <a href="#" class="cancel none">キャンセル</a>
</form> </form>
</div> </div>
<div class="content chat_list">
<!-- タブ --> <ul class="p-0 chat_make_room_list">
<div class="content tabs"> <li class="d-flex align-items-center">
<input id="tab1" type="radio" name="tab_item" checked> <a href="#" data-toggle="modal" data-target="#myNameCard" style="width: 100%;">
<label class="tab_item" for="tab1">マイグループ</label> <div class="chat_item d-flex flex-row align-items-center">
<input id="tab2" type="radio" name="tab_item"> <div class="chat_item_l">
<label class="tab_item" for="tab2">全グループ</label> <div class="thumbnail">
<div class="tab_content" id="tab1_content"> <div class="img_wrap"><img id="myImg" src="img/noImage.png" alt="サムネイル画像" /></div>
<div class="chat_list">
<!-- お気に入りグループ -->
<div class="category"><div class="category_name"><span>お気に入り</span></div></div>
<ul class="p-0 chat_make_room_list">
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<img src="icon/icon_folder.png" alt="フォルダ" />
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">グループ名グループ名グループ名グループ名グループ名グループ名グループ名グループ名グループ名グループ名</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前　太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div> </div>
</div> </div>
</li> <div class="chat_item_m px-0">
</ul>
<!-- マイグループ -->
<div class="category"><div class="category_name"><span>マイグループ 本社 > 経理部</span></div></div>
<ul class="p-0 chat_make_room_list">
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前　太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<span class="star disable"></span> <div class="chat_item_t">
</div> <span class="chat_item_ttl" id="myName"></span>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div> </div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前　太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div> </div>
</div> </div>
</li> </div>
</ul> </a>
<!-- マイグループ --> </li>
<div class="category"><div class="category_name"><span>マイグループマイグループマイグループマイグループマイグループマイグループ2</span></div> </div> </ul>
<ul class="p-0 chat_make_room_list"> </div>
<li class="d-flex align-items-center"> <!-- タブ -->
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="content tabs">
<div class="thubnail"> <input id="tabMyGroup" type="radio" name="tab_item" checked>
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div> <label class="tab_item" for="tabMyGroup">マイグループ</label>
</div> <input id="tabAllGroup" type="radio" name="tab_item">
</div> <label class="tab_item" for="tabAllGroup">全グループ</label>
<div class="chat_item_m px-0"> <div class="tab_content" id="tab1_content">
<div class="d-flex flex-column"> <div class="chat_list" id="myContactList">
<div class="chat_item_t"> <!-- お気に入りグループ -->
<span class="chat_item_ttl">名前　太郎</span> <div class="category"><div class="category_name"><span>お気に入り</span></div></div>
</div>
</div> <div id="favoriteList"></div>
</div> <div id="myGroupList"></div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前　太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
</ul>
</div> </div>
</div> </div>
<div class="tab_content" id="tab2_content"> <div class="tab_content" id="tab2_content">
<div class="breadcrumb"> <div class="breadcrumb" id="groupPathArea"></div>
<a href="#" class="breadcrumb_item"><span>Root</span></a>
<a href="#" class="breadcrumb_item"><span>GroupA</span></a>
<a href="#" class="breadcrumb_item"><span>GroupASubB</span></a>
</div>
<div class="chat_list"> <div class="chat_list">
<!-- 全グループ --> <!-- 全グループ -->
<ul class="p-0 chat_make_room_list"> <ul class="p-0 chat_make_room_list">
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100"> <a href="#" class="w-100" id="rootGroupBtn">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<img src="icon/icon_prev_top.png" alt="トップグループに戻る" /> <img src="icon/icon_prev_top.png" alt="トップグループに戻る" />
</div> </div>
</div> </div>
...@@ -258,40 +109,31 @@ ...@@ -258,40 +109,31 @@
</div> </div>
</div> </div>
</a> </a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li> </li>
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100"> <a href="#" class="w-100" id="parentGroupBtn">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<img src="icon/icon_prev.png" alt="上位グループに戻る" /> <img src="icon/icon_prev.png" alt="上位グループに戻る" />
</div> </div>
</div> </div>
<div class="chat_item_m px-0"> <div class="chat_item_m px-0">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<div class="chat_item_t"> <div class="chat_item_t">
<span class="chat_item_ttl">トップグループに戻る</span> <span class="chat_item_ttl">上位グループに戻る</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</a> </a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li> </li>
<div id="childGroupListArea">
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100"> <a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<img src="icon/icon_folder.png" alt="フォルダ" /> <img src="icon/icon_folder.png" alt="フォルダ" />
</div> </div>
</div> </div>
...@@ -310,75 +152,8 @@ ...@@ -310,75 +152,8 @@
</div> </div>
</div> </div>
</li> </li>
<li class="d-flex align-items-center"> </div>
<a href="chat_room.html" class="w-100"> <div id="userInGroupList"></div>
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前　太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
</ul> </ul>
</div> </div>
</div> </div>
...@@ -418,13 +193,51 @@ ...@@ -418,13 +193,51 @@
</footer> </footer>
<!-- ローディング --> <!-- ローディング -->
<!--#include virtual="loading.html" --> <div id="loadingArea"></div>
<div id="myProfileModal"></div>
<div id="userProfileModal"></div>
<script src="./js/libs/jquery-3.3.1.min.js"></script>
<script src="./js/libs/moment.js"></script>
<script src="./js/libs/locale/ko.js" charset="UTF-8"></script>
<script src="./js/libs/locale/ja.js" charset="UTF-8"></script>
<script src="./js/libs/mustache.min.js"></script>
<script src="./js/libs/bootstrap.min.js"></script>
<script src="./js/libs/jquery.mark.min.js"></script>
<script src="./js/contact.js"></script>
<script src="./js/common.js"></script>
<script src="./js/language.js"></script>
<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/constant.js"></script>
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chat-util.js"></script>
<script src="./js/chat-db.js"></script>
<script>
String.prototype.replaceAll = function(org, dest) {
return this.split(org).join(dest);
}
let CHAT_SERVER_URL = '';
let CMS_SERVER_URL = '';
let ASSET_PATH = './';
let PLATFORM = '';
let IS_MOBILE = true;
let IS_ONLINE = false;
$("#loadingArea").load("./loading.html");
android.getLoginParameter();
android.getGlobalParameter();
<script src="./js/libs/jquery-3.3.1.min.js"></script> function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
<script src="./js/libs/moment.js"></script> CHAT_SERVER_URL = chatServerUrl;
<script src="./js/libs/bootstrap.min.js"></script> CMS_SERVER_URL = cmsServerUrl;
<script src="./js/libs/jquery.mark.min.js"></script> PLATFORM = platform;
<script src="./js/contact.js"></script> IS_MOBILE = isMobile;
<script src="./js/common.js"></script> IS_ONLINE = isOnline;
CHAT_UI.refreshContactScreen();
};
</script>
</body> </body>
</html> </html>
public_new/css/chat.css
...@@ -37,6 +37,11 @@ input[name="tab_item"] { ...@@ -37,6 +37,11 @@ input[name="tab_item"] {
display: block; display: block;
} }
#tabMyGroup:checked ~ #tab1_content,
#tabAllGroup:checked ~ #tab2_content{
display: block;
}
.tabs input:checked + .tab_item { .tabs input:checked + .tab_item {
background-color: #0070CA; background-color: #0070CA;
color: #fff; color: #fff;
...@@ -83,48 +88,48 @@ input[name="tab_item"] { ...@@ -83,48 +88,48 @@ input[name="tab_item"] {
background: aliceblue; background: aliceblue;
} }
/* サムネイル画像 */ /* サムネイル画像 */
.chat_item_l .thubnail { .chat_item_l .thumbnail {
width: 50px; width: 50px;
height: 50px; height: 50px;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
margin: 0 auto; margin: 0 auto;
} }
.chat_item_l .thubnail img{ .chat_item_l .thumbnail img{
width: 50px; width: 50px;
height: 50px; height: 50px;
} }
.chat_item_l .thubnail4 img { .chat_item_l .thumbnail4 img {
width: 25px; width: 25px;
height: 25px; height: 25px;
float: left; float: left;
} }
.chat_item_l .thubnail3 .img_wrap:nth-child(1) { .chat_item_l .thumbnail3 .img_wrap:nth-child(1) {
width: 25px; width: 25px;
height: 50px; height: 50px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
float: left; float: left;
} }
.chat_item_l .thubnail3 .img_wrap:nth-child(1) img { .chat_item_l .thumbnail3 .img_wrap:nth-child(1) img {
width: 50px; width: 50px;
height: 50px; height: 50px;
position: absolute; position: absolute;
left: -12px; left: -12px;
} }
.chat_item_l .thubnail3 .img_wrap:nth-child(2) { .chat_item_l .thumbnail3 .img_wrap:nth-child(2) {
width: 25px; width: 25px;
height: 25px; height: 25px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
float: left; float: left;
} }
.chat_item_l .thubnail3 .img_wrap:nth-child(2) img, .chat_item_l .thubnail3 .img_wrap:nth-child(3) img { .chat_item_l .thumbnail3 .img_wrap:nth-child(2) img, .chat_item_l .thumbnail3 .img_wrap:nth-child(3) img {
width: 25px; width: 25px;
height: 25px; height: 25px;
} }
.chat_item_l .thubnail3 .img_wrap:nth-child(3) { .chat_item_l .thumbnail3 .img_wrap:nth-child(3) {
width: 25px; width: 25px;
height: 25px; height: 25px;
position: relative; position: relative;
...@@ -132,20 +137,20 @@ input[name="tab_item"] { ...@@ -132,20 +137,20 @@ input[name="tab_item"] {
float: left; float: left;
} }
.chat_item_l .thubnail2 .img_wrap:nth-child(1) { .chat_item_l .thumbnail2 .img_wrap:nth-child(1) {
width: 25px; width: 25px;
height: 50px; height: 50px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
float: left; float: left;
} }
.chat_item_l .thubnail2 .img_wrap:nth-child(2) { .chat_item_l .thumbnail2 .img_wrap:nth-child(2) {
width: 25px; width: 25px;
height: 50px; height: 50px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }
.chat_item_l .thubnail2 .img_wrap img { .chat_item_l .thumbnail2 .img_wrap img {
width: 50px; width: 50px;
height: 50px; height: 50px;
position: absolute; position: absolute;
......
public_new/css/collaboration.css
...@@ -226,14 +226,14 @@ ...@@ -226,14 +226,14 @@
#add_user_list .user_item_l { #add_user_list .user_item_l {
margin: 0 15px; margin: 0 15px;
} }
#add_user_list .chat_item_l .thubnail { #add_user_list .chat_item_l .thumbnail {
width: 50px; width: 50px;
height: 50px; height: 50px;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
margin: 0 auto; margin: 0 auto;
} }
#add_user_list .user_item_l .thubnail img { #add_user_list .user_item_l .thumbnail img {
width: 50px; width: 50px;
height: 50px; height: 50px;
border-radius: 50%; border-radius: 50%;
......
public_new/css/common.css
...@@ -122,12 +122,12 @@ main{ margin-top: 60px; } ...@@ -122,12 +122,12 @@ main{ margin-top: 60px; }
.profile_modal .modal-header,.profile_modal .modal-body { padding-bottom: 0; } .profile_modal .modal-header,.profile_modal .modal-body { padding-bottom: 0; }
.profile_modal .modal-footer button { width: 33%; padding: 5px;} .profile_modal .modal-footer button { width: 33%; padding: 5px;}
.profile_modal.w_50 .modal-footer button { width: 50%; padding: 5px;} .profile_modal.w_50 .modal-footer button { width: 50%; padding: 5px;}
.profile_modal .modal-header .prifile_desc{ width: 100%;} .profile_modal .modal-header .profile_desc{ width: 100%;}
.profile_modal .modal-header .prifile_name { .profile_modal .modal-header .profile_name {
width: 100%; width: 100%;
text-align: center; text-align: center;
} }
.profile_modal .modal-header .prifile_name span { .profile_modal .modal-header .profile_name span {
line-height: 60px; line-height: 60px;
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;
......
public_new/js/chat-db.js 0 → 100644
// 名前空間
var CHAT_DB = {};
//ロカールDBからルーム一覧情報を取得
CHAT_DB.getRoomList = function(roomType) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getRoomList(roomType));
}
};
//ロカールDBからログインしたユーザのデータを取得する。
CHAT_DB.getMyInfo = function(input) {
var result = JSON.parse(android.getMyInfo());
CHAT.globalLoginParameter.shopMemberId = result.shopMemberId;
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return result;
}
};
CHAT_DB.getMessages = function(roomId) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMessageList(roomId));
}
};
CHAT_DB.getFavoriteUsers = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getFavoriteUsers());
}
};
CHAT_DB.getFavoriteGroups = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getFavoriteGroups());
}
};
CHAT_DB.getMyGroupUsers = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMyGroupUsers());
}
};
CHAT_DB.getGroupInfo = function(groupId) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getGroupInfo(groupId));
}
};
CHAT_DB.getNameCardData = function(shopMemberId) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getNameCardData(shopMemberId));
}
};
CHAT_DB.getMyGroupShopMemberByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMyGroupShopMemberByName(shopMemberName));
}
};
CHAT_DB.getAllGroupShopMemberByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getAllGroupShopMemberByName(shopMemberName));
}
};
CHAT_DB.getGroupByName = function(groupName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getGroupByName(groupName));
}
};
public_new/js/chat-error.js 0 → 100644
jQuery('#homeButton').on('click', function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要。
} else if (CHAT_UTIL.isAndroid()) {
android.goHome();
}
});
jQuery('#reloadButton').on('click', function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要。
} else if (CHAT_UTIL.isAndroid()) {
android.reload();
}
});
\ No newline at end of file
public_new/js/chat-ui.js 0 → 100644
// 名前空間
var CHAT_UI = {};
// Rotate
$(window).on('resize', function() {
if (CHAT_UTIL.isMobile()) {
return;
}
console.log(`width : ${$(this).width()}`);
console.log(`height : ${$(this).height()}`);
if(CHAT_UI.isLandscapeMode()) {
$(".group_list").addClass("col-6").removeClass("col-12");
$(".user_list").addClass("col-6").removeClass("col-12");
$(".chat_list").addClass("col-6").removeClass("col-12");
$(".squareBoxContent span").addClass("landscape_span");
$(".mesgs").addClass("landscape_mesgs");
} else {
$(".group_list").removeClass("col-6").addClass("col-12");
$(".user_list").removeClass("col-6").addClass("col-12");
$(".chat_list").removeClass("col-6").addClass("col-12");
$(".squareBoxContent span").removeClass("landscape_span");
$(".mesgs").removeClass("landscape_mesgs");
}
if (CHAT_UTIL.isIOS()) {
if (isLandscape == true) {
$(".mesgs").addClass("landscape_mesgs");
} else if (isLandscape == false) {
$(".mesgs").removeClass("landscape_mesgs");
}
}
})
// New Room
// チャットルーム生成ボタン処理
$('#createChatRoom').on('click', function() {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let isInvite = false;
CHAT.globalIsInvite = isInvite;
socket.emit('getGroupList', isInvite);
});
// Room Delete
// チャットルーム削除ボタン処理
$('#roomDeleteButton').on('click', function(e) {
if ($('.deleteBox').is(':visible')) {
// チャットルーム削除アイコンが表示されている時、ブラインド処理を行う
$('.deleteBox').finish().show().fadeTo('slow', 0, function() {
$(this).hide();
});
// チャットリストについてクリックイベントを与える
$('.chat_list').off('click');
$('.chat_list:not(.active_chat)').on('click', function(e) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let roomId = $(this).data('roomId');
let roomName = $(this).data('roomname');
socket.emit('joinRoom', roomId, roomName, function() {
$('#messages').html('');
$('.titleRoomName').text(roomName).data('roomName', roomName);
$('#pills-chat-tab').tab('show');
$("#message-search").attr("placeholder", getLocalizedString("chat_search_placeholder"));
});
});
let roomListTitle = getLocalizedString("roomListTitle")
$('.titleRoomName').text(roomListTitle)
$('.chat_list.active_chat').on('click', function(e) {
$('#pills-chat-tab').tab('show');
});
} else {
// チャットルーム削除アイコンが表示されていない場合、表示する
$('.deleteBox').finish().hide().fadeTo('slow',1).show();
// #36129に対応
let deleteRoomTitle = getLocalizedString("deleteRoomTitle")
$('.titleRoomName').text(deleteRoomTitle)
// 重複処理を防ぐためにチャットリストのクリックイベントを消す
$('.chat_list').off('click');
// チャットルームの削除アイコンにクリックイベントを与える
$('.deleteBox').off('click');
$('.deleteBox').on('click', function(e) {
// #36174
let roomId = $(this).data('roomId');
let activeRoom = $(this).data('activeRoom');
$("#roomDeleteTitle").text(getLocalizedString("roomDeleteTitle"));
$("#roomDelete").text(getLocalizedString("roomDelete"));
$("#cancelTitle").text(getLocalizedString("cancelTitle"));
// #36128
$('#roomDeleteConfirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#roomDelete', function(e) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
// 現在接続されているチャットルームを離れるとメッセージテップを初期化する
if (activeRoom) {
$('#messages').html('');
CHAT.saveRoomInfo('', '');
}
// チャットルームから退場する
socket.emit('exitRoom', roomId);
// #36129に対応
let roomListTitle = getLocalizedString("roomListTitle")
$('.titleRoomName').text(roomListTitle)
});
});
}
});
$('#room-search').on('input', function(event) {
if ($('#room-search').val().length > 0) {
// 検索結果が有る場合、結果を表示する
socket.emit('roomSearch', encodeURIComponent($('#room-search').val()));
} else {
if (IS_ONLINE == 'true') {
android.updateRoomList();
CHAT_UI.refreshRoomList(chatRoomType.DM);
CHAT_UI.dismissLoadingIndicator();
}
}
});
//上にスクロールすると新しいメッセージを呼ぶ処理。
$('#messages').scroll(function() {
if ($(this).scrollTop() === 0) {
if (!$('#chatLoader').is(':visible')) {
// 現在、メッセージの個数以前をメッセージを読み込む
// ローディングアイコンを追加する
let loader = $('<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>')
$('#messages').prepend(loader)
loader.remove();
// socket.emit('getMessages', $(this).children().length, function() {
// // ローディングアイコンを削除する
// loader.remove();
// });
}
}
});
// UIの位置調整(キーボード出現時)
$('#message-form').on('focus', function() {
if (CHAT_UTIL.isIOS()) {
// メッセージ入力欄の位置指定
document.querySelector('.fixed-bottom').style.bottom = 10000 + 'px';
setTimeout(function() {
document.querySelector('.fixed-bottom').style.bottom = 0 + 'px';
},200);
}
});
CHAT_UI.setNavigationPosition = function(y) {
if (document.activeElement.id == 'message-form') {
$('.navbar').css('position','absolute');
$('.navbar').css('top', (y) + 'px');
$('.tab-pane').css('margin-top', y + 'px');
var height = document.getElementById("messages").getBoundingClientRect().height;
$('.msg_history').css('height', height - y + 'px');
} else if (document.activeElement.id == 'message-search') {
$('.msg_history').css('height', '');
}
}
CHAT_UI.resetNavigationPosition = function() {
$('.navbar').css('position','');
$('.navbar').css('top', '');
$('.tab-pane').css('margin-top','');
$('.msg_history').css('height', '');
}
// 端末の向きを記録(キーボード出現時にLandscapeModeと判定する対策)
var isLandscape;
CHAT_UI.setOrientation = function(isLandscapeMode) {
if (isLandscapeMode == 'false') {
$(".mesgs").removeClass("landscape_mesgs");
isLandscape = false;
} else {
$(".mesgs").addClass("landscape_mesgs");
isLandscape = true;
}
}
//メッセージ送信
$('#message-form').on('keypress', function(event) {
if (event.which == 13) {
// Enterキーの処理
$('#message-send-btn').click();
}
});
// 送信ボタンの処理
$('#message-send-btn').on('click', function(e) {
e.preventDefault();
const messageTextBox = $('#message-form');
const message = messageTextBox.val().length > 0 ? encodeURIComponent(messageTextBox.val() + " ") : "";
messageTextBox.val('');
if (message.length > 0) {
socket.emit(
'createMessage', { text: message }
, 0
);
}
$('#message-form').focus();
});
// 写真アップロード
$('#fileUploadButton').on('click', function() {
$('#imageInputTag').click();
});
// 動画アップロード
$('#fileUploadButton2').on('click', function() {
$('#imageInputTag2').click();
});
$('#imageInputTag').on('change', function() {
$('#image-form').submit();
});
$('#imageInputTag2').on('change', function() {
$('#image-form2').submit();
});
$('#image-form').on('submit', function(e) {
e.preventDefault();
const imageInputTag = $('#imageInputTag');
const file = imageInputTag.prop('files')[0];
if (file) {
$('.overlay').addClass('active undismissable');
$('.loader').addClass('active');
CHAT_UI.showLoadingIndicator();
var fd = new FormData($(this)[0]);
//画像の大きさが500pixelより大きかったら、thumbnailを生成
CHAT.createThumbnailAndUpload(file, function(resizeFile, thumbnailCreated) {
if (resizeFile && thumbnailCreated) {
//ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
fd.append('thumb', resizeFile)
}
// イメージをアップロード
CHAT.uploadImage(fd)
})
}
});
$('#image-form2').on('submit', function(e) {
e.preventDefault();
const imageInputTag2 = $('#imageInputTag2');
const file = imageInputTag2.prop('files')[0];
if (file) {
$('.overlay').addClass('active undismissable');
$('.loader').addClass('active');
CHAT_UI.showLoadingIndicator();
var fd = new FormData($(this)[0]);
if(!file.type.includes("image")) { // video 保存
CHAT.createVideoThumbnailAndUpload(file, function(resizeFile, thumbnailCreated) {
if(resizeFile && thumbnailCreated) {
//ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
fd.append('thumb', resizeFile)
}
CHAT.uploadImage(fd);
})
return;
}
}
});
/* --------------------------------------------------- */
/* Nav Bar Functions */
/* --------------------------------------------------- */
$('#message-search').on('input', function(event) {
// チャットキーワードを入力するとページ内にある単語をハイライトする。(mark.js 使用)
if ($(this).val()) {
$('.message_content').unmark();
$('.message_content').mark($(this).val());
if ($('[data-markjs=true]').length > 0) {
// マーキングされている単語があった場合、最後の単語にスクロールを移動する。
CHAT_UI.scrollToLastMarkedUnseen($(this).val());
} else {
// マーキングされている単語がない場合、下段にスクロールする。
CHAT_UI.scrollToBottom();
}
} else {
// チャットキーワードが空欄になるとマーキングを解除し、下段にスクロールする。
$('.message_content').unmark();
CHAT_UI.scrollToBottom();
}
});
//次のマーキングされた単語にスクロールを移動する。
$('#pre-search').on('click', function(event) {
CHAT_UI.scrollToLastMarkedUnseen(jQuery('#message-search').val());
});
// Exit Room
$('#exitRoom').on('click', function(event) {
// 36174
$("#exitRoomTitle").text(getLocalizedString("exitRoomTitle"));
$("#exitRoomOk").text(getLocalizedString("yesTitle"));
$("#noExit").text(getLocalizedString("cancelTitle"));
$('#exitRoomConfirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#exitRoomOk', function(e) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
// チャットルームから退場する
socket.emit('exitRoom');
$('#dismiss').click();
CHAT.saveRoomInfo('', '');
});
});
// Side Bar
$('#sidebarCollapse').on('click', function() {
// open sidebar
$('#sidebar').addClass('active');
// fade in the overlay
$('.overlay').addClass('active');
$('.collapse.in').toggleClass('in');
$('a[aria-expanded=true]').attr('aria-expanded', 'false');
});
$('#dismiss, .overlay').on('click', function() {
// hide sidebar
$('#sidebar').removeClass('active');
// hide overlay if dismissable
$('.overlay:not(.undismissable)').removeClass('active');
});
//Invite User
//招待ボタンを押すとグループリストを持ってくる。(ボタンを動的に追加して微動作中)
$('#addUser').on('click', function(event) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let isInvite = true;
CHAT.globalIsInvite = isInvite;
socket.emit('getGroupList', isInvite);
});
//グループ画面での検索
$('#groupListKeyword').on('input', function(event) {
// data-name値で当該キーワードが入っているグループのみを表示する。
if ($(this).val()) {
$('.group_list:not([data-name*="'+$(this).val()+'" i])').hide();
$('.group_list[data-name*="'+$(this).val()+'" i]').show();
} else {
$('.group_list').show();
}
});
$('#userListKeyword').on('input', function(event) {
// data-name値で当該キーワードが入っているユーザーのみを表示する。
if ($(this).val()) {
$('.user_list:not([data-name*="'+$(this).val()+'" i])').hide();
$('.user_list[data-name*="'+$(this).val()+'" i]').show();
} else {
$('.user_list').show();
}
});
$('#selectListKeyword').on('input', function(event) {
if ($(this).val()) {
$('.select_user_list:not([data-name*="'+$(this).val()+'" i])').hide();
$('.select_user_list[data-name*="'+$(this).val()+'" i]').show();
} else {
$('.select_user_list').show();
}
});
/* ---------------------------------------------------------------------- */
/* */
/* Etc */
/* */
/* ---------------------------------------------------------------------- */
// Tab Open/Shown Event
$('a[data-toggle="pill"]').on('show.bs.tab', function(e) {
var target = $(e.target).attr("href"); // e.target : activated tab
switch(target) {
case '#pills-chat':
if (CHAT_UI.isLandscapeMode()) {
$(".mesgs").addClass("landscape_mesgs");
} else {
$(".mesgs").removeClass("landscape_mesgs");
}
CHAT.globalIsInvite = true;
$('.chatRoomIcon, .titleRoomName, #backButton').show();
$('.roomListIcon, #userSelectionConfirmBtn, #newRoomName, #userSelectionDeleteBtn').hide();
$('#homeButton').hide();
$('.titleRoomName').text($('.titleRoomName').data('roomName'));
$('#newRoomName').val('');
$('#userSelectionLength').text('');
CHAT.globalSelectedUserList = [];
$('#bottomNav').hide();
$('#backButton').off().on('click', function() {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
CHAT.saveRoomInfo();
if (IS_ONLINE == 'true') {
socket.emit('leaveRoom', function() {
android.updateRoomList();
});
}
CHAT_UI.refreshRoomList(chatRoomType.DM);
CHAT_UI.dismissLoadingIndicator();
});
//loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
break;
case '#pills-chatlist':
$('.titleRoomName, #backButton').show();
$('.chatRoomIcon, #backButton, #userSelectionConfirmBtn, #newRoomName, #userSelectionDeleteBtn').hide();
$('#homeButton').show();
$('#room-search').val('');
$('#room-search').show();
$('#room_list').show();
// set Title
let roomListTitle = getLocalizedString("roomListTitle")
$('#bottomNav').show();
$('.titleRoomName').text(roomListTitle);
$('#newRoomName').val('');
$('#userSelectionLength').text('');
CHAT.globalSelectedUserList = [];
break;
case '#pills-contact':
$('#myNamecard').html('');
$('#homeButton').show();
$("#backButton").hide();
$('.titleRoomName').show();
$('#myGroupArea').show();
$('#allGroupArea').hide();
$('#my_info').show();
$('#bottomNav').show();
break;
case '#pills-user':
$("#backButton").show();
$("#userSelectionDeleteBtn").hide();
$('#homeButton').hide();
$('#bottomNav').hide();
//loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
break;
case '#pills-group':
$("#backButton").show();
$("#userSelectionDeleteBtn").hide();
$('#homeButton').hide();
$('#bottomNav').hide();
//loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
break;
case '#pills-confirm':
$("#backButton").show();
//loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
$('#homeButton').hide();
$('#bottomNav').hide();
$('.user_people').css("paddingLeft", "0px");
break;
case '#pills-communication': // コミュニケーションのタブ
case '#pills-setting': // 設定のタブ
case '#pills-profile': // ユーザプロファイルのタブ
$('#bottomNav').hide();
$('.titleRoomName').show();
$('.roomListIcon, .chatRoomIcon, #userSelectionConfirmBtn, #newRoomName, #userSelectionDeleteBtn').hide();
$('#backButton').hide();
break;
default:
$('.titleRoomName').show();
$('.roomListIcon, .chatRoomIcon, #userSelectionConfirmBtn, #newRoomName, #userSelectionDeleteBtn').hide();
$('#backButton').hide();
break;
}
});
// Tab Close/Hidden Event
$('a[data-toggle="pill"]').on('hide.bs.tab', function(e) {
var target = $(e.target).attr("href"); // e.target : activated tab
switch(target) {
case '#pills-chat':
$('#message-search').val('');
break;
case '#pills-chatlist':
$('#room-search').val('');
$('#room-search').show();
break;
case '#pills-group':
$('#groupListKeyword').val('');
break;
case '#pills-contact':
break;
case '#pills-user':
$('#userListKeyword').val('');
break;
case '#pills-confirm':
$('#select_user_list').html('');
$('#selectUserListKeyword').val('');
$('.titleRoomName').show();
$('.user_people').css("paddingLeft", "12%");
break;
case '#pills-communication':
case '#pills-setting':
case '#pills-profile':
break;
default:
break;
}
});
$('#pills-chat-tab').on('shown.bs.tab', function(e) {
CHAT_UI.scrollToBottom();
});
$('#pills-user-tab').on('shown.bs.tab', function(e) {
$('#userSelectionConfirmBtn').show();
});
$('#pills-confirm-tab').on('shown.bs.tab', function(e) {
$('#userSelectionConfirmBtn').show();
$('#userSelectionLength').text('');
$('#userSelectionDeleteBtn').hide();
});
CHAT_UI.scrollToBottom = function() {
const messages = $('#messages');
const scrollHeight = messages.prop('scrollHeight');
messages.scrollTop(scrollHeight);
};
CHAT_UI.scrollToLastMarkedUnseen = function(value) {
let target = $('[data-markjs=true]:not([data-seen=true])').last();
let messages = $('#messages');
if (target.length > 0) {
messages.scrollTop(target.prop('offsetTop') - target.prop('offsetHeight') - messages.prop('offsetHeight') + target.parent().parent().height());
target.attr('data-seen', true);
} else {
messages.scrollTop(0);
$('.message_content').unmark();
$('.message_content').mark(value);
}
};
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator = function() {
$("#loadingIndicator").addClass('active undismissable');
}
//loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator = function() {
$("#loadingIndicator").removeClass('active undismissable');
}
//画面の方向をcheck
CHAT_UI.isLandscapeMode = function() {
if (CHAT_UTIL.isMobile()) {
return false;
}
return $(window).width() > $(window).height()
}
CHAT_UI.setConfirmButtonEvent = function(isInvite) {
let titleText = isInvite ? getLocalizedString("inviteUsersSubtitle") : getLocalizedString("createRoomSubtitle")
let invitedUserText = getLocalizedString("invitedUser")
if (!isInvite) {
$('#newRoomName').show();
}
$('#userSelectionConfirmBtn').off().on('click', function(event) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
CHAT_UI.showConfirmView(isInvite);
});
CHAT_UI.showConfirmView(isInvite);
$('#inviteStatus').text(titleText);
$('#invitedUsers').text(invitedUserText);
$('#pills-confirm-tab').tab('show');
}
//ConfirmView initialize
CHAT_UI.showConfirmView = function(isInvite) {
const template = $('#user-template').html();
$('#select_user_list').html('');
CHAT.globalSelectedUserList.forEach(function(user) {
let html = Mustache.render(template, {
id: user.shopMemberId,
profileImage: user.profileImagePath,
name: user.loginId
});
// TODO 次のコミットに参考事項
// チャットルーム開設画面で参加ユーザー削除用チェックロジックが残っているので
// 影響テスト後、削除予定。 kang-dh
let obj = $(jQuery.parseHTML(html)).on('click',function() {
$(this).find('.userCheckBox').toggleClass('active');
});
$('#select_user_list').append(obj);
});
let roomListTitle = getLocalizedString("createRoomTitle")
$('.titleRoomName').text(roomListTitle)
// Rotate
if (CHAT_UI.isLandscapeMode()) {
$(".user_list").addClass("col-6").removeClass("col-12");
$(".squareBoxContent span").addClass("landscape_span");
}
$('#backButton').off().on('click', function() {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
socket.emit('getGroupList', isInvite)
});
$("#userSelectionConfirmBtn").off().on('click', function() {
if (isInvite) {
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.id;
});
// ユーザーの名前(login id)リスト。
let loginIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.name;
});
if(userIdList.length > 0 && loginIdList.length > 0) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
socket.emit('inviteUsers', userIdList, loginIdList, function() {
$("#userSelectionDeleteBtn").hide();
$('#pills-chat-tab').tab('show');
});
}
} else {
if ($('#select_user_list .user_list').find('.userCheckBox').length > 0) {
// #36130に対応
const trimmedRoomName = $('#newRoomName').val().trim()
if (trimmedRoomName.length == 0) {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.id;
});
let userNameList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.name;
});
//TODO DB作業が終わったら自分のユーザ名を表示するかを判断し、修正予定。
// 参加ユーザ名でルーム名を生成
let newRoomName = CHAT.globalLoginParameter.loginId + ',' + userNameList.join(',');
// ルーム名のURIencodingを行う
//const encodedRoomName = encodeURIComponent(newRoomName);
//todo android create room api
android.createChatRoom("1",userIdList.join(','),newRoomName);
/*socket.emit('createNewRoom', userIdList, encodedRoomName, function(newRoomId) {
socket.emit('joinRoom', newRoomId, newRoomName, function() {
CHAT.saveRoomInfo(newRoomId, newRoomName);
$('#messages').html('');
$('.titleRoomName').text(newRoomName).data('roomName', newRoomName);
$("#userSelectionDeleteBtn").hide();
$('#pills-chat-tab').tab('show');
});
});*/
/*socket.on('createNewRoom', (shopMemberIdList, newRoomName, callback) => {
const user = onlineUsers.getUser(socket.id)
if(user) {
var loginIdListObj = new Object();
var newRoomNameObj = new Object();
loginIdListObj.type = 'loginIdList'
loginIdListObj.value = shopMemberIdList
newRoomNameObj.type = 'newRoomName'
newRoomNameObj.value = newRoomName
var path = httpRequest.makeChatRoomManageUrlPath(user.shopName, constant.ROOM_CREATENEWROOM, user.sid, loginIdListObj, newRoomNameObj)
winston.info('path' + path)
httpRequest.readResult(path, (res) =>{
const error = serverErrorHandler(res)
if(error.errorFlag) {
winston.error("Failed to [createNewRoom] process.")
socket.emit("showServerError", error.errorMessage);
return;
}
winston.info('create new room from server '+ util.inspect(res, false, null, false))
callback(res.roomId)
// ユーザーリストをアップデートする
socket.emit(res.roomId).emit('updateUserList', res.userList, [user.shop_member_id])
})
} else {
socket.emit("retryJoinProcess")
//join process
}
})*/
} else if(trimmedRoomName.includes(';') || trimmedRoomName.includes('/') || trimmedRoomName.includes('?') || trimmedRoomName.includes(':') || trimmedRoomName.includes("@")
|| trimmedRoomName.includes('&') || trimmedRoomName.includes('=') || trimmedRoomName.includes("+") || trimmedRoomName.includes('$') || trimmedRoomName.includes(",") || trimmedRoomName.includes('-')
|| trimmedRoomName.includes('_') || trimmedRoomName.includes('.') || trimmedRoomName.includes('!') || trimmedRoomName.includes('~') || trimmedRoomName.includes('*') || trimmedRoomName.includes("\'")
|| trimmedRoomName.includes('(') || trimmedRoomName.includes(')') || trimmedRoomName.includes('#') || trimmedRoomName.includes("\\") || trimmedRoomName.includes("\"") || trimmedRoomName.includes("`")) {
// #36147
// #36174
$("#customAlertTitle").text(getLocalizedString("invalidCharacter"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
} else if (trimmedRoomName.length > 20) {
// #36142
var inputText = $('#newRoomName').val().trim(); // #36142 文字列の前又は後の空白文字列を削除
// #36174
$("#customAlertTitle").text(getLocalizedString("nameTooLong"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
$('#newRoomName').val(inputText.substr(0, $('#newRoomName').prop("maxlength")));
});
} else {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.id;
});
// ルーム名のtrimmingした後、URIencodingを行う
const encodedRoomName = encodeURIComponent(trimmedRoomName);
android.createChatRoom("1",userIdList.join(','),encodedRoomName);
}
}
}
});
$("#userSelectionDeleteBtn").hide();
$("#userSelectionDeleteBtn").off().on('click', function() {
// #36174
$("#customConfirmTitle").text(getLocalizedString("memberDeleteTitle"));
$("#customConfirmOk").text(getLocalizedString("roomDelete"));
$("#customAlertCancel").text(getLocalizedString("cancelTitle"));
$('#customConfirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customConfirmOk', function(e) {
CHAT_UI.deleteButtonAction(isInvite);
});
});
}
CHAT_UI.deleteButtonAction = function(isInvite) {
//配列の整理
jQuery.makeArray($('#select_user_list .user_list').find(".userCheckBox.active")).map(function(e) {
CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
return e.dataset.name != element.loginId;
});
});
CHAT_UI.showConfirmView(isInvite)
$('#select_user_list .user_list').find('.userCheckBox').show();
}
CHAT_UI.htmlElementTextInitialize = function(languageCode) {
moment.locale(languageCode);
setLanguage(languageCode);
$(".titleRoomName").text(getLocalizedString("roomListTitle"));
$("#message-form").attr("placeholder", getLocalizedString("chat_placeholder"));
$("#message-search").attr("placeholder",getLocalizedString("chat_search_placeholder"));
$("#exitRoom").text(getLocalizedString("exitRoom")).append("<i class='fas fa-door-open'></i>")
$("#participants").text(getLocalizedString("participants"))
$("#fileUploadButton").text(getLocalizedString("photo"))
$("#fileUploadButton2").text(getLocalizedString("video"))
$("#okayLabel").text(getLocalizedString("okayLabel"))
$("#completeLabel").text(getLocalizedString("completeLabel"))
$("#thankLabel").text(getLocalizedString("thankLabel"))
$("#startToWorkLabel").text(getLocalizedString("startToWorkLabel"))
$("#groupListKeyword").attr("placeholder", getLocalizedString("groupSearch"))
$("#contactListKeyword").attr("placeholder", getLocalizedString("contactSearch"))
$("#room-search").attr("placeholder",$("#room-search").attr("placeholder")+getLocalizedString("room_search_placeholder"));
$("#userListKeyword").attr("placeholder", getLocalizedString("userSearch"))
$("#newRoomName").attr("placeholder", getLocalizedString("newRoomName"))
$("#dmBtn").text(getLocalizedString("directMessageChatRoom"))
$("#groupBtn").text(getLocalizedString("groupChatRoom"))
$("#myGroupBtn").text(getLocalizedString("myGroup"))
$("#allGroupBtn").text(getLocalizedString("allGroup"))
//$("#groupPathSeperator").text(getLocalizedString("groupPath"))
//$("#moveBtnSeperator").text(getLocalizedString("quickBtn"))
//$("#rootGroupBtn").text(getLocalizedString("returnToRootGroup"))
//$("#parentGroupBtn").text(getLocalizedString("returnToParentGroup"))
//$("#childGroupSeperator").text(getLocalizedString("childGroup"))
//$("#groupUserSeperator").text(getLocalizedString("groupUser"))
$("#favorite-seperator").text(getLocalizedString("favorite"))
$("#mygroup-seperator").text(getLocalizedString("mygroup"))
}
// 画像の読み込みが全て終わったタイミングでコールバック実行
// FIXME 追加読み込みの場合は差分の画像のみ監視すべきだが、現状新規入室時にしか対応出来ていない。
CHAT_UI.waitForLoadingImage = function(div, callback) {
var imgs = div.find("img");
var count = imgs.length;
if (count==0)
callback();
var loaded = 0;
imgs.one( "load" , function( e ) {
// イメージが読み込まれた
loaded++;
if ( loaded === count ) {
callback();
}
}).each( function() {
if ( this.complete || this.readyState === readyState.COMPLETED ) {
$(this).trigger("load");
}
});
}
$('#contactButton').on('click', function(event) {
CHAT_UI.refreshContactScreen();
});
$('#chatButton').on('click', function(event) {
CHAT_UI.refreshRoomList(chatRoomType.DM);
});
CHAT_UI.refreshContactScreen = function() {
$(".modal-backdrop").remove();
$('#myProfileModal').html('');
$('#userProfileModal').html('');
$('#favoriteList').html('');
$('#myGroupList').html('');
//画面タイトル設定
let contactListTitle = getLocalizedString("contactListTitle");
$('#title').text(contactListTitle);
// グループの様式を読み込む
var groupTemplate;
$.get({ url: "./template/template_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
// ユーザの様式を読み込む
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
var myNamecardTemplate;
$.get({ url: "./template/template_my_name_card.html", async: false }
, function(text) {
myNamecardTemplate = text;
});
var groupUserTemplate;
$.get({ url: "./template/template_group_user_list.html", async: false }
, function(text) {
groupUserTemplate = text;
});
if (IS_ONLINE == 'true') {
android.updateGroupInfo('0');
android.updateMyInfo();
android.updateGroupUser();
android.updateFavorite();
}
var myInfo = CHAT_DB.getMyInfo();
myInfo.profileImagePath = CHAT.getProfileImgUrl(myInfo.profileUrl)
let myNamecardHtml = Mustache.render(myNamecardTemplate, {
loginId: myInfo.shopMemberId,
profileImage: myInfo.profileImagePath,
name: myInfo.shopMemberName,
groupPathList: myInfo.groupPathList
});
let myNamecardObj = $(jQuery.parseHTML(myNamecardHtml)).on('click', function() {
});
$('#myProfileModal').html(myNamecardObj);
$('#myName').text(myInfo.shopMemberName);
$('#myImg').attr('src',myInfo.profileImagePath);
//お気に入りグループ取得。
var favoriteGroupList = CHAT_DB.getFavoriteGroups();
favoriteGroupList.forEach(function(favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
isFavorite: true
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#favoriteList').append(obj);
})
//お気に入りユーザ取得。
var favoriteUserList = CHAT_DB.getFavoriteUsers();
favoriteUserList.forEach(function(favoriteUser) {
favoriteUser.profileUrl = CHAT.getProfileImgUrl(favoriteUser.profileUrl);
favoriteUser.isFavorite = true;
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList
});
let obj = jQuery.parseHTML(html);
$('#favoriteList').append(obj);
/*favoriteUserList.forEach(function(favoriteUser) {
favoriteUser.profileImagePath = CHAT.getProfileImgUrl(favoriteUser.profileUrl)
let html = Mustache.render(userTemplate, {
shopMemberId: favoriteUser.shopMemberId,
profileImage: favoriteUser.profileImagePath,
name: favoriteUser.shopMemberName,
isFavorite: true
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#favoriteList').append(obj);
})*/
var myGroupList = CHAT_DB.getMyGroupUsers();
myGroupList.forEach(function(myGroup) {
myGroup.groupUserList.forEach(function(groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl)
})
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#myGroupList').append(obj);
})
}
CHAT_UI.refreshRoomList = function(roomType) {
var rooms = CHAT_DB.getRoomList(roomType);
CHAT.globalIsInvite = false;
activeRoomId = null;
// #36146に対応
let keywordSearchMode = false;
if ($('#room-search').val().length > 0) {
keywordSearchMode = true;
}
$('#room_list').html('');
let roomListTitle = getLocalizedString("roomListTitle");
$('.titleRoomName').text(roomListTitle);
if (rooms.length === 0) {
// 検索結果がない場合のメッセージを追加
if (!keywordSearchMode) {
let emptyListString = getLocalizedString("roomListEmptyString")
$('#room_list').append(`<center class="text-secondary">${emptyListString}</center>`);
} else {
let emptyListString = getLocalizedString("searchRoomListEmptyString")
$('#room_list').append(`<center class="text-secondary">${emptyListString}</center>`);
}
}
// チャットルームの様式を読み込む
const template = $('#room-template').html();
rooms.forEach(function(room) {
room.profileImagePath = ASSET_PATH + 'images/user-profile.png'
if (room.message) {
room.message = room.message.toString()
} else {
room.message = getLocalizedString("noMessages")
}
var displayMsg;
//TODO 協業の場合処理追加必要
if (room.messageType == messageType.TEXT || room.messageType == messageType.TEXT) displayMsg = room.message;
if (room.messageType == messageType.IMAGE || room.messageType == messageType.SYSTEM) displayMsg = getLocalizedString("image");
let html = Mustache.render(template, {
roomName: room.chatRoomName,
roomId: room.chatRoomId,
profileImage: room.profileImagePath,
active: activeRoomId === room.chatRoomId ? 'active_chat' : null, // 現在、入っているルームだとhilight表示
lastMessage: displayMsg ,
time: room.insertDate ? CHAT_UTIL.formatDate(room.insertDate).createdAt : '',
unreadMsgCnt: room.unreadCount == 0 ? '' : room.unreadCount,
userCnt: room.userCount
});
// Click event
let obj = $(jQuery.parseHTML(html)).on('click', function() {
let roomId = $(this).data('roomId');
let roomName = $(this).data('roomname');
CHAT_UI.joinRoom(roomId,roomName);
//TODO ルームに入る処理追加必要
});
// チャットルームリストに追加する
$('#room_list').append(obj);
});
if (rooms.length > 0) {
if (!keywordSearchMode) {
$(".roomListIcon").show()
$('#roomDeleteButton, #arrangeRooms').show()
} else {
$(".roomListIcon").show()
$('#roomDeleteButton, #arrangeRooms').hide()
}
} else {
if (!keywordSearchMode) {
$(".roomListIcon").hide()
} else {
$(".roomListIcon").show()
$('#roomDeleteButton, #arrangeRooms').hide()
}
}
$('#createChatRoom').show();
if (CHAT_UI.isLandscapeMode()) {
$(".chat_list").removeClass("col-12").addClass("col-6");
}
$("#userSelectionDeleteBtn").hide();
// チャットルームリスト画面に遷移
$('#pills-chatlist-tab').tab('show');
// loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.joinRoom = function(roomId,roomName) {
if (IS_ONLINE == 'true') {
android.updateMessages(roomId);
socket.emit('joinRoom', roomId, roomName, function() {
});
}
var messages = CHAT_DB.getMessages(roomId);
CHAT_UI.loadMessages(messages, roomId, roomName)
};
CHAT_UI.loadMessages = function(messages, roomId, roomName) {
$('#messages').html('');
$('.titleRoomName').text(roomName).data('roomName', roomName);
$('#pills-chat-tab').tab('show');
$("#message-search").attr("placeholder", getLocalizedString("chat_search_placeholder"));
let jQueryMessages = $('#messages');
// スクロールの変化を防ぐため以前画面の高さを保存する
let beforeHeight = jQueryMessages.prop('scrollHeight');
// メッセージ文字列の生成
let workVal = "";
messages.forEach(function(message) {
let template = $('#message-template').html();
if (message.selfFlg == 1) {
template = $('#message-template-me').html();
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
if (message.profileUrl) {
message.profileImagePath = CHAT.getProfileImgUrl(message.profileUrl)
} else {
message.profileImagePath = CHAT.getProfileImgUrl("")
}
// #36147
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll('/acms',CHAT_SERVER_URL+'/acms');
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileImagePath,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime
});
html = message.message.includes('attachedImages') || message.message.includes('attachedVideos') ? CHAT_UTIL.htmlDecode(html) : html;
workVal = html + workVal;
})
// メッセージの画面描画
jQueryMessages.prepend(workVal);
if (beforeHeight !== 0) {
// 追加のメッセージ読み込み時は読み込み前のスクロール位置を維持
setTimeout(function() {
jQueryMessages.scrollTop(jQueryMessages.prop('scrollHeight') - beforeHeight);
}, 400);
} else {
// 新規に入室の場合は最下部へスクロール
CHAT_UI.waitForLoadingImage(jQueryMessages, CHAT_UI.scrollToBottom);
// タブレット等、画面サイズが大きい場合、スクロール出来なくならないよう追加で10件メッセージを取得
if ($(window).height() > jQueryMessages.height()) {
$('#messages').scroll();
}
}
// ユーザ削除ボタン表示しない
$("#userSelectionDeleteBtn").hide();
CHAT_UI.dismissLoadingIndicator();// add some...
// チャットに遷移する
$('#pills-chat-tab').tab('show');
};
$('#dmBtn').on('click', function(e) {
CHAT_UI.refreshRoomList(chatRoomType.DM);
});
$('#groupBtn').on('click', function(e) {
CHAT_UI.refreshRoomList(chatRoomType.GROUP);
});
$('#myGroupBtn').on('click', function(e) {
$('#myGroupArea').show();
$('#allGroupArea').hide();
});
$('#tabAllGroup').on('click', function(e) {
CHAT_UI.refreshAllGroupSearch('0')
});
CHAT_UI.favoriteUserChange = function(shopMemberId, star) {
if ($(star).hasClass('active')) {
CHAT_UI.removeFavoriteUser(shopMemberId);
} else if ($(star).hasClass('disable')) {
CHAT_UI.insertFavoriteUser(shopMemberId);
}
}
CHAT_UI.favoriteGroupChange = function(groupId, star) {
if ($(star).hasClass('active')) {
CHAT_UI.removeFavoriteGroup(groupId);
} else if ($(star).hasClass('disable')) {
CHAT_UI.insertFavoriteGroup(groupId);
}
}
CHAT_UI.removeFavoriteUser = function(shopMemberId) {
$('#userNameCard').modal('hide');
$('#myNameCard').modal('hide');
android.removeFavoriteUser(shopMemberId);
$('.shopmember_'+shopMemberId).removeClass('active');
$('.shopmember_'+shopMemberId).addClass('disable');
};
CHAT_UI.insertFavoriteUser = function(shopMemberId) {
$('#userNameCard').modal('hide');
$('#myNameCard').modal('hide');
android.addFavoriteUser(shopMemberId);
$('.shopmember_'+shopMemberId).removeClass('disable');
$('.shopmember_'+shopMemberId).addClass('active');
};
CHAT_UI.removeFavoriteGroup = function(groupId) {
android.removeFavoriteGroup(groupId);
$('.group_'+groupId).removeClass('active');
$('.group_'+groupId).addClass('disable');
};
CHAT_UI.insertFavoriteGroup = function(groupId) {
android.addFavoriteGroup(groupId);
$('.group_'+groupId).removeClass('disable');
$('.group_'+groupId).addClass('active');
};
//全グループ検索画面表示。
CHAT_UI.refreshAllGroupSearch = function(groupId) {
$('.cancel').addClass('none');
$('.search_form input').removeClass('focus');
$('.search_form input').val('');
$('.search_form form').removeClass();
$('.content').removeClass('none');
$('.overlay_src_msg').empty();
$('#tabAllGroup').prop('checked', true);
//オンライン状態であればサーバから情報更新。
if (IS_ONLINE == 'true') {
android.updateGroupInfo(groupId);
}
//画面エリアを初期化。
$('#rootGroupBtn').off();
$('#parentGroupBtn').off();
$('#childGroupListArea').html('');
$('#userInGroupList').html('');
$('#groupPathArea').html('');
//DBからグループ情報を取得。
var result = CHAT_DB.getGroupInfo(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== 'undefined') {
$('#parentGroupBtn').on('click', function() {
CHAT_UI.refreshAllGroupSearch(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== 'undefined') {
$('#rootGroupBtn').on('click', function() {
CHAT_UI.refreshAllGroupSearch(result.rootGroupId);
});
}
//該当グループのパースを表示。
var groupPathTemplate;
$.get({ url: "./template/template_group_path.html", async: false }
, function(text) {
groupPathTemplate = text;
});
var groupPathCount = 0;
result.groupPathList.forEach(function(groupPath) {
if (!(groupPathCount < (result.groupPathList.length - 3))) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId
});
let obj = jQuery.parseHTML(html);
$('#groupPathArea').append(obj);
}
groupPathCount++;
})
//該当グループの下位グループ表示。
var groupTemplate;
$.get({ url: "./template/template_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
result.childGroupList.forEach(function(childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#childGroupListArea').append(obj);
})
//該当グループの所属ユーザを表示。
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
result.groupUserList.forEach(function(groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl)
})
let html = Mustache.render(userTemplate, {
userList: result.groupUserList
});
let obj = jQuery.parseHTML(html);
$('#userInGroupList').append(obj);
}
CHAT_UI.startChat = function(userShopMemberId,userName) {
CHAT_UI.showLoadingIndicator();
var userIdList = [];
userIdList.push(userShopMemberId);
// 参加ユーザ名でルーム名を生成
let newRoomName = CHAT.globalLoginParameter.loginId + ',' +userName;
android.createChatRoom(chatRoomType.DM, userIdList.join(','),newRoomName);
CHAT_UI.hideNamecard(nameCardAreaId.USER);
};
CHAT_UI.startVoice = function() {
console.log("VoiceClick");
};
CHAT_UI.makeNameCard = function(shopMemberId) {
var nameCardInfo = CHAT_DB.getNameCardData(shopMemberId);
var namecardTemplate;
$.get({ url: "./template/template_user_name_card.html", async: false }
, function(text) {
namecardTemplate = text;
});
let namecardHtml = Mustache.render(namecardTemplate, {
shopMemberId: nameCardInfo.shopMemberId,
profileImage: nameCardInfo.profileImagePath,
name: nameCardInfo.shopMemberName,
groupPathList: nameCardInfo.groupPathList,
chat: getLocalizedString("chat"),
voice: getLocalizedString("voice"),
favorite: getLocalizedString("addFavorite"),
isFavorite: nameCardInfo.isFavorite
});
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on('click', function() {
});
$('#userProfileModal').html(namecardObj);
$('#userNameCard').modal('show');
};
CHAT_UI.toggleCategory = function(category) {
$(category).toggleClass("open");
$(category).next().slideToggle();
};
public_new/js/chat-util.js 0 → 100644
// 名前空間
var CHAT_UTIL = {};
CHAT_UTIL.isAndroid = function() {
return PLATFORM == 'android';
};
CHAT_UTIL.isIOS = function() {
return PLATFORM == 'ios';
};
CHAT_UTIL.isMobile = function() {
return IS_MOBILE == 'true';
};
CHAT_UTIL.formatDate = function(date) {
const REFERENCE = moment();
const TODAY = REFERENCE.clone().startOf('day');
let createdAt = moment(date);
if (date.length == 14) {
createdAt = moment(date,'YYYYMMDDhhmmss');
} else {
createdAt = moment(date);
}
// #36171
const createdAtDay = createdAt.format('MMM Do');
const createdAtTime = createdAt.format('HH:mm');
if (createdAt.isSame(TODAY, 'd')) {
createdAt = createdAtTime;
} else {
createdAt = createdAtDay;
}
let rntDate = new Object();
rntDate.createdAtDay = createdAtDay;
rntDate.createdAtTime = createdAtTime;
rntDate.createdAt = createdAt;
return rntDate;
}
CHAT_UTIL.htmlDecode = function(input) {
var e = document.createElement('textarea');
e.innerHTML = input;
// handle case of empty input
return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}
//generates a unique id, not obligator a UUID
CHAT_UTIL.generateUUID = function() {
var d = new Date().getTime();
var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var r = (d + Math.random()*16)%16 | 0;
d = Math.floor(d/16);
return (c=='x' ? r : (r&0x3|0x8)).toString(16);
});
return uuid;
};
public_new/js/chat-websocket.js 0 → 100644
var socket;
// 名前空間
var CHAT_SOCKET = {};
CHAT_SOCKET.connectSocket = function () {
CHAT_UI.dismissLoadingIndicator();
if (IS_ONLINE == 'true') {
socket = io(CHAT_SERVER_URL);
setSocketAction();
android.updateRoomList();
CHAT_UI.refreshRoomList(chatRoomType.DM);
CHAT_UI.dismissLoadingIndicator();
$('#createChatRoom').show();
} else {
//オフラインの場合、DBからルーム一覧を表示。
if (CHAT_UTIL.isIOS()) {
//TODO IOSの場合
} else if (CHAT_UTIL.isAndroid()) {
//$('.overlay').removeClass('active undismissable');
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
CHAT_UI.refreshRoomList(chatRoomType.DM);
CHAT_UI.dismissLoadingIndicator();
$('#createChatRoom').show();
}
}
};
/* ---------------------------------------------------
* Socket Connect/Disconnectc
* --------------------------------------------------- */
function setSocketAction () {
socket.on('connect', function() {
// socketが接続されたらチャット画面で画面を更新する
$('.overlay').removeClass('active undismissable');
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
// チャットルームに入場する際、sid, loginId, shopName, roomId, roomNameの情報を取得しNodeJsに渡す
if (CHAT_UTIL.isIOS()) {
webkit.messageHandlers.loginInfoRequestMessageHandlerId.postMessage({});
} else if (CHAT_UTIL.isAndroid()) {
android.getLoginParameter();
}
CHAT_UI.dismissLoadingIndicator();
});
socket.on('disconnect', function() {
console.log('disconnect');
//socketが切断されたら黒画面で画面を更新する
$('.overlay').addClass('active undismissable');
//alert('Disconnected from the server');
CHAT_UI.dismissLoadingIndicator();
});
socket.on('connect_error', function() {
console.log('connect_error');
CHAT_UI.dismissLoadingIndicator();
});
/* ----------------------------------------------------------------------
*
* Chat Room List Tab
*
* ---------------------------------------------------------------------- */
// Update Room List
//TODO APIの連動が終わったら削除予定
/*socket.on('refreshRoomList', function(rooms, activeRoomId = null){
CHAT.globalIsInvite = false;
// #36146に対応
let keywordSearchMode = false;
if ($('#room-search').val().length > 0) {
keywordSearchMode = true;
}
$('#room_list').html('');
let roomListTitle = getLocalizedString("roomListTitle");
$('.titleRoomName').text(roomListTitle);
if (rooms.length === 0) {
// #36146に対応
// 検索結果がない場合のメッセージを追加
if (!keywordSearchMode) {
let emptyListString = getLocalizedString("roomListEmptyString")
$('#room_list').append(`<center class="text-secondary">${emptyListString}</center>`);
} else {
let emptyListString = getLocalizedString("searchRoomListEmptyString")
$('#room_list').append(`<center class="text-secondary">${emptyListString}</center>`);
}
}
// チャットルームの様式を読み込む
const template = $('#room-template').html();
rooms.forEach( function(room) {
room.profileImagePath = ASSET_PATH + 'images/user-profile.png'
if (room.message) {
room.message = room.message.toString()
} else {
room.message = getLocalizedString("noMessages")
}
let html = Mustache.render(template, {
roomName: room.roomName,
roomId: room.roomId,
profileImage: room.profileImagePath,
active: activeRoomId === room.roomId ? 'active_chat' : null, // 現在、入っているルームだとhilight表示
lastMessage: room.message.includes('<img') ? getLocalizedString("image") : (keywordSearchMode ? `${room.message}${getLocalizedString("searchResult")}` : room.message) ,
time: room.time ? CHAT_UTIL.formatDate(room.time.time).createdAt : '',
unreadMsgCnt: room.unreadCnt,
userCnt: room.userCnt
});
// Click event
let obj = $(jQuery.parseHTML(html)).on('click',function(){
if (activeRoomId === room.roomId) {
// 既存チャットルームをタッチする場合、チャット画面に遷移
$('#pills-chat-tab').tab('show');
} else {
// loadingIndicatorを表示しない
CHAT_UI.showLoadingIndicator();
// 新しいチャットルームをタッチする場合、チャットルームの接続処理を実行
socket.emit('joinRoom', room.roomId, room.roomName, function (){
CHAT.saveRoomInfo(room.roomId, room.roomName);
$('#messages').html('');
// チャットルーム名を変更する
$('.titleRoomName').text(room.roomName).data('roomName', room.roomName);
});
}
});
// チャットルームリストに追加する
$('#room_list').append(obj);
});
// #36146に対応
if(rooms.length > 0) {
if(!keywordSearchMode) {
$(".roomListIcon").show()
$('#roomDeleteButton, #arrangeRooms').show()
} else {
$(".roomListIcon").show()
$('#roomDeleteButton, #arrangeRooms').hide()
}
} else {
if(!keywordSearchMode) {
$(".roomListIcon").hide()
} else {
$(".roomListIcon").show()
$('#roomDeleteButton, #arrangeRooms').hide()
}
}
$('#createChatRoom').show()
// Rotate
if(CHAT_UI.isLandscapeMode()) {
$(".chat_list").removeClass("col-12").addClass("col-6");
}
$("#userSelectionDeleteBtn").hide();
// チャットルームリスト画面に遷移
$('#pills-chatlist-tab').tab('show');
// loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
});*/
// New Message
// #36170
socket.on('newMessage', function(message, roomId, roomName) {
let template = $('#message-template').html();
if (message.id === socket.id) {
// ユーザーが送信したメッセージの場合、自分のメッセージ様式を適用して表示する
template = $('#message-template-me').html();
}
let messageTime = CHAT_UTIL.formatDate(message.createdAt);
message.profileImagePath = CHAT.getProfileImgUrl(message.profileImagePath)
try {
message.text = decodeURIComponent(message.text)
} catch(e) {
message.text = message.text
}
let html = Mustache.render(template, {
text: message.text,
from: message.from,
profileImage: message.profileImagePath,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime
});
// イメージの場合、img tagを追加する
html = message.text.includes('attachedImages') || message.text.includes('attachedVideos') ? CHAT_UTIL.htmlDecode(html) : html;
$('#messages').append(html);
// 画像、動画の描画を待ってからスクロール
setTimeout(function () {
CHAT_UI.scrollToBottom();
}, 1500);
});
// Notification
socket.on('newNotification', function(keyword, event) {
var notificationString = getLocalizedString(event, keyword)
$('#messageNotification').finish().text(notificationString).delay(500).slideDown().delay(1500).slideUp();
});
// 新しいメッセージを受信する場合の処理
// #36170
// socket.on('loadMessages', function(messages, shopMemberId, users, roomId, roomName){
// let jQueryMessages = $('#messages');
// // スクロールの変化を防ぐため以前画面の高さを保存する
// let beforeHeight = jQueryMessages.prop('scrollHeight');
// // メッセージ文字列の生成
// let workVal = "";
// messages.forEach(function(message) {
// let template = $('#message-template').html();
// if (message.shopMemberId == shopMemberId) {
// template = $('#message-template-me').html();
// }
// let messageTime = CHAT_UTIL.formatDate(message.time.time);
//
// if (users != undefined) {
// let user = users.find((user) => user.loginId == message.loginId)
//
// // userProfilePathが使えるpathかをcheckして使えないpathの場合、default画像の経路に変更
// if (user) {
// message.profileImagePath = CHAT.getProfileImgUrl(user.profileImagePath)
// } else {
// message.profileImagePath = CHAT.getProfileImgUrl("")
// }
// } else {
// message.profileImagePath = CHAT.getProfileImgUrl(message.profileImagePath)
// }
//
// // #36147
// message.message = message.message.toString();
// var replacePath = message.message;
// replacePath = replacePath.replaceAll('/acms',CHAT_SERVER_URL+'/acms');
// message.message = replacePath;
// let html = Mustache.render(template, {
// text: message.message,
// from: message.loginId,
// profileImage: message.profileImagePath,
// createdAtDay: messageTime.createdAtDay,
// createdAtTime: messageTime.createdAtTime
// });
// html = message.message.includes('attachedImages') || message.message.includes('attachedVideos') ? CHAT_UTIL.htmlDecode(html) : html;
// workVal = html + workVal;
// })
//
// // メッセージの画面描画
// jQueryMessages.prepend(workVal);
// if (beforeHeight !== 0) {
// // 追加のメッセージ読み込み時は読み込み前のスクロール位置を維持
// setTimeout(function () {
// jQueryMessages.scrollTop(jQueryMessages.prop('scrollHeight') - beforeHeight);
// }, 400);
// } else {
// // 新規に入室の場合は最下部へスクロール
// CHAT_UI.waitForLoadingImage(jQueryMessages, CHAT_UI.scrollToBottom);
// // タブレット等、画面サイズが大きい場合、スクロール出来なくならないよう追加で10件メッセージを取得
// if ($(window).height() > jQueryMessages.height()) {
// $('#messages').scroll();
// }
// }
//
// // ユーザ削除ボタン表示しない
// $("#userSelectionDeleteBtn").hide();
//
// CHAT_UI.dismissLoadingIndicator();// add some...
//
// // チャットに遷移する
// $('#pills-chat-tab').tab('show');
// });
// Update User List In Room
// サイドバーのユーザーリストアップデート。
socket.on('updateUserList', function(users, onlineUsers) {
if (users.length > 0) {
$('#users').removeData();
$('#users').data(users);
} else {
const data = $('#users').data();
if (data && Object.keys(data).length > 0) {
users = Object.keys(data).map(function(key) {
return data[key];
});
}
}
const ul = $('<ul/>', {class: 'list-unstyled components'});
// ユーザーリストを入れる前にユーザー招待ボタンを入れてくれる。
let inviteString = getLocalizedString("inviteUsersButton")
ul.append($('<li/>').append(`<a>${inviteString} <i class='fa fa-user-plus'><i/></a>`).on('click', function(event) {
$('#dismiss').click();
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let isInvite = true;
CHAT.globalIsInvite = isInvite;
socket.emit('getGroupList', isInvite);
}));
// ユーザーリストを入れる
users.forEach(function(user) {
let li = $('<li/>');
let a = $('<a/>').text(user);
if (onlineUsers.includes(user)) {
// 接続されているユーザにバッジを付ける。
a.append($('<span/>',{class:'badge badge-success'}).text('online'));
}
li.append(a);
ul.append(li);
});
$('#users').html(ul);
});
// Update Group List(Invite)
socket.on('refreshGroupList', function(groups, isInvite) {
$('#group_list').html('');
const template = $('#group-template').html();
if (groups.length === 0) {
$('#group_list').append('<center class="text-secondary">'+ getLocalizedString(everyoneIsHere) +'</center>');
}
// グループ名と人数を表記する。
groups.forEach(function(group) {
let html = Mustache.render(template, {
name: group.groupName,
info: group.memberCnt + getLocalizedString("people")
});
// グループをクリックすると、該当グループのユーザーリストを読み込むようにイベントを与える
let obj = $(jQuery.parseHTML(html)).on('click', function() {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
socket.emit('getUserListInGroup', group.groupId, isInvite);
$('#groupName').text(group.groupName);
});
$('#group_list').append(obj);
});
// Rotate
if (CHAT_UI.isLandscapeMode()) {
$(".group_list").addClass("col-6").removeClass("col-12");
}
// Set Title
let memberSelectTitle = getLocalizedString("groupSearch")
$('#pills-group-tab').tab('show');
$('#backButton').show();
if (isInvite) {
$('.titleRoomName').text(memberSelectTitle);
$('#newRoomName, .roomListIcon, .chatRoomIcon').hide();
$('#userSelectionConfirmBtn').show();
$("#userSelectionConfirmBtn").off().on('click', function() {
CHAT_UI.setConfirmButtonEvent(isInvite);
});
} else {
$('.titleRoomName').text(memberSelectTitle);
$('.roomListIcon, .chatRoomIcon, #newRoomName').hide();
$('#userSelectionConfirmBtn').show();
$("#userSelectionConfirmBtn").off().on('click', function() {
CHAT_UI.setConfirmButtonEvent(isInvite);
});
}
if (CHAT.globalSelectedUserList.length > 0) {
$('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
} else {
$('#userSelectionLength').text('');
}
$('#backButton').off().on('click', function() {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
if (isInvite) {
$('#pills-chat-tab').tab('show');
} else {
if (IS_ONLINE == 'true') {
android.updateRoomList();
CHAT_UI.refreshRoomList(chatRoomType.DM);
CHAT_UI.dismissLoadingIndicator();
}
}
});
});
// Update User List(Invite)
// #36170
socket.on('refreshUserListInGroup', function(users, groupId, isInvite) {
$('#user_list').html('');
const template = $('#user-template').html();
// Set Title
let memberSelectTitle = getLocalizedString("userSearch")
$('.titleRoomName').text(memberSelectTitle);
users.forEach( function(user) {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
user.profileImagePath = CHAT.getProfileImgUrl(user.profileImagePath)
let html = Mustache.render(template, {
id: user.shopMemberId,
profileImage: user.profileImagePath,
name: user.loginId
});
// クリックするとactive クラスを与え、チェック表示を出させる。
let obj = $(jQuery.parseHTML(html)).on('click',function() {
if ($(this).find('.userCheckBox.active').length > 0) {
// remove
CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
return user.loginId != element.loginId;
});
} else {
// add
CHAT.globalSelectedUserList.push({loginId:user.loginId, shopMemberId : user.shopMemberId, profileImagePath: user.profileImagePath});
}
$(this).find('.userCheckBox').toggleClass('active');
if (CHAT.globalSelectedUserList.length > 0) {
$('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
} else {
$('#userSelectionLength').text('');
}
});
let findObj = CHAT.globalSelectedUserList.find(function(selectedUser) {
return selectedUser.loginId == user.loginId;
})
if (findObj) {
$(obj).find('.userCheckBox').toggleClass('active');
}
$('#user_list').append(obj);
})
$('.userCheckBox').show();
// Rotate
if (CHAT_UI.isLandscapeMode()) {
$(".user_list").addClass("col-6").removeClass("col-12");
$(".squareBoxContent span").addClass("landscape_span");
}
$('#backButton').off().on('click', function() {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
socket.emit('getGroupList', isInvite)
});
$("#userSelectionConfirmBtn").off().on('click', function() {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
CHAT_UI.setConfirmButtonEvent(isInvite);
});
$('#backButton').show();
$('.roomListIcon, .chatRoomIcon').hide();
$('#userSelectionConfirmBtn').show();
$('.userCheckBox').show();
$('#pills-user-tab').tab('show');
});
/* ---------------------------------------------------------------------- */
/* Show Error Log */
/* ---------------------------------------------------------------------- */
socket.on('showServerError', function(message) {
// #36174
// #36215
if (message.includes("SC_FORBIDDEN"))
{
alert('SC_FORBIDDEN');
return;
}
if (message == 'server error Ocurred') {
message = getLocalizedString("serverErrorOccured");
} else if (message == 'Room not found') {
message = getLocalizedString("errorRoomNotFound");
}
$("#customAlertTitle").text(message);
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
CHAT_UI.dismissLoadingIndicator();
if (message == "Room not found") {
CHAT.saveRoomInfo();
}
});
// server's request : user info (retry join)
socket.on("retryJoinProcess", () => {
var ua = window.navigator.userAgent.toLowerCase();
//if ((ua.indexOf('iphone') > 0 || ua.indexOf('ipad') > 0) && ua.indexOf("safari") == -1) {
if (CHAT_UTIL.isIOS()) {
// iosでの場合
webkit.messageHandlers.loginInfoRequestMessageHandlerId.postMessage({});
// } else if (ua.indexOf('android') > 0 && ua.indexOf('linux') == -1){
} else if (CHAT_UTIL.isAndroid()) {
// androidでの場合
android.getLoginParameter();
} else {
CHAT_UI.htmlElementTextInitialize("ko")
// webでのsocket connect
socket.emit('join', params, function(err) {
if (err) {
// #36174
$("#customAlertTitle").text(err);
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
} else {
if (params.roomName != undefined) {
$('.titleRoomName').text(params.roomName).data('roomName', params.roomName);
} else {
let roomListTitle = getLocalizedString("roomListTitle")
$('.titleRoomName').text(roomListTitle)
}
}
// loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
});
}
})
}
\ No newline at end of file
public_new/js/chat.js
// 名前空間
var CHAT = {};
// test comment
//招待するメンバーを保存する変数
CHAT.globalSelectedUserList = new Array();
CHAT.globalIsInvite = false;
//ログイン中の部屋情報を保存する変数
CHAT.globalLoginParameter;
CHAT.saveRoomInfo = function(roomId, roomName) {
CHAT.globalLoginParameter.roomId = roomId;
CHAT.globalLoginParameter.roomName = roomName;
if (CHAT_UTIL.isIOS()) {
webkit.messageHandlers.roomInfosaveMessageHandlerId.postMessage({"roomId":roomId, "roomName":roomName});
} else if (CHAT_UTIL.isAndroid()) {
if (roomId == undefined && roomName == undefined) {
android.saveVisitRoomInfo('', '');
} else {
android.saveVisitRoomInfo(roomId, roomName);
}
}
}
// #36170 画像パスが存在しない場合はデフォルトの画像を返す
// 存在する場合はプロフィール画像取得用APIのURLを生成して返す
CHAT.getProfileImgUrl = function(path) {
if (path == undefined || path == "") {
return ASSET_PATH + 'img/noImage.png';
} else {
var userInfo = path.split("/").reverse();
return CMS_SERVER_URL + '/chatapi/user?profileFileName=' + userInfo[0] + '&profileGetLoginId=' + userInfo[1] + '&sid=' + CHAT.globalLoginParameter.sid + '&cmd=12';
}
}
// Video のサムネイルファイル生成する
CHAT.createVideoThumbnailAndUpload = function(sourceImage, callback) {
var fileReader = new FileReader();
fileReader.onload = function() {
var blob = new Blob([fileReader.result], {type: sourceImage.type});
var url = URL.createObjectURL(blob);
var video = document.createElement('video');
var timeupdate = function() {
if (snapImage()) {
video.removeEventListener('timeupdate', timeupdate);
video.pause();
}
};
video.addEventListener('loadeddata', function() {
if (snapImage()) {
video.removeEventListener('timeupdate', timeupdate);
}
});
var snapImage = function() {
var canvas = document.createElement('canvas');
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);
fetch(canvas.toDataURL("image/jpeg"))
.then(function(res) {
return res.arrayBuffer();
})
.then(function(buf) {
// 回転された画像をFormDataに保存
const newFile = new File([buf], sourceImage.name, {type:"image/jpeg"});
callback(newFile, true);
// ajax End
}).catch((error) => { // fetch Error catch Block
if (error) {
console.log(error)
}
});
return true;
};
video.addEventListener('timeupdate', timeupdate);
video.preload = 'metadata';
video.src = url;
// Load video in Safari / IE11
video.muted = true;
video.playsInline = true;
video.play();
};
fileReader.readAsArrayBuffer(sourceImage);
}
// Ajaxでイメージをアップロードする
CHAT.uploadImage = function(formData) {
formData.append('roomId', CHAT.globalLoginParameter.roomId);
jQuery.ajax({
async: true,
url: CMS_SERVER_URL+"/file/upload",
type: "post",
data: formData,
contentType: false,
processData: false
}).done(function(res) {
// 8
var imgPath = CMS_SERVER_URL + '/file/getImage?fileName=' + res.fileName + '&roomId=' + CHAT.globalLoginParameter.roomId;
var imageName = res.fileName
// uploadFileの判断
var extension = imageName.substr(imageName.lastIndexOf('.') + 1).toLowerCase();
// 画像の処理
if (res.fileType == "jpeg" || res.fileType == "jpg" || res.fileType == "png") {
if (res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath = CMS_SERVER_URL + '/file/getImage?fileName=' + res.thumbImageFileName + '&roomId=' + CHAT.globalLoginParameter.roomId;
imageName = res.thumbImageFileName;
}
let downloadPath = CMS_SERVER_URL + '/file/download?fileName=' + imageName + '&roomId=' + CHAT.globalLoginParameter.roomId;
// アップロードが終了した後ローディング画面から離れてメッセージをメッセージを転送する
const lightbox = $('<a/>',{href:imgPath, 'data-lightbox':'attachedImages','data-title':imageName});
const image = $('<img/>',{src:imgPath, width:'auto',style:'max-width:100%'});
const downloadIcon = $('<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);
} else { // 動画の処理
if (res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath = CMS_SERVER_URL + '/file/getImage?fileName=' + res.thumbImageFileName + '&roomId=' + CHAT.globalLoginParameter.roomId;
}
let downloadPath = CMS_SERVER_URL + '/file/download?fileName=' + imageName + '&roomId=' + CHAT.globalLoginParameter.roomId;
const aTag = $('<a/>', {id:"attachedImages"})
const image = $('<img/>',{src:imgPath, width:'auto',style:'max-width:100%'});
const downloadIcon = $('<a/>',{href:downloadPath, class:'fa fa-download', download:res.fileName});
aTag.append(image);
aTag.append(downloadIcon);
let text = aTag.prop('outerHTML');
let encodedText
try {
encodedText = encodeURIComponent(text)
} catch(e) {
encodedText = text;
}
socket.emit('createMessage', {
text: encodedText
}, 1);
}
$('.overlay').removeClass('active undismissable');
$('.loader').removeClass('active');
CHAT_UI.dismissLoadingIndicator();
})
}
// Thumbnailのファイルを生成する。
CHAT.createThumbnailAndUpload = function(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);
}
// 該当チャットルームに参加するためログイン情報をサーバに渡す
getLoginParameter = function(sid, loginId, shopName, roomId = undefined, roomName = undefined, languageCode) {
var loginParam = new Object()
loginParam.sid = sid;
loginParam.loginId = loginId;
loginParam.shopName = shopName;
loginParam.roomId = roomId;
loginParam.roomName = roomName;
CHAT.globalLoginParameter = loginParam;
if (!languageCode) {
languageCode = "en"
}
CHAT_UI.htmlElementTextInitialize(languageCode)
if (IS_ONLINE == 'true') {
socket.emit('join', loginParam, function(err) {
if (err) {
// #36174
$("#customAlertTitle").text(err);
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
} else {
console.log('No error');
if (loginParam.roomName != undefined && loginParam.roomName != "null") {
$('.titleRoomName').text(loginParam.roomName).data('roomName', loginParam.roomName);
} else {
// 設定されていたroomNameがない場合
let roomListTitle = getLocalizedString("roomListTitle")
$('.titleRoomName').text(roomListTitle).data('roomName', roomListTitle);
}
}
// loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
});
} else {
// loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
}
}
CHAT.leaveRoom = function() {
socket.emit('leaveRoom', function() {
});
}
CHAT.requestMyinfo = function() {
jQuery.ajax({
async: true,
url: CMS_SERVER_URL + "/chatapi/user?sid=" + CHAT.globalLoginParameter.sid + "&cmd=" + userAPICmd.MYINFO,
type: "get",
processData: false,
contentType: false
}).done(function(res) {
console.log(res);
return res;
})
}
$(function() { $(function() {
// ルーム開設メンバー数カウント // ルーム開設メンバー数カウント
$('input:checkbox').change(function() { $('input:checkbox').change(function() {
......
public_new/js/common.js
// アコーディオン
$('.category').on('click',function () {
$(this).toggleClass("open");
$(this).next().slideToggle();
});
$(function() { $(function() {
var h = $(window).height(); //画面の高さを取得 var h = $(window).height(); //画面の高さを取得
// アコーディオン
$('.category').click(function() {
$(this).toggleClass("open");
$(this).next().slideToggle();
});
// ローディング表示 // ローディング表示
$('footer a').click(function(event){ $('footer a').click(function(event){
const a = $(this); const a = $(this);
......
public_new/js/constant.js
...@@ -16,3 +16,17 @@ const messageType = { ...@@ -16,3 +16,17 @@ const messageType = {
SYSTEM : 3 , SYSTEM : 3 ,
COMMUNICATION : 4 COMMUNICATION : 4
} }
const userAPICmd = {
MYINFO : 9
}
const chatRoomType = {
DM : "1",
GROUP : "0"
}
const nameCardAreaId = {
MY : "myNamecard",
USER : "userNamecard"
}
\ No newline at end of file
public_new/js/contact.js
$(function() { $(function() {
// メンバー検索 // メンバー検索
$('#contact .search_form input[type="search"]').keyup(function(){ $('#contact .search_form input[type="search"]').keyup(function(){
$.ajax({ var isAllGroup = $('#tabAllGroup').is(':checked');
url: 'search_message_user_list.html', $('.overlay_src_msg').empty();
type: 'POST',
datatype: 'html' //全グループ検索画面
}).done(function (data) { if (isAllGroup) {
$('.overlay_src_msg').html(data); var keyword = $('#contact .search_form input[type="search"]').val();
}) if (keyword == '') {
return;
}
//グループデータ検索
var groupList = CHAT_DB.getGroupByName(keyword);
var groupTemplate;
$.get({ url: "./template/template_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
groupList.forEach(function(group) {
let html = Mustache.render(groupTemplate, {
name: group.groupName,
id: group.groupId,
isFavorite: group.isFavorite
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
})
//ユーザデータ検索
var userList = CHAT_DB.getAllGroupShopMemberByName(keyword);
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
　　//連絡先画面
} else {
var keyword = $('#contact .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
var userList = CHAT_DB.getMyGroupShopMemberByName(keyword);
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').html(obj);
}
}); });
}); });
public_new/js/language.js 0 → 100644
$.lang = {};
//default set
$.lang.currentLang = "en"
function setLanguage(language) {
if(language.indexOf("ja") > -1) {
$.lang.currentLang = "ja"
} else if(language.indexOf("ko") > -1) {
$.lang.currentLang = "ko"
} else {
$.lang.currentLang = "en"
}
}
function getLocalizedString(stringKey, ...args)
{
let string = $.lang[$.lang.currentLang][stringKey];
if(args.length > 0) {
if(args.length == 1) {
string = string.replace("%@", args[0])
} else {
string = string.replace("%@", args.join($.lang[$.lang.currentLang].userListDivideString))
}
}
return string
}
public_new/js/language_en.js 0 → 100644
$.lang.en = {
"chat_placeholder":"Type message",
"chat_search_placeholder":" Search Message",
"room_search_placeholder":" Search Room",
"participants":"Member List",
"exitRoom":"Exit ",
"roomListTitle":"Room List",
"deleteRoomTitle":"Delete Room",
"inviteUsersButton":"invite",
"inviteUsersTitle":"Invite Member",
"createRoomTitle":"Create Room",
"createRoomSubtitle":"Room Name",
"inviteUsersSubtitle":"Invite User",
"roomListEmptyString":"There is no room available.",
"invitedUser":"Invited Users",
"left":"%@ has left",
"join":"%@ has joined",
"added":"%@ has been invited",
"welcome":"Welcome to %@",
"userListDivideString":", ",
"orderByTime":"OrderByTime",
"orderByUnread":"OrderByUnread",
"roomKeywordPlaceHolder":"Search",
"okayLabel":"Okay!",
"completeLabel":"Complete.",
"thankLabel":"Thank you",
"startToWorkLabel":"Start to work",
"groupListKeyword":"Search",
"userSearch":"User Search",
"groupSearch":"Group Search",
"groupPageSubtitle":"Groups",
"noMessages":"No Messages",
"image":"Image",
"chatKeyword":"Search",
"userListKeyword":"Search",
"newRoomName":"Please input Room Name",
"everyoneIsHere":"Everyone is in the chat.",
"people":"people",
"searchResult":"Results",
"searchRoomListEmptyString":"No search results.",
"inputRoomName":"Please enter a room name.",
"exitRoomTitle":"Do you want to leave this room?",
"roomDeleteTitle":"Do you want to delete this room?",
"roomDelete":"Delete",
"cancelTitle":"No",
"yesTitle":"Yes",
"invalidCharacter":"The character ;/?:@&amp;=+$,-_.!~*\'()#\\\"` cannot be included in the roomname.",
"nameTooLong":"Please enter room name less than 20 characters.",
"errorDisconnected":"Disconnected from the server.",
"errorConnect":"There was a problem with the network.\n Please check the connection status of the network.",
"errorRoomNotFound":"This chat room has already been deleted.",
"serverErrorOccured":"App will not be able to communicate with the server. \n After a few moments, please try again.",
"memberDeleteTitle":"Do you want to remove selected members from the list?",
"photo":"Photo",
"video":"Video",
"contactListTitle":"Contact",
"contactSearch":"Contact search",
"directMessageChatRoom":"DM",
"favorite":"Favorite List",
"mygroup":"My Group",
"groupChatRoom":"Group",
"myGroup":"My Group",
"allGroup":"All Group",
"returnToRootGroup":"Return to Root Group",
"returnToParentGroup":"Return to Parent Group",
"quickBtn":"Quick Button",
"groupPath":"Group Path",
"childGroup":"Minor Group",
"groupUser":" Member List",
"chat":"Chat",
"voice":"Call",
"addFavorite":"Add Favorite"
}
public_new/js/language_ja.js 0 → 100644
$.lang.ja = {
"chat_placeholder":"メッセージを入力",
"chat_search_placeholder":" メッセージ検索",
"room_search_placeholder":" ルーム検索",
"participants":"メンバーリスト",
"exitRoom":"退出 ",
"roomListTitle":"ルーム一覧",
"deleteRoomTitle":"ルーム削除",
"inviteUsersButton":"招待",
"inviteUsersTitle":"メンバー追加",
"createRoomTitle":"ルーム開設",
"createRoomSubtitle":"ルーム名",
"inviteUsersSubtitle":"ユーザ招待",
"roomListEmptyString":"入場できるルームがありません。",
"left":"%@ 様が退場しました。",
"join":"%@ 様が入場しました。",
"added":"%@ 様を招待しました。",
"welcome":"%@ に入場しました。",
"userListDivideString":" 様, ",
"orderByTime":"新着順",
"orderByUnread":"未読優先",
"roomKeywordPlaceHolder":"検索",
"okayLabel":"了解しました。",
"completeLabel":"完了しました。",
"thankLabel":"ありがとうございます。",
"startToWorkLabel":"作業開始します。",
"userSearch":"ユーザー検索",
"groupSearch":"グループ検索",
"groupListKeyword":"検索",
"groupPageSubtitle":"グループ",
"noMessages":"メッセージがありません。",
"image":"画像",
"chatKeyword":"検索",
"userListKeyword":"検索",
"invitedUser":"参加者",
"newRoomName":"ルーム名を入力してください",
"everyoneIsHere":"招待可能なメンバーがいません。",
"people":"人",
"searchResult":"件のトーク",
"searchRoomListEmptyString":"検索結果がありません。",
"inputRoomName":"ルーム名を入力してください。",
"exitRoomTitle":"このチャットルームを出ますか？",
"roomDeleteTitle":"このチャットルームを削除しますか？",
"roomDelete":"削除",
"cancelTitle":"いいえ",
"yesTitle":"はい",
"invalidCharacter":"特殊文字 ;/?:@&amp;=+$,-_.!~*\'()#\\\"` はルーム名に含めることができません。",
"nameTooLong":"ルーム名は文字列20字以内に入力してください。",
"errorDisconnected":"接続が切れました。",
"errorConnect":"ネットワークに問題がありました。\nネットワークの接続状態を確認してください。",
"errorRoomNotFound":"既に削除されたチャットルームです。",
"serverErrorOccured":"サーバと通信できません。\nしばらく時間をおいて再度操作してください。",
"memberDeleteTitle":"選択したメンバーをリストから削除しますか？",
"photo":"写真",
"video":"動画",
"contactListTitle":"コンタクト",
"contactSearch":"コンタクト検索",
"directMessageChatRoom":"DM",
"favorite":"お気に入りリスト",
"mygroup":"マイグループ",
"groupChatRoom":"グループ",
"myGroup":"マイグループ",
"allGroup":"全グループ",
"returnToRootGroup":"トップグループに戻る",
"returnToParentGroup":"上位グループに戻る",
"quickBtn":"クイックボタン",
"groupPath":"グループパンクズ",
"childGroup":"下位グループ",
"groupUser":"所属ユーザ",
"chat":"チャット",
"voice":"通話",
"addFavorite":"お気に入り追加"
}
public_new/js/language_ko.js 0 → 100644
$.lang.ko = {
"chat_placeholder":"메시지를 입력하세요.",
"chat_search_placeholder":" 메세지검색",
"room_search_placeholder":" 채팅방 검색",
"participants":"멤버 리스트",
"exitRoom":"나가기 ",
"roomListTitle":"채팅 리스트",
"deleteRoomTitle":"채팅방 삭제",
"inviteUsersButton":"유저 초대",
"inviteUsersTitle":"대화상대 추가",
"createRoomTitle":"방 개설",
"createRoomSubtitle":"방 이름",
"inviteUsersSubtitle":"유저 초대",
"roomListEmptyString":"입장 가능한 방이 없습니다.",
"invitedUser":"참가자",
"left":"%@ 님이 방을 떠났습니다.",
"join":"%@ 님이 참가했습니다.",
"added":"%@ 님을 초대했습니다.",
"welcome":"%@ 에 입장했습니다.",
"userListDivideString":" 님, ",
"orderByTime":"최신순",
"orderByUnread":"안 읽은 순",
"roomKeywordPlaceHolder":"검색",
"okayLabel":"알겠습니다.",
"completeLabel":"작업이 끝났습니다.",
"thankLabel":"감사합니다.",
"startToWorkLabel":"작업을 시작합니다.",
"groupListKeyword":"검색",
"userSearch":"유저 검색",
"groupSearch":"그룹 검색",
"groupPageSubtitle":"그룹",
"noMessages":"메시지가 없습니다.",
"image":"이미지",
"chatKeyword":"검색",
"userListKeyword":"검색",
"newRoomName":"방 이름을 입력해주세요.",
"everyoneIsHere":"초대가능한 유저가 없습니다.",
"people":"명",
"searchResult":"건의 결과",
"searchRoomListEmptyString":"검색 결과가 없습니다.",
"inputRoomName":"방 제목을 입력해 주십시오.",
"exitRoomTitle":"이 채팅방을 나가시겠습니까?",
"roomDeleteTitle":"이 방을 삭제 하시겠습니까?",
"roomDelete":"삭제",
"cancelTitle":"아니오",
"yesTitle":"예",
"invalidCharacter":"특수문자 ;/?:@&amp;=+$,-_.!~*\'()#\\\"` 는 방 제목에 포함될 수 없습니다.",
"nameTooLong":"방 제목은 20자 이내로 입력해 주세요.",
"errorDisconnected":"서버와 접속이 끊어졌습니다.",
"errorConnect":"네트워크에 문제가 발생했습니다.\n네트워크 연결상태를 확인하여 주십시요.",
"errorRoomNotFound":"이미 삭제된 채팅룸입니다.",
"serverErrorOccured":"서버와 통신할 수 없습니다.\n잠시 후 다시 시도해보시기 바랍니다.",
"memberDeleteTitle":"목록에서 선택된 멤버를 삭제하시겠습니까?",
"photo":"사진",
"video":"동영상",
"contactListTitle":"연락처",
"contactSearch":"연락처 검색",
"directMessageChatRoom":"DM",
"favorite":"즐겨찾기리스트",
"mygroup":"마이그룹",
"groupChatRoom":"그룹",
"myGroup":"내그룹",
"allGroup":"전그룹",
"returnToRootGroup":"최상위그룹으로 돌아가기",
"returnToParentGroup":"상위그룹으로 돌아가기",
"quickBtn":"퀵버튼",
"groupPath":"그룹 경로",
"childGroup":"하위 그룹",
"groupUser":"소속 사용자",
"chat":"채팅",
"voice":"통화",
"addFavorite":"즐겨찾기추가"
}
public_new/modal_chat_profile.html
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header border-0"> <div class="modal-header border-0">
<div class="prifile_desc d-flex flex-row"> <div class="profile_desc d-flex flex-row">
<img src="img/noImage.png" alt="プロフィール画像"> <img src="img/noImage.png" alt="プロフィール画像">
<div class="prifile_name"><span>名前　名前</span></div> <div class="profile_name"><span>名前　名前</span></div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
......
public_new/modal_collabo_profile.html
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header border-0"> <div class="modal-header border-0">
<div class="prifile_desc d-flex flex-row"> <div class="profile_desc d-flex flex-row">
<img src="img/noImage.png" alt="プロフィール画像"> <img src="img/noImage.png" alt="プロフィール画像">
<div class="prifile_name"><span>名前　名前</span></div> <div class="profile_name"><span>名前　名前</span></div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
......
public_new/modal_collabo_profile2.html
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header border-0"> <div class="modal-header border-0">
<div class="prifile_desc d-flex flex-row"> <div class="profile_desc d-flex flex-row">
<img src="img/noImage.png" alt="プロフィール画像"> <img src="img/noImage.png" alt="プロフィール画像">
<div class="prifile_name"><span>プロフィール2</span></div> <div class="profile_name"><span>プロフィール2</span></div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
......
public_new/search_message_user_list.html
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<a href="#" class="w-100"> <a href="#" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png"/></div> <div class="img_wrap"><img src="img/thumbnail.png"/></div>
</div> </div>
</div> </div>
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
<a href="#" class="w-100"> <a href="#" class="w-100">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thubnail"> <div class="thumbnail">
<div class="img_wrap"><img src="img/thumbnail.png"/></div> <div class="img_wrap"><img src="img/thumbnail.png"/></div>
</div> </div>
</div> </div>
......
public_new/template/template_group_list.html 0 → 100644
<li class="d-flex align-items-center">
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupSearch({{id}});">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thumbnail">
<img src="icon/icon_folder.png" alt="フォルダ" />
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">{{name}}</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
{{#isFavorite}}
<span class="star active group_{{id}}" onclick="CHAT_UI.favoriteGroupChange({{id}},this)"></span>
{{/isFavorite}}
{{^isFavorite}}
<span class="star disable group_{{id}}" onclick="CHAT_UI.favoriteGroupChange({{id}},this)"></span>
{{/isFavorite}}
</div>
</div>
</li>
\ No newline at end of file
public_new/template/template_group_path.html 0 → 100644
<a href="#" class="breadcrumb_item" onclick="CHAT_UI.refreshAllGroupSearch({{id}});"><span>{{name}}</span></a>
\ No newline at end of file
public_new/template/template_group_user_list.html 0 → 100644
<div class="category" onclick="CHAT_UI.toggleCategory(this);"><div class="category_name"><span>{{groupName}}</span></div></div>
<ul class="p-0 chat_make_room_list">
{{#groupUserList}}
<li class="d-flex align-items-center">
<a href="javascript:return false;" onclick="CHAT_UI.makeNameCard({{shopMemberId}})" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileImagePath}}" onError="this.src='./img/noImage.png'"/></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">{{shopMemberName}}</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
{{#isFavorite}}
<span class="star active shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
{{^isFavorite}}
<span class="star disable shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
</div>
</div>
</li>
{{/groupUserList}}
</ul>
\ No newline at end of file
public_new/template/template_my_name_card.html 0 → 100644
<div class="modal fade profile_modal" id="myNameCard" tabindex="-1" role="dialog" aria-labelledby="myNameCard" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header border-0">
<div class="profile_desc d-flex flex-row">
<img src="{{profileImage}}" onError="this.src='./img/noImage.png'">
<div class="profile_name"><span>{{name}}</span></div>
</div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
{{#groupPathList}}
<li><b>{{.}}</b></li>
{{/groupPathList}}
</div>
<div class="modal-footer border-0 justify-content-center">
<button type="button" class="border-0 bg_navy" style="width: 50%">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_photo.png" alt="プロフィール写真更新">
</div>
<span>プロフィール写真更新</span>
</div>
</button>
</div>
</div>
</div>
</div>
public_new/template/template_user_list.html 0 → 100644
<ul class="p-0 chat_make_room_list">
{{#userList}}
<li class="d-flex align-items-center">
<a href="javascript:return false;" onclick="CHAT_UI.makeNameCard({{shopMemberId}})" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">{{shopMemberName}}</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
{{#isFavorite}}
<span class="star active shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
{{^isFavorite}}
<span class="star disable shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
</div>
</div>
</li>
{{/userList}}
</ul>
\ No newline at end of file
public_new/template/template_user_name_card.html 0 → 100644
<div class="modal fade profile_modal" id="userNameCard" tabindex="-1" role="dialog" aria-labelledby="userNameCard" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header border-0">
<div class="profile_desc d-flex flex-row">
<img src="{{profileImage}}" onError="this.src='./img/noImage.png'"/>
<div class="profile_name"><span>{{name}}</span></div>
</div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
{{#groupPathList}}
<li style="display: block;">・{{.}}</li>
{{/groupPathList}}
</div>
<div class="modal-footer border-0 justify-content-center">
{{#isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.removeFavoriteUser({{shopMemberId}})">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite.png" alt="お気に入り">
</div>
<span>お気に入り解除</span>
</div>
</button>
{{/isFavorite}}
{{^isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.insertFavoriteUser({{shopMemberId}})">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite_white.png" alt="お気に入り">
</div>
<span>お気に入り登録</span>
</div>
</button>
{{/isFavorite}}
<button type="button" class="border-0 bg_green" >
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_phone.png" alt="通話">
</div>
<span>通話</span>
</div>
</button>
<button type="button" class="border-0 bg_blue">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_chat.png" alt="チャット">
</div>
<span>チャット</span>
</div>
</button>
</div>
</div>
</div>
</div>
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