уходим в gay dev

src/lib/chat.js

@@ -33,7 +33,7 @@
     
 
     else if(!response.ok)
-        console.log(response.status)
+    console.log(response.status)
       
  }
  
@@ -64,7 +64,6 @@
      const respone = await fetch('http://localhost:8000/api/images/upload_image',
      {
        method:"POST",
-       
        body:DataForm
      })
 
@@ -134,7 +133,25 @@
       return await response.json();
     }
     else
-    console.log(response.status)
+      console.log(response.status)
   
    }
  
+   export async function uploadImages(image) {
+
+    const formData = new FormData();
+      formData.append('file', image);
+
+    const response = await fetch('http://localhost:8000/api/images/upload_image', {
+      method: 'POST',
+      credentials: 'include',
+      body: formData,
+    });
+  
+    if (response.ok) {
+      return await response.json();
+    } else {
+      console.log(response);
+    }
+  }
+  

src/lib/userFunction.js

@@ -7,7 +7,7 @@ export async function UserCheck(){
     })
   
     if(!response.ok){
-      window.location.href = '/info'
+      window.location.href = '/login'
       return(response.status)
     }
 
@@ -17,13 +17,12 @@ export async function UserCheck(){
     }
   }
 
-  export async function handleLogout() {
+export async function handleLogout() {
     try{
         const response = await fetch('http://localhost:8000/api/users/logout',
         {
             method:'POST',
             credentials:'include'
-  
         })
         if (response.ok) 
         {

src/routes/chat/+page.svelte

@@ -1,5 +1,5 @@
 <script>
-	import { getLastMessages, MessagePicToUrl, getAllChats, getPinnedMsg, getMessageById, pinMessage, unpinMessage } from '$lib/chat';
+	import { getLastMessages, MessagePicToUrl, getAllChats, getPinnedMsg, getMessageById, pinMessage, unpinMessage, uploadImages } from '$lib/chat';
 	import { UserCheck } from '$lib/userFunction'
 	import Header from '../Header.svelte';
 	import createWebSocket from '$lib/websocket';
@@ -28,6 +28,7 @@
 	let chats = [] //массив чатов, доступных юзеру
 	let pinnedMsg = []
 	let chatId = null
+	
 	onMount(async () => {
 		
 		const userData = await UserCheck();
@@ -35,7 +36,6 @@
 		if(userId === undefined)
 			window.location.href = '/login'
 		
-
 		chats = await getAllChats()
 		console.log(chats)
 
@@ -83,7 +83,13 @@
 
 	async function sendMessage() {
 
+		let image = null
 		if(messageText != ""){
+		if(image_url != null){
+			image = await uploadImages(image_url)
+		}
+		console.log(image)
+		
 		socket.send(JSON.stringify({flag: flag,
 									message: messageText,
 									image_url: image_url,
@@ -318,7 +324,7 @@ function helperDivShow(event, id) {
 
 						</div>
 
-						 <input type="file" accept=".png, .jpeg, .jpg, .gif" id="fileInput" 
+						 <input type="file" accept=".png, .jpeg, .jpg" id="fileInput" 
 							    bind:this={imageFile} on:change={handleFileChange} style="display: none;">
 						
 					</div>
@@ -338,8 +344,10 @@ function helperDivShow(event, id) {
 			<div class="pinnedMain">
 				{#each pinnedMsg as msg}
 					<div class="pinDiv">
-						<div class="pinImg"><img class="pinnedImg" src="{msg.avatar_image}" alt=""></div>
+						<div class="pinAvatar"><img class="pinnedImg" src="{msg.avatar_image}" alt=""></div>
-						<div class="pinMsg"><h3  class="pinnedMsg">{msg.message}</h3></div>	
+						<div class="pinMsg">
+							<h3  class="pinnedMsg">{msg.message}</h3>
+							<img src="{msg.image_url}" class="pinImg" alt=""></div>	
 					</div>
 				{/each}
 				</div>
@@ -396,11 +404,17 @@ function helperDivShow(event, id) {
 	width: 90%;
 }
 
-.pinImg{
+.pinAvatar{
 	width: 10%;
 	margin-right: 15px;
 }
 
+.pinImg{
+	max-width: 90%;
+	height: auto;
+	border-radius: 15px;
+}
+
 .pinnedImg{
 	width: 60px;
 	height: auto;
@@ -542,8 +556,9 @@ function helperDivShow(event, id) {
 }
 
 .messageImage{
-	margin-top: 5pxS;
+	margin-top: 5px;
-	border-radius: 15px;
+	border-radius: 10px;
+	max-width: calc(100% - 15px);
 }
 
 .messageMessage{