Compare commits
	
		
			4 Commits
		
	
	
		
			ec2b975467
			...
			Schedule/m
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 220c891c72 | |||
| 2b9493422d | |||
| 621f568ba2 | |||
| 972d08a54d | 
							
								
								
									
										1
									
								
								Clyde
									
									
									
									
									
										Submodule
									
								
							
							
								
								
								
								
								
							
						
						
									
										1
									
								
								Clyde
									
									
									
									
									
										Submodule
									
								
							 Submodule Clyde added at bd27ffd3cb
									
								
							| @ -25,7 +25,6 @@ dependencies { | ||||
| 	implementation("com.kohlschutter.junixsocket:junixsocket-core:2.9.0") | ||||
| 	// implementation("org.springframework.session:spring-session-jdbc") | ||||
| 	developmentOnly("org.springframework.boot:spring-boot-devtools") | ||||
| 	// developmentOnly("org.springframework.boot:spring-boot-docker-compose") | ||||
| 	runtimeOnly("org.postgresql:postgresql") | ||||
| 	testImplementation("org.springframework.boot:spring-boot-starter-test") | ||||
| 	testImplementation("org.springframework.boot:spring-boot-testcontainers") | ||||
|  | ||||
| @ -47,6 +47,7 @@ public class ApplicationsController { | ||||
|  | ||||
|         //if unAuthed | ||||
|         authorizedApps.add(Applications.Login); | ||||
|         authorizedApps.add(Applications.Schedule); | ||||
|  | ||||
| 		User user = authServ.getUserFromToken(token); | ||||
| 		if(user == null) | ||||
|  | ||||
| @ -3,6 +3,7 @@ package ovh.herisson.Clyde.Tables; | ||||
| public enum Applications { | ||||
|     // without any token | ||||
|     Login, | ||||
|     Schedule, | ||||
|  | ||||
|     // with any token | ||||
|     Profile, | ||||
|  | ||||
							
								
								
									
										15
									
								
								frontend/package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										15
									
								
								frontend/package-lock.json
									
									
									
										generated
									
									
									
								
							| @ -8,7 +8,6 @@ | ||||
|       "name": "clyde", | ||||
|       "version": "0.0.0", | ||||
|       "dependencies": { | ||||
|         "@canvasjs/vue-charts": "^1.0.4", | ||||
|         "vite-plugin-top-level-await": "^1.4.1", | ||||
|         "vue": "^3.4.15", | ||||
|         "vue3-toastify": "^0.2.1" | ||||
| @ -30,20 +29,6 @@ | ||||
|         "node": ">=6.0.0" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/@canvasjs/charts": { | ||||
|       "version": "3.7.45", | ||||
|       "resolved": "https://registry.npmjs.org/@canvasjs/charts/-/charts-3.7.45.tgz", | ||||
|       "integrity": "sha512-FPMX8wn+PEHzAa/GLBsL5lWB81AzKZLw51t7SiSUjMbtUN5/OIrmDcwUTw+53/Bbdd9gm2LLmxAdZsQ75JI31g==" | ||||
|     }, | ||||
|     "node_modules/@canvasjs/vue-charts": { | ||||
|       "version": "1.0.4", | ||||
|       "resolved": "https://registry.npmjs.org/@canvasjs/vue-charts/-/vue-charts-1.0.4.tgz", | ||||
|       "integrity": "sha512-PzOA8xeb/f68a39uoFZNn843dGPU36bsqmbO5DWjP7k6FwkK5AeGkYa/H3RHC02Xc6mG68vg9aFNj2Fyqhu4UQ==", | ||||
|       "dependencies": { | ||||
|         "@canvasjs/charts": "^3.7.5", | ||||
|         "vue": ">=3.0.0" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/@esbuild/aix-ppc64": { | ||||
|       "version": "0.19.12", | ||||
|       "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.19.12.tgz", | ||||
|  | ||||
| @ -9,7 +9,6 @@ | ||||
|     "preview": "vite preview" | ||||
|   }, | ||||
|   "dependencies": { | ||||
|     "@canvasjs/vue-charts": "^1.0.4", | ||||
|     "vite-plugin-top-level-await": "^1.4.1", | ||||
|     "vue": "^3.4.15", | ||||
|     "vue3-toastify": "^0.2.1" | ||||
|  | ||||
| @ -25,7 +25,6 @@ window.addEventListener('hashchange', () => { | ||||
|   const login=ref(i18n("app.login")) | ||||
|   const active=ref(false) | ||||
|  | ||||
|  | ||||
| 	const apps = ref([]) | ||||
| 	appList().then(e => apps.value = e) | ||||
|  | ||||
|  | ||||
							
								
								
									
										211
									
								
								frontend/src/Apps/Schedule.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										211
									
								
								frontend/src/Apps/Schedule.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,211 @@ | ||||
| <script setup> | ||||
|   import { ref } from 'vue' | ||||
|   | ||||
|   const schedule = [ | ||||
|     {course:"Math Pour L'info", | ||||
|      start:"Wed Mar 27 2024 10:15 GMT+0100", | ||||
|      end:"Wed Mar 27 2024 12:15 GMT+0100"}, | ||||
|     { | ||||
|       course:"Calculus", | ||||
|       start:"Wed Mar 27 2024 08:00 GMT+0100", | ||||
|       end:"Wed Mar 27 2024 10:00 GMT+0100" | ||||
|        | ||||
|   }, | ||||
|   { | ||||
|       course:"Physique II", | ||||
|       start:"Tue Mar 26 2024 10:15 GMT+0100", | ||||
|       end:"Tue Mar 26 2024 12:15 GMT+0100"       | ||||
|   }, | ||||
|     { | ||||
|       course:"Math Pour L'info", | ||||
|       start:"Thu Mar 28 2024 10:15 GMT+0100", | ||||
|       end:"Thu Mar 28 2024 12:15 GMT+0100"       | ||||
|   }] | ||||
|   function formatDate(date) { | ||||
|     var d = new Date(date), | ||||
|         month = '' + (d.getMonth() + 1), | ||||
|         day = '' + d.getDate(), | ||||
|         year = d.getFullYear(); | ||||
|  | ||||
|     if (month.length < 2)  | ||||
|         month = '0' + month; | ||||
|     if (day.length < 2)  | ||||
|         day = '0' + day; | ||||
|  | ||||
|     return [day, month, year].join('-'); | ||||
|   } | ||||
|   function getMonday(d) { | ||||
|     d = new Date(d); | ||||
|     var day = d.getDay(), | ||||
|     diff = d.getDate() - day + (day == 0 ? -6 : 1); | ||||
|     return new Date(d.setDate(diff)); | ||||
|   } | ||||
|  | ||||
|   function getAnyDays(d){ | ||||
|  | ||||
|     var day = new Date(mondayOfWeek.value); | ||||
|     day.setDate(day.getDate() + d ); | ||||
|  | ||||
|     return day; | ||||
|   } | ||||
|  | ||||
|   const mondayOfWeek=ref(getMonday(new Date(schedule[1].start))) | ||||
|  | ||||
|   function isNotCourse(element){ | ||||
|     return element==null; | ||||
|   } | ||||
|  | ||||
|   function durationCourse(element){ | ||||
|     const hour = element.end.substring(3,5) -element.start.substring(3,5); | ||||
|      | ||||
|      | ||||
|     return (element.end - element.start)%2; | ||||
|   } | ||||
|   function sortByDate(a, b) { | ||||
|     const nameA = a.start; // ignore upper and lowercase | ||||
|     const nameB = b.start; // ignore upper and lowercase | ||||
|      | ||||
|     if (nameA < nameB) { | ||||
|       return -1; | ||||
|     } | ||||
|     if (nameA > nameB) { | ||||
|       return 1; | ||||
|     } | ||||
|     return 0;  | ||||
|       } | ||||
|  | ||||
|   function transpose(a) { | ||||
|     const trans = [[],[],[],[],[],[]]; | ||||
|     for(let i = 0; i < 6;i++){ | ||||
|       for(let j=0; j< 7; j++){ | ||||
|         if(a[j][i] !== null){ | ||||
|           trans[i].push(a[j][i]); | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     return trans; | ||||
| } | ||||
|  | ||||
|   function matrixFromList(list){ | ||||
|     const matrix = [[],[],[],[],[],[],[]]; | ||||
|     for(let key in list){ | ||||
|       const temp = []; | ||||
|       const day = new Date(list[key].start); | ||||
|       matrix[day.getDay()].push(list[key]); | ||||
|       matrix[day.getDay()].sort((a,b) => sortByDate(a,b)); | ||||
|     } | ||||
|       return matrix; | ||||
|   } | ||||
|  | ||||
|    | ||||
|   const schedule2 = matrixFromList(schedule); | ||||
|   const scheduleByWeek = transpose(schedule2); | ||||
|    | ||||
|   console.log(scheduleByWeek) | ||||
|  | ||||
| </script> | ||||
| <template> | ||||
|   <div class="grid"> | ||||
|     <div class="options" > | ||||
|     </div> | ||||
|     <div class="schedule"> | ||||
|       <table class="table"> | ||||
|         <tr style="background-color:rgb(24,24,24)"> | ||||
|           <th/> | ||||
|           <th class="header">Lundi {{formatDate(getAnyDays(0))}}</th> | ||||
|           <th class="header">Mardi {{formatDate(getAnyDays(1))}}</th> | ||||
|           <th class="header">Mercredi {{formatDate(getAnyDays(2))}}</th> | ||||
|           <th class="header">Jeudi {{formatDate(getAnyDays(3))}}</th> | ||||
|           <th class="header">Vendredi {{formatDate(getAnyDays(4))}}</th> | ||||
|           <th class="header">Samedi {{formatDate(getAnyDays(5))}}</th> | ||||
|           <th class="header">Dimanche {{formatDate(getAnyDays(6))}}</th> | ||||
|         </tr> | ||||
|         <tr v-for="(n,index) in 12"> | ||||
|           <th class="hour">{{8 + index}}:00-{{9+index}}:00</th> | ||||
|             <td v-for="m in 7"></td> | ||||
|         </tr> | ||||
|       </table> | ||||
|       <div class="courseGrid"> | ||||
|         <div v-for="i in 7"> | ||||
|           Test | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| <style scoped> | ||||
|   .grid{ | ||||
|     display:grid; | ||||
|     margin-top:2%; | ||||
|     align-items:center; | ||||
|     justify-content:center; | ||||
|     grid-template-columns:15vw 70vw; | ||||
|     column-gap:2.5vw; | ||||
|  | ||||
|     grid-template-areas:"options schedule"; | ||||
|   } | ||||
|   .schedule{ | ||||
|     position:relative;   | ||||
|     border-radius:20px; | ||||
|     grid-area:schedule; | ||||
|     width:100%; | ||||
|     height:85vh; | ||||
|     background-color:rgba(255,255,255,0.1);     | ||||
|   } | ||||
|   .options{ | ||||
|     border-radius:20px; | ||||
|     grid-area:options; | ||||
|     background-color:rgba(255,255,255,0.1); | ||||
|     width:100%; | ||||
|     height:85vh; | ||||
|   } | ||||
|  | ||||
|   .table{ | ||||
|     width:100%; | ||||
|     height:100%; | ||||
|     border-spacing:0; | ||||
|     border-collapse:separate; | ||||
|     border-radius: 20px; | ||||
|     border: 2px solid black | ||||
|   } | ||||
|    | ||||
|   .hour{ | ||||
|     background-color:rgb(72,72,72) | ||||
|  | ||||
|   } | ||||
|    | ||||
|   .header{ | ||||
|     align-items:center; | ||||
|     width:12.5%; | ||||
|     color:#FFFFFF; | ||||
|   } | ||||
|   table th:not(:last-child), | ||||
|   table td:not(:last-child) { | ||||
|   border-right: 1px solid black; | ||||
|   } | ||||
|    | ||||
|   table tr:not(:last-child)>td, | ||||
|   table tr:not(:last-child)>th | ||||
|   { | ||||
|     border-bottom:1px solid black; | ||||
|   } | ||||
|    | ||||
|   .courseGrid{ | ||||
|     top:13.75%;    | ||||
|     left:12.5%; | ||||
|     position:absolute; | ||||
|     width:87.5%; | ||||
|     height:86.25%;  | ||||
|     display:grid; | ||||
|     grid-template-columns:repeat(7,1fr); | ||||
|       } | ||||
|    | ||||
|  | ||||
|   .course{ | ||||
|     width:100%; | ||||
|     height:100%; | ||||
|     background-color:rgb(100,0,100); | ||||
|   } | ||||
|  | ||||
|    | ||||
| </style> | ||||
| @ -1,236 +0,0 @@ | ||||
| <!---------------------------------------------------- | ||||
| 	File:  ResearcherProfile.vue | ||||
| 	Author: Maxime Bartha | ||||
| 	Scope: Extension Publicatons scientifiquess | ||||
| 	Description: Researcher Profile Page containing his articles and his statistics | ||||
| -----------------------------------------------------> | ||||
|  | ||||
| <script setup> | ||||
| import { ref, reactive } from "vue"; | ||||
| const input = ref(""); | ||||
| const statsOf = ref(""); | ||||
| const statsBy = ref(""); | ||||
| let chart; | ||||
|  | ||||
| const jsonMockViewsByYears= [ | ||||
|   {label: "2004", y:4}, | ||||
|   {label: "2005", y:99}, | ||||
|   {label: "2007", y:555}, | ||||
|   {label: "2009", y:22}, | ||||
|   {label: "2011", y:1666}, | ||||
| ] | ||||
|  | ||||
| function inputKeyUp() { | ||||
|   let filter, ul, li, a, txtValue; | ||||
|   filter = input.value.toUpperCase(); | ||||
|   if (document.getElementById("myUL") != null) { | ||||
|     ul = document.getElementById("myUL"); | ||||
|     li = ul.getElementsByTagName("li"); | ||||
|  | ||||
|     // Loop through all list items, and hide those who don't match the search query | ||||
|     for (let i = 0; i < li.length; i++) { | ||||
|       a = li[i].getElementsByTagName("a")[0]; | ||||
|       txtValue = a.textContent || a.innerText; | ||||
|       if (txtValue.toUpperCase().indexOf(filter) > -1) { | ||||
|         li[i].style.display = ""; | ||||
|       } else { | ||||
|         li[i].style.display = "none"; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| const options = reactive({ | ||||
|     backgroundColor:null, | ||||
|     theme: "light2", | ||||
|     animationEnabled: true, | ||||
|     title: { | ||||
|       fontColor: "white", | ||||
|       text : "please select options", | ||||
|     }, | ||||
|     data: [ | ||||
|       { | ||||
|         type: "pie", | ||||
|         indexLabel: "{label} (#percent%)", | ||||
|         yValueFormatString: "#,##0", | ||||
|         indexLabelFontColor: "white", | ||||
|         toolTipContent: | ||||
|           "<span style='\"'color: {color};'\"'>{label}</span> {y}(#percent%)", | ||||
|       }] | ||||
| 	}); | ||||
|  | ||||
| function update(){ | ||||
|       options.title = { | ||||
|         fontColor: "white", | ||||
|         text: statsOf.value + " By "+ statsBy.value, | ||||
|       } | ||||
|       if (statsOf.value === "views" && statsBy.value === "years") { | ||||
|         options.data[0].dataPoints = jsonMockViewsByYears; | ||||
|       } | ||||
|  | ||||
|       options.title.text = statsOf.value + " By "+ statsBy.value; | ||||
|       chart.render() | ||||
|     } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <div id="main"> | ||||
|     <div id="profilePicture"> | ||||
|       <img src="/Clyde.png" /> | ||||
|     </div> | ||||
|     <div id="researcherInfos"> | ||||
|       <div class="surrounded">John Doe</div> | ||||
|       <div class="surrounded">Orcid : 12144-2144-12336-B</div> | ||||
|       <div class="surrounded">Email : John.Doe@umons.ac.be</div> | ||||
|  | ||||
|       <div class="surrounded"> | ||||
|         site : | ||||
|         <a href="http://localhost:5173" style="color: #007aff">here</a> | ||||
|       </div> | ||||
|       <div class="surrounded">Domain : physics, IT</div> | ||||
|       <div id="coAuthorList" class="surrounded">Co-authors list : D</div> | ||||
|     </div> | ||||
|     <div id="stats"> | ||||
|       <div class="surrounded"> | ||||
|         Stat type : | ||||
|         <select @change="update()" id="stats-select" v-model="statsOf"> | ||||
|           <option value="views">Views</option> | ||||
|           <option value="co-authors">Co-authors</option> | ||||
|           <option value="articles">Articles</option> | ||||
|           <option value="language">Languages</option> | ||||
|         </select> | ||||
|       </div> | ||||
|       <div class="surrounded"> | ||||
|         Class by: | ||||
|         <select @change="update()" id="classed-select" v-model="statsBy"> | ||||
|           <option selected="selected" value="years">Years</option> | ||||
|           <option value="months">Months</option> | ||||
|           <option value="topics">Topics</option> | ||||
|         </select> | ||||
|       </div> | ||||
|       <div id="statsPie"> | ||||
| 		  <CanvasJSChart :options="options" id=chart @chart-ref="c => chart = c "/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div id="articles"> | ||||
|       <input | ||||
|         type="text" | ||||
|         id="search-input" | ||||
|         @keyup="inputKeyUp()" | ||||
|         placeholder="search articles" | ||||
|         v-model="input" | ||||
|       /> | ||||
|       <ul id="myUL"> | ||||
|         <li><a href="#">Adele</a></li> | ||||
|         <li><a href="#">Agnes</a></li> | ||||
|  | ||||
|         <li><a href="#">Billy</a></li> | ||||
|         <li><a href="#">Bob</a></li> | ||||
|  | ||||
|         <li><a href="#">Calvin</a></li> | ||||
|         <li><a href="#">Christina</a></li> | ||||
|         <li><a href="#">Cindy</a></li> | ||||
|       </ul> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <style scoped> | ||||
| #main { | ||||
|   display: grid; | ||||
|   grid-template-columns: 22% auto; | ||||
|   grid-template-rows: 26% auto; | ||||
|   height: 100%; | ||||
|   width: 100%; | ||||
| } | ||||
|  | ||||
| #profilePicture { | ||||
|   display: flex; | ||||
|   justify-content: center; | ||||
| } | ||||
|  | ||||
| #profilePicture img { | ||||
|   align-self: center; | ||||
|   justify-self: center; | ||||
|   width: 60%; | ||||
| } | ||||
|  | ||||
| #researcherInfos { | ||||
|   display: grid; | ||||
|   grid-template-columns: auto auto auto; | ||||
|   column-gap: 5px; | ||||
|   grid-template-rows: auto auto; | ||||
| } | ||||
|  | ||||
| .surrounded { | ||||
|   border: 2px solid black; | ||||
|   color: white; | ||||
|   font-size: x-large; | ||||
|   align-self: center; | ||||
|   text-align: center; | ||||
|   background-color: rgba(255, 255, 255, 0.09); | ||||
|   border-radius: 20px; | ||||
|   margin-bottom: 10px; | ||||
| } | ||||
|  | ||||
| .surrounded select { | ||||
|   margin-top: 2px; | ||||
|   margin-bottom: 2px; | ||||
|   border: 1px solid black; | ||||
|   color: white; | ||||
|   background-color: rgb(255, 255, 255, 0.1); | ||||
|   font-size: large; | ||||
|   align-self: center; | ||||
|   text-align: center; | ||||
| } | ||||
|  | ||||
| #statsPie { | ||||
|  | ||||
| } | ||||
|  | ||||
| #articles { | ||||
|   background-color: orange; | ||||
| } | ||||
|  | ||||
| #search-input { | ||||
|   width: 60%; | ||||
|   font-size: 16px; | ||||
|   padding: 12px 20px 12px 40px; | ||||
|   border: 1px solid #ddd; | ||||
|   margin-bottom: 12px; | ||||
| } | ||||
|  | ||||
| #myUL { | ||||
|   list-style-type: none; | ||||
|   padding: 0; | ||||
|   margin: 0; | ||||
| } | ||||
|  | ||||
| #myUL li a { | ||||
|   border: 1px solid #ddd; | ||||
|   /* Add a border to all links */ | ||||
|   margin-top: -1px; | ||||
|   /* Prevent double borders */ | ||||
|   background-color: #f6f6f6; | ||||
|   /* Grey background color */ | ||||
|   padding: 12px; | ||||
|   /* Add some padding */ | ||||
|   text-decoration: none; | ||||
|   /* Remove default text underline */ | ||||
|   font-size: 18px; | ||||
|   /* Increase the font-size */ | ||||
|   color: black; | ||||
|   /* Add a black text color */ | ||||
|   display: block; | ||||
|   /* Make it into a block element to fill the whole list */ | ||||
| } | ||||
|  | ||||
| #myUL li a:hover:not(.header) { | ||||
|   background-color: #eee; | ||||
| } | ||||
|  | ||||
| #Chart{ | ||||
|     width: "100%"; | ||||
|     height: "100%"; | ||||
| } | ||||
| </style> | ||||
| @ -4,8 +4,5 @@ import 'https://kit.fontawesome.com/fb3bbd0a95.js' | ||||
|  | ||||
| import { createApp } from 'vue' | ||||
| import App from './App.vue' | ||||
| import CanvasJSChart from '@canvasjs/vue-charts'; | ||||
|  | ||||
| const app = createApp(App); | ||||
| app.use(CanvasJSChart); | ||||
| app.mount('#app'); | ||||
| createApp(App).mount('#app') | ||||
|  | ||||
| @ -9,16 +9,16 @@ import Profil from "@/Apps/Profil.vue" | ||||
| import Courses from "@/Apps/ManageCourses.vue" | ||||
| import Users from "@/Apps/UsersList.vue" | ||||
| import Students from "@/Apps/StudentsList.vue" | ||||
| import ResearcherProfile from "@/Apps/ScientificPublications/ResearcherProfile.vue"; | ||||
| import Schedule from "@/Apps/Schedule.vue" | ||||
|  | ||||
| const apps = { | ||||
| 		'/schedule': Schedule, | ||||
| 		'/login': LoginPage, | ||||
| 		'/inscription': Inscription, | ||||
| 		'/profil': Profil, | ||||
| 		'/manage-courses' : Courses, | ||||
| 		'/users-list' : Users, | ||||
| 		'/students-list' : Students, | ||||
| 		'/researcher-profile' : ResearcherProfile, | ||||
| } | ||||
|  | ||||
| const appsList = { | ||||
|  | ||||
		Reference in New Issue
	
	Block a user