diff --git a/demo-project.css b/demo-project.css
deleted file mode 100644
index bedef6c..0000000
--- a/demo-project.css
+++ /dev/null
@@ -1,80 +0,0 @@
-.ryz-project {
- border-spacing: 0px;
- border-collapse: separate;
- cursor: default;
- padding: 0px 0px 30px 0px;
- width: 100%;
-}
-
-.ryz-project .b {
- font-weight: bold;
-}
-.ryz-project .c {
- text-align: center;
-}
-.ryz-project .i {
- display: inline-block;
- width: 20px;
-}
-
-.ryz-project thead tr {
- font-weight: bold;
- font-size: 0.8em;
- user-select: none;
- height: 40px;
- text-align: center;
- vertical-align: bottom;
-}
-.ryz-project thead tr th {
- background-color: #E1E1E1;
- border-color: #B8B8B8;
- border-style: solid;
- border-width: 0px 0px 1px 1px;
- color: #3E7138;
- margin: 0px;
- padding: 6px 10px 5px 10px;
- min-width: 20px;
-}
-.ryz-project thead tr th:first-child {
- background-color: inherit;
- border-left-width: 0px;
-}
-.ryz-project thead tr th:last-child {
- border-right-width: 1px;
-}
-
-.ryz-project tbody tr td {
- border-color: #B8B8B8;
- border-style: solid;
- border-width: 0px 0px 1px 0px;
- margin: 0px;
- overflow: hidden;
- padding: 5px 5px 5px 5px;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-.ryz-project tbody tr td:first-child {
- border-right-width: 1px;
- color: #7E7E7E;
- font-size: 0.8em;
- text-align: center;
- user-select: none;
-}
-.ryz-project tbody tr td:last-child {
- border-right-width: 1px;
-}
-
-.ryz-project tbody tr:hover td:first-child {
- background-color: #D1F2C7;
- color: #3E7138;
- font-weight: bold;
-}
-
-
-
-
-.border {
- border-color: #B8B8B8;
- border-style: solid;
- border-width: 1px;
-}
\ No newline at end of file
diff --git a/demo-project.html b/demo-project.html
deleted file mode 100644
index c9eff55..0000000
--- a/demo-project.html
+++ /dev/null
@@ -1,178 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/package.json b/package.json
index daf304f..f761d19 100644
--- a/package.json
+++ b/package.json
@@ -1,11 +1,16 @@
{
"name": "LiteRyzJS",
- "version": "0.1.0.154",
+ "version": "0.1.0.301",
"devDependencies": {
+ "css-loader": "^7.1.2",
+ "sass": "^1.77.8",
+ "sass-loader": "^16.0.0",
+ "style-loader": "^4.0.0",
"webpack": "^5.93.0",
"webpack-cli": "^5.1.4"
},
"scripts": {
- "build": "webpack"
+ "build": "webpack",
+ "watch": "webpack --watch"
}
}
\ No newline at end of file
diff --git a/src/project.js b/src/project.js
deleted file mode 100644
index 1725430..0000000
--- a/src/project.js
+++ /dev/null
@@ -1,11 +0,0 @@
-// src/project.js
-import GanttChart from './project/gantt-chart.js';
-import Project from './project/project.js';
-import ProjectTaskGrid from './project/task-grid.js';
-
-
-export {
- GanttChart,
- Project,
- ProjectTaskGrid
-};
\ No newline at end of file
diff --git a/src/project/gantt-chart.js b/src/project/gantt-chart.js
deleted file mode 100644
index e43df7a..0000000
--- a/src/project/gantt-chart.js
+++ /dev/null
@@ -1,244 +0,0 @@
-import Canvas from '../graphics/canvas.js';
-
-
-class GanttChart {
- constructor(el, options) {
- const a = this;
-
- a.Canvas = new Canvas(el);
- a.Options = Object.assign(a.DefaultOptions, options);
-
- a.Debug = false;
- a.Project = null;
-
- a.StartDate = null;
- }
-
-
- get DefaultOptions() {
- return {
- DayWidth: 24,
- HeaderRow: {
- Height: [ 21, 21 ]
- },
- Row: {
- Height: 28,
- Task: {
- Height: 13,
- PaddingTop: 6,
- BorderColour: "#555555",
- FillColour: "#9CC2E6"
- },
- CollatedTask: {
- Height: 3,
- PaddingTop: 11,
- BorderColour: "#555555",
- FillColour: "#555555"
- }
- },
- Line: {
- Margin: 5,
- Colour: "#555555",
- Width: 1,
- ArrowSize: 5
- },
- DateFont: "7pt sans-serif",
- DateForeColour: "#636363",
- BorderWidth: 1,
- BorderColour: "#B8B8B8",
- BorderDashPattern: [1, 3],
- };
- }
-
- get HeaderHeight() {
- const a = this;
-
- return a.Options.HeaderRow.Height[0] + a.Options.HeaderRow.Height[1];
- }
-
- Invalidate() {
- const a = this;
-
- a.Canvas.Clear();
-
- if (a.Project == null) {
- return;
- }
-
- const tasks = a.Project.ExportTasks();
- const width = ((a.Project.Duration + 2) * a.Options.DayWidth);
- const height = (tasks.length * a.Options.Row.Height) + a.HeaderHeight;
-
- a.AutoSize = false;
- a.ClientWidth = width;
- a.ClientHeight = height;
-
- a.Canvas.Invalidate();
-
- a.drawChartLabel(a.Project);
- a.drawTasks(tasks);
- a.drawLines(tasks);
- }
-
- Load(project) {
- const a = this;
-
- a.Canvas.Clear();
-
- if (project == null) {
- return;
- }
-
- a.Project = project;
- a.StartDate = new Date(project.StartDate);
-
- a.Invalidate();
- }
-
- drawChartLabel(project) {
- const a = this;
-
- const width = a.Canvas.ClientWidth;
- const height = a.Canvas.ClientHeight;
- const displayDays = project.Duration + 2;
-
- let startDate = new Date(a.StartDate);
- startDate.addDays(-1);
-
- // Draw vertical lines
- for (let i=1; i {
- if (e.FinishDate == null) {
- return;
- }
-
- result = Date.max(result, e.FinishDate);
- });
-
- return result;
- }
-
- get Duration() {
- const a = this;
-
- return Date.diffDays(a.StartDate, a.FinishDate);
- }
-
-
- get newProject() {
- return {
- Name: "",
- Description: "",
- StartDate: Date.today(),
- Tag: null,
- StartOfWeek: 1, // Monday
- WorkHours: [0, 7.5, 7.5, 7.5, 7.5, 7.5, 0] // 0 = Sunday
- };
- }
-
- get newTaskNode() {
- return {
- Order: null,
- ID: null,
- Name: "",
- Description: "",
- Tag: null,
- StartDate: null, // new Date(),
- FinishDate: null, // new Date(),
- StartDelay: 0, // Days
- Duration: 1, // Days
- PredecessorTaskID: null,
- IsCollated: false,
- CollatedTaskID: null,
- CalcWorkHours: 0,
- ActuWorkHours: null,
- Progress: 0,
- Resources: [],
- Level: 0,
- PredecessorTaskNo: null,
- Tasks: []
- };
- }
-
-
- AddTask(task) {
- const a = this;
- const newTask = Object.assign(a.NewTask, task);
- const newTaskNode = Object.assign(a.newTaskNode, newTask);
-
- if ((newTaskNode.PredecessorTaskID == null) && (newTaskNode.CollatedTaskID == null)) {
- a.Tasks.push(newTaskNode);
- } else if (newTaskNode.PredecessorTaskID != null) {
- const node = a.FindTask(newTaskNode.PredecessorTaskID);
-
- if (node != null) {
- node.Tasks.push(newTaskNode);
- } else {
- a.log("Task not found (" + newTaskNode.PredecessorTaskID + ")");
- }
- } else if (newTaskNode.CollatedTaskID != null) {
- const node = a.FindTask(newTaskNode.CollatedTaskID);
-
- if (node != null) {
- node.Tasks.push(newTaskNode);
- } else {
- a.log("Task not found (" + newTaskNode.CollatedTaskID + ")");
- }
- } else {
- a.log("Task not found (" + newTaskNode.ID + ")");
- }
- }
-
- ClearTasks() {
- const a = this;
-
- a.Tasks = [];
- }
-
- ExportTasks() {
- const a = this;
-
- let result = a.Tasks.copy().flatten("Tasks");
- for (var i=0; i {
- if (e.FinishDate > node2FinishDate) {
- node2FinishDate = e.FinishDate;
- }
- });
-
- array[index].Progress = Math.average(node2.toList("Progress"));
- array[index].FinishDate = new Date(node2FinishDate);
- array[index].Duration = Date.diffDays(array[index].StartDate, array[index].FinishDate);
- }
-
-}
-
-
-export default Project;
\ No newline at end of file
diff --git a/src/project/task-grid.js b/src/project/task-grid.js
deleted file mode 100644
index 0283fd5..0000000
--- a/src/project/task-grid.js
+++ /dev/null
@@ -1,120 +0,0 @@
-class ProjectTaskGrid {
- constructor(el) {
- const a = this;
-
- a.Container = el;
-
- a.Columns = [
- null,
- null,
- "Task Name",
- "Duration",
- "Start",
- "Finish",
- "Predecessor",
- "Resource Names",
- null
- ];
-
- a.initialiseComponents();
- }
-
- initialiseComponents() {
- const a = this;
-
- let htmlContent = "";
- htmlContent += "";
- htmlContent += a.renderTHead();
- htmlContent += "";
- htmlContent += a.renderPlaceholder();
- htmlContent += "";
- htmlContent += "
";
-
- a.Container.innerHTML = htmlContent;
- }
-
-
- Render(model) {
- const a = this;
-
- let htmlContent = "";
- htmlContent += "";
- htmlContent += a.renderTHead();
- htmlContent += "";
-
- model.forEach(e => {
- htmlContent += a.renderRow(e);
- });
-
- htmlContent += "";
- htmlContent += "
";
-
- a.Container.innerHTML = htmlContent;
- }
-
-
- renderTHead() {
- const a = this;
-
- let htmlContent = "";
- htmlContent += "";
- htmlContent += "";
-
- a.Columns.forEach(e => {
- htmlContent += "" + (e ?? "") + " | ";
- });
-
- htmlContent += "
";
- htmlContent += "";
-
- return htmlContent;
- }
-
- renderPlaceholder() {
- const a = this;
-
- let htmlContent = "";
- htmlContent += "";
- htmlContent += " | ";
- htmlContent += "Loading... | ";
- htmlContent += "
";
-
- return htmlContent;
- }
-
- renderRow(e) {
- const a = this;
-
- let htmlContent = "";
-
- if (e.IsCollated == true) {
- htmlContent += "";
- } else {
- htmlContent += "
";
- }
-
- htmlContent += "" + e.Order + " | ";
- htmlContent += " | ";
- htmlContent += "";
-
- for (let i=0; i";
- }
-
- htmlContent += e.Name;
- htmlContent += " | ";
- htmlContent += "" + e.Duration + " day" + (parseInt(e.Duration) == 1 ? "" : "s") + " | ";
- htmlContent += "" + new Date(e.StartDate).toLocaleDateString() + " | ";
- htmlContent += "" + new Date(e.FinishDate).toLocaleDateString() + " | ";
- htmlContent += "" + (e.PredecessorTaskNo ?? "") + " | ";
- htmlContent += " | ";
- htmlContent += " | ";
- htmlContent += "
";
-
- return htmlContent;
- }
-
-}
-
-
-export default ProjectTaskGrid;
\ No newline at end of file
diff --git a/webpack.config.js b/webpack.config.js
index b372ac0..9d47beb 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -30,11 +30,10 @@ class PrependVersionPlugin {
module.exports = {
entry: {
extensions: './src/extensions.js',
- graphics: './src/graphics.js',
- project: './src/project.js'
+ graphics: './src/graphics.js'
},
output: {
- filename: `[name].min.js`,
+ filename: `[name].dist.js`,
path: path.resolve(__dirname, 'dist'),
library: 'LiteRyzJS',
libraryTarget: 'umd',
@@ -46,5 +45,17 @@ module.exports = {
'process.env.VERSION': JSON.stringify(version)
}),
new PrependVersionPlugin()
- ]
+ ],
+ module: {
+ rules: [
+ {
+ test: /\.scss$/,
+ use: [
+ 'style-loader',
+ 'css-loader',
+ 'sass-loader'
+ ]
+ }
+ ]
+ }
};
\ No newline at end of file