Add initial implementation of Simple Gantt chart and sample names list

- Created index.html for the Gantt chart with sample tasks and configurations.
- Added styles for the Gantt chart and linked necessary CSS and JS files.
- Introduced a names.txt file containing a list of names for potential use in the application.

libraries/Simple-Gant-master/LICENSE

@@ -0,0 +1,23 @@
+MIT License
+
+Copyright (c) 2022 Malek mliki 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+#Only a credit or metion would be nice but no obligation 

libraries/Simple-Gant-master/frappe-gantt.css

@@ -0,0 +1,348 @@
+.add-task input[type="submit"] {
+  color: white;
+  width: 80px;
+  margin-top: 4px;
+  background-color: #27ae60;
+  padding: 4px;
+  border: none;
+  cursor: pointer;
+  align-self: flex-end;
+}
+
+.add-task input[type="reset"] {
+  color: white;
+  width: 80px;
+  margin-top: 4px;
+  background-color: #e74c3c;
+  padding: 4px;
+  border: none;
+  cursor: pointer;
+  align-self: flex-end;
+}
+
+.add-task input[type="submit"]:hover {
+  background-color: #27ae60b0;
+}
+
+.add-task input[type="reset"]:hover {
+  background-color: #e74c3cb8;
+}
+
+.circle {
+  fill: #14283c;
+}
+
+.text-circle {
+  fill: #a3bbad;
+  font-weight: 600;
+}
+
+.tools {
+  text-align: right;
+
+}
+
+.input1 {
+  background-color: rgba(0, 0, 0, 0.8);
+  border: 0;
+  width: 70%;
+  color: #959da5;
+}
+
+.input2 {
+  background-color: rgba(0, 0, 0, 0.8);
+  border: 0;
+  width: 100%;
+  margin-bottom: 4px;
+  color: #959da5;
+
+}
+
+.tools svg,
+.subtitle svg {
+  float: right;
+  display: block;
+  padding: 4px;
+  cursor: pointer;
+  fill: white;
+  padding: 8px;
+  font-weight: bold;
+  width: 20px;
+  height: 20px;
+
+}
+
+.tools svg:hover,
+.subtitle svg:hover {
+  fill: #e74c3c;
+}
+
+.tools svg path {
+  font-weight: 900;
+}
+
+.contextmenu {
+  position: absolute;
+  width: 100px;
+  height: auto;
+  background: rgba(0, 0, 0, 0.1);
+  padding: 0;
+  color: black;
+  border-radius: 3px;
+  cursor: pointer;
+  display: block;
+
+}
+
+.disabled {
+  pointer-events: none;
+  color: #a9b5c1;
+}
+
+.wrong {
+  border: 1px solid red;
+}
+
+.add-task {
+  position: absolute;
+  width: 200px;
+  padding: 4px;
+  background-color: rgba(0, 0, 0, 0.2);
+  display: none;
+
+}
+
+.add-task form {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 2px;
+}
+
+
+.contextmenu span {
+  padding: 8px;
+  display: block;
+  font-weight: 600;
+}
+
+
+
+.contextmenu span:hover {
+  background: rgba(0, 0, 0, 0.2);
+
+}
+
+
+.triangle {
+  opacity: 0.6;
+  cursor: pointer;
+}
+
+.triangle:hover {
+  opacity: 1;
+}
+
+.gantt .red {
+  fill: #e74c3c;
+}
+
+.gantt .orange {
+  fill: #FF6B30;
+}
+
+.gantt .yellow {
+  fill: #FFD300;
+}
+
+.gantt .green {
+  fill: #27ae60;
+}
+
+.outline {
+  outline: 2px solid #333;
+}
+
+.noopacity {
+  display: none;
+}
+
+.opacity {
+  display: block;
+}
+
+.gantt .grid-background {
+  fill: none;
+}
+
+.gantt .grid-header {
+  fill: #ffffff;
+  stroke: #e0e0e0;
+  stroke-width: 1.4;
+}
+
+.gantt .grid-row {
+  fill: #ffffff;
+}
+
+.gantt .grid-row:nth-child(even) {
+  fill: #f5f5f5;
+}
+
+.gantt .row-line {
+  stroke: #ebeff2;
+}
+
+.gantt .tick {
+  stroke: #e0e0e0;
+  stroke-width: 0.2;
+}
+
+.gantt .tick.thick {
+  stroke-width: 0.4;
+}
+
+.gantt .today-highlight {
+  fill: #61b75e;
+  opacity: 0.5;
+}
+
+.gantt .arrow {
+  fill: none;
+  stroke: #666;
+  stroke-width: 1.4;
+}
+
+.gantt .bar {
+  fill: #b8c2cc;
+  stroke: #8D99A6;
+  stroke-width: 0;
+  transition: stroke-width .3s ease;
+  user-select: none;
+}
+
+.gantt .bar.gantt-task-backlog {
+  fill: #640808;
+}
+
+.gantt .bar-wrapper:hover .bar.gantt-task-backlog {
+  fill: #640808;
+}
+
+.gantt .bar-progress {
+  fill: #a71e1e;
+}
+
+.gantt .bar-invalid {
+  fill: transparent;
+  stroke: #8D99A6;
+  stroke-width: 1;
+  stroke-dasharray: 5;
+}
+
+.gantt .bar-invalid~.bar-label {
+  fill: #555;
+}
+
+.gantt .bar-label {
+  fill: #fff;
+  dominant-baseline: central;
+  text-anchor: middle;
+  font-size: 12px;
+  font-weight: lighter;
+}
+
+.gantt .bar-label.big {
+  fill: #555;
+  text-anchor: start;
+}
+
+.gantt .handle {
+  fill: #ddd;
+  cursor: ew-resize;
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity .3s ease;
+}
+
+.gantt .bar-wrapper {
+  cursor: pointer;
+  outline: none;
+}
+
+.gantt .bar-wrapper:hover .bar {
+  fill: #a9b5c1;
+}
+
+.gantt .bar-wrapper:hover .bar-progress {
+  fill: #8a8aff;
+}
+
+.gantt .bar-wrapper:hover .handle {
+  visibility: visible;
+  opacity: 1;
+}
+
+.gantt .bar-wrapper.active .bar {
+  fill: #a9b5c1;
+}
+
+.gantt .bar-wrapper.active .bar-progress {
+  fill: #8a8aff;
+}
+
+.gantt .lower-text,
+.gantt .upper-text {
+  font-size: 12px;
+  text-anchor: middle;
+}
+
+.gantt .upper-text {
+  fill: #555;
+}
+
+.gantt .lower-text {
+  fill: #333;
+}
+
+.gantt .hide {
+  display: none;
+}
+
+.gantt-container {
+  position: relative;
+  overflow: auto;
+  font-size: 12px;
+}
+
+.gantt-container .popup-wrapper {
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: rgba(0, 0, 0, 0.8);
+  padding: 0;
+  color: #959da5;
+  border-radius: 3px;
+}
+
+.gantt-container .popup-wrapper .title {
+  border-bottom: 3px solid #a3a3ff;
+  padding: 10px;
+}
+
+.gantt-container .popup-wrapper .subtitle {
+  padding: 10px;
+  color: #dfe2e5;
+}
+
+.gantt-container .popup-wrapper .pointer {
+  position: absolute;
+  height: 5px;
+  margin: 0 0 0 -5px;
+  border: 5px solid transparent;
+  border-top-color: rgba(0, 0, 0, 0.8);
+}
+
+.upper-date-separator {
+  stroke: #ccc;
+  stroke-width: 1;
+}

libraries/Simple-Gant-master/index.html

@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<title>Simple Gantt</title>
+	<style>
+		body {
+			font-family: sans-serif;
+			background: #ccc;
+		}
+		.container {
+			width: 80%;
+			margin: 0 auto;
+		}
+		/* custom class */
+		.gantt .bar-milestone .bar {
+			fill: tomato;
+		}
+	</style>
+	<link rel="stylesheet" href="frappe-gantt.css" />
+	<script src="frappe-gantt.js"></script>
+</head>
+<body>
+	<div class="container">
+		<h2>Interactive Gantt </h2>
+		<div class="gantt-target"></div>
+	</div>
+	<script>
+		var tasks = [
+			{
+				start: '2018-10-01',
+				end: '2018-10-08',
+				name: 'Redesign website',
+				id: "Task 0",
+				progress: 91
+			},
+			{
+				start: '2018-10-03',
+				end: '2018-10-06',
+				name: 'Write new content',
+				id: "Task 1",
+				progress: 55,
+				dependencies: 'Task 0'
+			},
+			{
+				start: '2018-10-04',
+				end: '2018-10-08',
+				name: 'Apply new styles',
+				id: "Task 2",
+				progress: 40,
+				dependencies: 'Task 1'
+			},
+			{
+				start: '2018-10-08',
+				end: '2018-10-09',
+				name: 'Review',
+				id: "Task 3",
+				progress: 20,
+				dependencies: 'Task 2'
+			},
+			{
+				start: '2018-10-08',
+				end: '2018-10-10',
+				name: 'Deploy',
+				id: "Task 4",
+				progress: 50,
+				dependencies: 'Task 2'
+			},
+			{
+				start: '2018-10-11',
+				end: '2018-10-11',
+				name: 'Go Live!',
+				id: "Task 5",
+				progress: 10,
+				dependencies: 'Task 4',
+				custom_class: 'bar-milestone'
+			},
+			// {
+			// 	start: '2014-01-05',
+			// 	end: '2019-10-12',
+			// 	name: 'Long term task',
+			// 	id: "Task 6",
+			// 	progress: 0
+			// }
+		]
+		var gantt_chart = new Gantt(".gantt-target", tasks, {
+			on_click: function (task) {
+				console.log(task);
+			},
+			on_date_change: function(task, start, end) {
+				console.log(task, start, end);
+			},
+			on_progress_change: function(task, progress) {
+				console.log(task, progress);
+			},
+			on_view_change: function(mode) {
+				console.log(mode);
+			},
+			view_mode: 'Week',
+			language: 'en'
+		});
+		console.log(gantt_chart);
+	</script>
+</body>
+</html>

libraries/Simple-Gant-master/names.txt

@@ -0,0 +1,20 @@
+"Bernadette Young",
+"Robert Davis",
+"Elena Reyes",
+"Evelyn Goodrich",
+"Remi Hakimi",
+"Asmara Tewolde",
+"Cristina Schwarzer",
+"Anna Grimsdottir",
+"Thomas Zotov",
+"Arthur Maclean",
+"Mauricio Mirella",
+"Anthony Foccacia",
+"Mark Waugh",
+"Urbain Leverrier",
+"John Adams",
+"Chris Davis", 
+"Rania Ali",
+"Spiro Agnew",
+"Diana Frost",
+"David Nixon",

libraries/functions.js

@@ -13,7 +13,7 @@ $( document ).ready(function()
   $( 'input.datetime' ).datetimepicker({
     language: 'pl',
     autoClose: true,
-    disabledDates: false,
+    disabledDates: [],
     pickTime: false,
     format: 'YYYY-MM-DD',
   });