initial thingies
This commit is contained in:
silas
BIN
src/client/img/doge.png
Normal file
BIN
src/client/img/doge.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 204 KiB |
196
src/client/img/trashcan.svg
Normal file
196
src/client/img/trashcan.svg
Normal file
@@ -0,0 +1,196 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg"
|
||||
width="1.70667in" height="1.70667in"
|
||||
viewBox="0 0 512 512">
|
||||
<path id="Auswahl"
|
||||
stroke="black" stroke-width="1"
|
||||
d="M 3.00,32.00
|
||||
C 11.60,32.19 14.07,27.79 22.00,24.60
|
||||
22.00,24.60 38.00,19.25 38.00,19.25
|
||||
38.00,19.25 49.00,16.91 49.00,16.91
|
||||
49.00,16.91 57.00,14.46 57.00,14.46
|
||||
57.00,14.46 73.00,11.96 73.00,11.96
|
||||
73.00,11.96 85.00,9.42 85.00,9.42
|
||||
85.00,9.42 109.00,6.88 109.00,6.88
|
||||
109.00,6.88 117.00,5.12 117.00,5.12
|
||||
117.00,5.12 160.00,2.00 160.00,2.00
|
||||
160.00,2.00 180.00,0.00 180.00,0.00
|
||||
180.00,0.00 336.00,0.00 336.00,0.00
|
||||
343.97,0.12 340.87,1.94 350.00,2.00
|
||||
350.00,2.00 354.00,2.00 354.00,2.00
|
||||
354.00,2.00 397.83,5.24 397.83,5.24
|
||||
397.83,5.24 404.04,6.87 404.04,6.87
|
||||
404.04,6.87 432.00,10.04 432.00,10.04
|
||||
432.00,10.04 439.00,11.78 439.00,11.78
|
||||
439.00,11.78 457.91,14.95 457.91,14.95
|
||||
457.91,14.95 465.04,17.16 465.04,17.16
|
||||
465.04,17.16 489.91,24.45 489.91,24.45
|
||||
496.64,26.85 501.95,32.54 509.00,34.00
|
||||
509.00,34.00 504.17,82.00 504.17,82.00
|
||||
504.17,82.00 496.17,159.00 496.17,159.00
|
||||
496.17,159.00 472.83,386.00 472.83,386.00
|
||||
472.83,386.00 464.83,463.00 464.83,463.00
|
||||
464.83,463.00 462.00,489.00 462.00,489.00
|
||||
462.00,489.00 439.00,496.69 439.00,496.69
|
||||
412.57,501.93 370.65,507.69 344.00,508.00
|
||||
344.00,508.00 329.00,509.00 329.00,509.00
|
||||
329.00,509.00 290.00,510.00 290.00,510.00
|
||||
290.00,510.00 273.00,511.00 273.00,511.00
|
||||
273.00,511.00 210.00,511.00 210.00,511.00
|
||||
210.00,511.00 193.00,510.00 193.00,510.00
|
||||
193.00,510.00 172.00,510.00 172.00,510.00
|
||||
172.00,510.00 136.00,508.00 136.00,508.00
|
||||
136.00,508.00 110.00,505.00 110.00,505.00
|
||||
110.00,505.00 101.00,505.00 101.00,505.00
|
||||
101.00,505.00 69.00,499.29 69.00,499.29
|
||||
63.23,497.71 52.49,496.02 48.57,491.32
|
||||
46.64,489.00 46.97,484.98 46.58,482.00
|
||||
46.58,482.00 43.98,456.00 43.98,456.00
|
||||
43.98,456.00 40.17,418.00 40.17,418.00
|
||||
40.17,418.00 35.83,372.00 35.83,372.00
|
||||
35.83,372.00 13.83,148.00 13.83,148.00
|
||||
13.83,148.00 6.83,77.00 6.83,77.00
|
||||
6.83,77.00 3.00,32.00 3.00,32.00 Z
|
||||
M 113.00,78.00
|
||||
C 113.00,78.00 81.00,74.38 81.00,74.38
|
||||
81.00,74.38 72.00,72.12 72.00,72.12
|
||||
72.00,72.12 50.00,68.30 50.00,68.30
|
||||
50.00,68.30 29.00,62.19 29.00,62.19
|
||||
29.00,62.19 18.00,58.00 18.00,58.00
|
||||
18.00,58.00 19.83,76.00 19.83,76.00
|
||||
19.83,76.00 24.83,130.00 24.83,130.00
|
||||
24.83,130.00 40.83,302.00 40.83,302.00
|
||||
40.83,302.00 51.83,421.00 51.83,421.00
|
||||
51.83,421.00 57.00,475.00 57.00,475.00
|
||||
57.00,475.00 66.00,478.69 66.00,478.69
|
||||
66.00,478.69 73.00,479.46 73.00,479.46
|
||||
73.00,479.46 82.00,481.54 82.00,481.54
|
||||
82.00,481.54 95.00,483.43 95.00,483.43
|
||||
101.43,484.52 103.05,485.91 110.00,486.00
|
||||
123.92,486.17 117.37,487.13 124.09,488.71
|
||||
124.09,488.71 136.00,490.00 136.00,490.00
|
||||
136.00,490.00 135.00,474.00 135.00,474.00
|
||||
135.00,474.00 134.00,451.00 134.00,451.00
|
||||
134.00,451.00 133.00,437.00 133.00,437.00
|
||||
133.00,437.00 131.00,396.00 131.00,396.00
|
||||
131.00,396.00 130.00,382.00 130.00,382.00
|
||||
130.00,382.00 128.00,342.00 128.00,342.00
|
||||
128.00,342.00 127.04,332.00 127.04,332.00
|
||||
127.04,332.00 127.04,324.00 127.04,324.00
|
||||
127.04,324.00 126.00,305.00 126.00,305.00
|
||||
126.00,305.00 125.04,295.00 125.04,295.00
|
||||
125.04,295.00 125.04,287.00 125.04,287.00
|
||||
125.04,287.00 124.00,269.00 124.00,269.00
|
||||
124.00,269.00 123.00,255.00 123.00,255.00
|
||||
123.00,255.00 122.00,233.00 122.00,233.00
|
||||
122.00,233.00 121.00,218.00 121.00,218.00
|
||||
121.00,218.00 120.00,201.00 120.00,201.00
|
||||
120.00,201.00 119.00,179.00 119.00,179.00
|
||||
119.00,179.00 118.00,164.00 118.00,164.00
|
||||
118.00,164.00 116.00,123.00 116.00,123.00
|
||||
116.00,123.00 115.00,110.00 115.00,110.00
|
||||
115.00,110.00 113.00,78.00 113.00,78.00 Z
|
||||
M 493.00,58.00
|
||||
C 493.00,58.00 481.00,61.80 481.00,61.80
|
||||
481.00,61.80 473.00,64.83 473.00,64.83
|
||||
473.00,64.83 459.00,67.84 459.00,67.84
|
||||
459.00,67.84 450.00,70.54 450.00,70.54
|
||||
450.00,70.54 432.00,73.27 432.00,73.27
|
||||
432.00,73.27 413.00,76.72 413.00,76.72
|
||||
413.00,76.72 404.74,78.74 404.74,78.74
|
||||
404.74,78.74 403.00,88.00 403.00,88.00
|
||||
403.00,88.00 402.00,99.00 402.00,99.00
|
||||
402.00,99.00 402.00,108.00 402.00,108.00
|
||||
402.00,108.00 396.91,187.00 396.91,187.00
|
||||
396.91,187.00 390.91,281.00 390.91,281.00
|
||||
390.91,281.00 389.09,294.00 389.09,294.00
|
||||
389.09,294.00 384.00,372.00 384.00,372.00
|
||||
384.00,372.00 384.00,381.00 384.00,381.00
|
||||
384.00,381.00 380.09,436.00 380.09,436.00
|
||||
380.09,436.00 376.00,487.00 376.00,487.00
|
||||
376.00,487.00 385.00,486.00 385.00,486.00
|
||||
385.00,486.00 381.00,484.00 381.00,484.00
|
||||
391.63,484.48 402.51,484.61 413.00,482.34
|
||||
413.00,482.34 426.00,479.01 426.00,479.01
|
||||
437.40,476.56 438.80,477.78 451.00,473.00
|
||||
451.00,473.00 457.83,405.00 457.83,405.00
|
||||
457.83,405.00 465.17,328.00 465.17,328.00
|
||||
465.17,328.00 468.83,301.00 468.83,301.00
|
||||
468.83,301.00 480.17,184.00 480.17,184.00
|
||||
480.17,184.00 487.18,114.00 487.18,114.00
|
||||
487.18,114.00 488.82,106.00 488.82,106.00
|
||||
488.82,106.00 493.00,58.00 493.00,58.00 Z
|
||||
M 382.00,80.00
|
||||
C 382.00,80.00 345.00,83.00 345.00,83.00
|
||||
345.00,83.00 332.00,84.04 332.00,84.04
|
||||
332.00,84.04 317.00,84.04 317.00,84.04
|
||||
317.00,84.04 305.00,85.00 305.00,85.00
|
||||
305.00,85.00 268.00,85.00 268.00,85.00
|
||||
268.00,85.00 268.00,111.00 268.00,111.00
|
||||
268.00,111.00 267.00,128.00 267.00,128.00
|
||||
267.00,128.00 267.00,243.00 267.00,243.00
|
||||
267.00,243.00 266.00,258.00 266.00,258.00
|
||||
266.00,258.00 266.00,372.00 266.00,372.00
|
||||
266.00,372.00 265.00,387.00 265.00,387.00
|
||||
265.00,387.00 265.00,493.00 265.00,493.00
|
||||
265.00,493.00 304.00,492.00 304.00,492.00
|
||||
304.00,492.00 321.00,491.00 321.00,491.00
|
||||
321.00,491.00 342.00,490.09 342.00,490.09
|
||||
342.00,490.09 359.00,489.00 359.00,489.00
|
||||
359.00,489.00 361.00,448.00 361.00,448.00
|
||||
361.00,448.00 362.00,433.00 362.00,433.00
|
||||
362.00,433.00 363.00,415.00 363.00,415.00
|
||||
363.00,415.00 364.00,396.00 364.00,396.00
|
||||
364.00,396.00 365.00,375.00 365.00,375.00
|
||||
365.00,375.00 366.00,359.00 366.00,359.00
|
||||
366.00,359.00 367.00,335.00 367.00,335.00
|
||||
367.00,335.00 368.08,322.00 368.08,322.00
|
||||
368.08,322.00 368.08,313.00 368.08,313.00
|
||||
368.08,313.00 370.00,301.00 370.00,301.00
|
||||
370.00,301.00 370.00,292.00 370.00,292.00
|
||||
370.00,292.00 371.00,278.00 371.00,278.00
|
||||
371.00,278.00 372.00,258.00 372.00,258.00
|
||||
372.00,258.00 373.00,244.00 373.00,244.00
|
||||
373.00,244.00 375.00,202.00 375.00,202.00
|
||||
375.00,202.00 375.96,192.00 375.96,192.00
|
||||
375.96,192.00 375.96,184.00 375.96,184.00
|
||||
375.96,184.00 377.00,165.00 377.00,165.00
|
||||
377.00,165.00 378.00,147.00 378.00,147.00
|
||||
378.00,147.00 379.00,131.00 379.00,131.00
|
||||
379.00,131.00 380.00,115.00 380.00,115.00
|
||||
380.00,115.00 381.00,93.00 381.00,93.00
|
||||
381.00,93.00 382.00,80.00 382.00,80.00 Z
|
||||
M 247.00,85.00
|
||||
C 247.00,85.00 208.00,85.00 208.00,85.00
|
||||
208.00,85.00 196.00,84.04 196.00,84.04
|
||||
196.00,84.04 183.00,84.04 183.00,84.04
|
||||
183.00,84.04 167.00,83.00 167.00,83.00
|
||||
167.00,83.00 134.00,81.00 134.00,81.00
|
||||
134.00,81.00 135.00,93.00 135.00,93.00
|
||||
135.00,93.00 136.00,121.00 136.00,121.00
|
||||
136.00,121.00 137.00,138.00 137.00,138.00
|
||||
137.00,138.00 138.00,165.00 138.00,165.00
|
||||
138.00,165.00 139.04,179.00 139.04,179.00
|
||||
139.04,179.00 139.04,190.00 139.04,190.00
|
||||
139.04,190.00 140.00,202.00 140.00,202.00
|
||||
140.00,202.00 141.00,223.00 141.00,223.00
|
||||
141.00,223.00 142.00,252.00 142.00,252.00
|
||||
142.00,252.00 143.00,267.00 143.00,267.00
|
||||
143.00,267.00 144.00,287.00 144.00,287.00
|
||||
144.00,287.00 145.00,316.00 145.00,316.00
|
||||
145.00,316.00 146.00,331.00 146.00,331.00
|
||||
146.00,331.00 148.00,380.00 148.00,380.00
|
||||
148.00,380.00 149.00,394.00 149.00,394.00
|
||||
149.00,394.00 150.00,422.00 150.00,422.00
|
||||
150.00,422.00 151.00,439.00 151.00,439.00
|
||||
151.00,439.00 152.00,459.00 152.00,459.00
|
||||
152.00,459.00 153.00,491.00 153.00,491.00
|
||||
153.00,491.00 173.00,492.00 173.00,492.00
|
||||
173.00,492.00 195.00,492.00 195.00,492.00
|
||||
195.00,492.00 211.00,493.00 211.00,493.00
|
||||
211.00,493.00 247.00,493.00 247.00,493.00
|
||||
247.00,493.00 247.00,85.00 247.00,85.00 Z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 9.9 KiB |
74
src/client/index.html
Normal file
74
src/client/index.html
Normal file
@@ -0,0 +1,74 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge"/>
|
||||
<title>Prayercircle</title>
|
||||
</head>
|
||||
<body class="starting-page">
|
||||
<div class="container">
|
||||
<header class="header">
|
||||
<div class="logo-container">
|
||||
<!-- <img src="img/doge.png" alt="doge logo" class="logo-img"/>-->
|
||||
<h1 class="logo-text">
|
||||
<span class="logo-highlight">Prayer</span>Circle
|
||||
</h1>
|
||||
</div>
|
||||
</header>
|
||||
<section id="list-section">
|
||||
<button id="add-button">+</button>
|
||||
<div id="list-container">
|
||||
<div id="input-template"><input class="name" placeholder="Name">
|
||||
<button class="delete-button"></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="table-section">
|
||||
<div id = "week-selection">
|
||||
<button id = "previous-week"><</button>
|
||||
<span id = "week-input"></span>
|
||||
<button id = "next-week">></button>
|
||||
</div>
|
||||
<div id="table-container">
|
||||
<table id="table-template" class="prayer-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="name"></th>
|
||||
<th>Mo</th>
|
||||
<th>Di</th>
|
||||
<th>Mi</th>
|
||||
<th>Do</th>
|
||||
<th>Fr</th>
|
||||
<th>Sa</th>
|
||||
<th>So</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Ich bete für:</td>
|
||||
<td class="for-0"></td>
|
||||
<td class="for-1"></td>
|
||||
<td class="for-2"></td>
|
||||
<td class="for-3"></td>
|
||||
<td class="for-4"></td>
|
||||
<td class="for-5"></td>
|
||||
<td class="for-6"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Für mich betet:</td>
|
||||
<td class="by-0"></td>
|
||||
<td class="by-1"></td>
|
||||
<td class="by-2"></td>
|
||||
<td class="by-3"></td>
|
||||
<td class="by-4"></td>
|
||||
<td class="by-5"></td>
|
||||
<td class="by-6"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
138
src/client/js/CircleManager.js
Normal file
138
src/client/js/CircleManager.js
Normal file
@@ -0,0 +1,138 @@
|
||||
import {ViewHelper} from "js-helper/dist/client/ViewHelper";
|
||||
import {Helper} from "js-helper/dist/shared/Helper";
|
||||
|
||||
export class CircleManager {
|
||||
|
||||
constructor(listSection, tableSection) {
|
||||
this._members = [];
|
||||
this._week = 0;
|
||||
|
||||
this._inputTemplate = listSection.querySelector("#input-template");
|
||||
this._inputTemplate.remove();
|
||||
this._inputTemplate.removeAttribute("id");
|
||||
this._listContainer = listSection.querySelector("#list-container");
|
||||
listSection.querySelector("#add-button").addEventListener("click", () => this.addMember());
|
||||
|
||||
this._tableTemplate = tableSection.querySelector("#table-template");
|
||||
this._tableTemplate.remove();
|
||||
this._tableTemplate.removeAttribute("id");
|
||||
this._tableContainer = tableSection.querySelector("#table-container");
|
||||
|
||||
this._weekInput = tableSection.querySelector("#week-input");
|
||||
tableSection.querySelector("#next-week").addEventListener("click", () => this.setWeek(this._week + 1));
|
||||
tableSection.querySelector("#previous-week").addEventListener("click", () => this.setWeek(this._week - 1));
|
||||
|
||||
this.load();
|
||||
this.setWeek(this._week);
|
||||
}
|
||||
|
||||
setWeek(newWeek) {
|
||||
newWeek = parseInt(newWeek);
|
||||
if (!isNaN(newWeek)) {
|
||||
newWeek = Math.max(newWeek, 0);
|
||||
this._week = newWeek;
|
||||
this._weekInput.innerText = (this._week + 1);
|
||||
this.updateTables();
|
||||
this.save();
|
||||
}
|
||||
}
|
||||
|
||||
save(){
|
||||
console.log("saving...");
|
||||
localStorage.setItem("list", JSON.stringify({"week": this._week, "members": this._members}));
|
||||
}
|
||||
|
||||
load(){
|
||||
const jsonSavedata = localStorage.getItem("list");
|
||||
console.log("liste", jsonSavedata);
|
||||
if (jsonSavedata){
|
||||
const data = JSON.parse(jsonSavedata);
|
||||
this._week = data.week;
|
||||
this._members = data.members;
|
||||
this.updateList();
|
||||
this.updateTables();
|
||||
}
|
||||
}
|
||||
|
||||
updateList() {
|
||||
ViewHelper.removeAllChildren(this._listContainer);
|
||||
this._members.forEach((member, id) => {
|
||||
const memberElement = this._inputTemplate.cloneNode(true);
|
||||
memberElement.querySelector(".delete-button").addEventListener("click", () => this.deleteMember(id))
|
||||
|
||||
const inputElem =
|
||||
memberElement.querySelector(".name");
|
||||
inputElem.value = member;
|
||||
inputElem.addEventListener("input", () => {
|
||||
this._members[id] = inputElem.value;
|
||||
this.updateTables();
|
||||
this.save();
|
||||
});
|
||||
this._listContainer.appendChild(memberElement);
|
||||
})
|
||||
}
|
||||
|
||||
deleteMember(index) {
|
||||
if (index >= 0 && index < this._members.length) {
|
||||
this._members.splice(index, 1);
|
||||
this.updateList();
|
||||
this.updateTables();
|
||||
this.save();
|
||||
}
|
||||
}
|
||||
|
||||
addMember(name) {
|
||||
name = Helper.nonNull(name, "");
|
||||
this._members.push(name);
|
||||
this.updateList();
|
||||
this.updateTables();
|
||||
this.save();
|
||||
}
|
||||
|
||||
updateTables() {
|
||||
if (this._members.length < 2) {
|
||||
return;
|
||||
}
|
||||
const tables = {};
|
||||
this._members.forEach((member, index) => {
|
||||
const listPrayers = [];
|
||||
const listPrayedBy = [];
|
||||
|
||||
const otherMembers = this._members.filter((v, i) => i !== index);
|
||||
|
||||
let prayersIndex = index - 1;
|
||||
let prayedIndex = index;
|
||||
|
||||
const weekOffset = this._week * 7;
|
||||
prayersIndex += weekOffset;
|
||||
prayedIndex -= weekOffset;
|
||||
if (prayedIndex < 0) {
|
||||
prayedIndex += otherMembers.length * Math.floor(weekOffset / otherMembers.length);
|
||||
}
|
||||
|
||||
for (let i = 0; i < 7; i++) {
|
||||
prayersIndex = (prayersIndex + 1) % otherMembers.length
|
||||
prayedIndex = (prayedIndex - 1 + otherMembers.length) % otherMembers.length;
|
||||
|
||||
listPrayers.push(otherMembers[prayersIndex]);
|
||||
listPrayedBy.push(otherMembers[prayedIndex]);
|
||||
}
|
||||
|
||||
tables[index] = {"for": listPrayers, "by": listPrayedBy}
|
||||
});
|
||||
|
||||
ViewHelper.removeAllChildren(this._tableContainer);
|
||||
Object.keys(tables).forEach(memberIndex => {
|
||||
const tableElement = this._tableTemplate.cloneNode(true);
|
||||
tableElement.querySelector(".name").innerText = this._members[memberIndex];
|
||||
tables[memberIndex].for.forEach((otherMember, index) => {
|
||||
tableElement.querySelector(".for-" + index).innerText = otherMember;
|
||||
});
|
||||
tables[memberIndex].by.forEach((otherMember, index) => {
|
||||
tableElement.querySelector(".by-" + index).innerText = otherMember;
|
||||
});
|
||||
|
||||
this._tableContainer.appendChild(tableElement);
|
||||
});
|
||||
}
|
||||
}
|
||||
7
src/client/js/index.js
Normal file
7
src/client/js/index.js
Normal file
@@ -0,0 +1,7 @@
|
||||
import "../sass/index.scss"
|
||||
import {CircleManager} from "./CircleManager";
|
||||
|
||||
const listSegment = document.getElementById("list-section");
|
||||
const tableSegment = document.getElementById("table-section");
|
||||
|
||||
new CircleManager(listSegment, tableSegment);
|
||||
119
src/client/sass/index.scss
Normal file
119
src/client/sass/index.scss
Normal file
@@ -0,0 +1,119 @@
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "Montserrat", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
background-color: #f9fafc;
|
||||
color: #595354;
|
||||
}
|
||||
|
||||
#video-section {
|
||||
position: relative;
|
||||
|
||||
.site-control {
|
||||
font-size: 3rem;
|
||||
padding: 0.2rem;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(0%, -50%);
|
||||
|
||||
&.previous {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
&.next {
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
background-color: #ffffff;
|
||||
padding: 10px 40px;
|
||||
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.header > .logo-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header > .logo-container > .logo-img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.header > .logo-container > .logo-text {
|
||||
font-size: 26px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.header > .logo-container > .logo-text > .logo-highlight {
|
||||
color: #65a9e5;
|
||||
}
|
||||
|
||||
#list-section{
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
button {
|
||||
background: white;
|
||||
padding: 0 0.3rem;
|
||||
font-size: 1.5rem;
|
||||
border: solid 1px black;
|
||||
|
||||
&.delete-button {
|
||||
background: url("../img/trashcan.svg");
|
||||
background-size: contain;
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
outline: none;
|
||||
font-size: 1.5rem;
|
||||
|
||||
&:placeholder-shown, &:focus {
|
||||
border-bottom: solid 1px black;
|
||||
}
|
||||
}
|
||||
|
||||
#week-input{
|
||||
width: 3rem;
|
||||
text-align: center;
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#table-section {
|
||||
margin-top: 2rem;
|
||||
|
||||
#week-selection{
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
#table-container {
|
||||
.prayer-table {
|
||||
max-width: calc(100% - 2rem);
|
||||
margin: 1rem;
|
||||
border: solid 1px #adadad;
|
||||
border-collapse: collapse;
|
||||
|
||||
td, th {
|
||||
padding: 0.2rem;
|
||||
width: 12.5%;
|
||||
border: solid 1px #adadad;
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
40
src/server/Server.ts
Normal file
40
src/server/Server.ts
Normal file
@@ -0,0 +1,40 @@
|
||||
import * as express from "express";
|
||||
import {createServer, Server as HTTPServer} from "http";
|
||||
import * as path from "path";
|
||||
|
||||
export class Server {
|
||||
private httpServer: HTTPServer;
|
||||
private app: express.Application;
|
||||
|
||||
private activeSockets: string[] = [];
|
||||
|
||||
private readonly DEFAULT_PORT = 5000;
|
||||
|
||||
constructor() {
|
||||
this.initialize();
|
||||
}
|
||||
|
||||
private initialize(): void {
|
||||
this.app = express();
|
||||
this.httpServer = createServer(this.app);
|
||||
|
||||
this.configureApp();
|
||||
this.configureRoutes();
|
||||
}
|
||||
|
||||
private configureApp(): void {
|
||||
this.app.use(express.static(path.join(__dirname, "../../dist")));
|
||||
}
|
||||
|
||||
private configureRoutes(): void {
|
||||
this.app.get("/", (req, res) => {
|
||||
res.sendFile("index.html");
|
||||
});
|
||||
}
|
||||
|
||||
public listen(callback: (port: number) => void): void {
|
||||
this.httpServer.listen(this.DEFAULT_PORT, () => {
|
||||
callback(this.DEFAULT_PORT);
|
||||
});
|
||||
}
|
||||
}
|
||||
99
src/server/TailStream.ts
Normal file
99
src/server/TailStream.ts
Normal file
@@ -0,0 +1,99 @@
|
||||
import * as stream from "stream";
|
||||
import * as fs from "fs";
|
||||
|
||||
export class TailStream extends stream.Readable {
|
||||
private filepath: string;
|
||||
private fd;
|
||||
private bytesRead: number = 0;
|
||||
private dataAvailable: boolean;
|
||||
private watcher;
|
||||
private renamed: boolean = false;
|
||||
|
||||
constructor(filepath: string, opts?) {
|
||||
super(opts);
|
||||
this.filepath = filepath;
|
||||
|
||||
this.init();
|
||||
this.initWatcher();
|
||||
}
|
||||
|
||||
private init() {
|
||||
fs.open(this.filepath, 'r', (err, fd) => {
|
||||
if (err) {
|
||||
console.error(err);
|
||||
} else {
|
||||
|
||||
this.fd = fd;
|
||||
this.dataAvailable = true;
|
||||
this._read();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
_read() {
|
||||
if (!this.dataAvailable || typeof this.fd !== "number") {
|
||||
return this.push('');
|
||||
}
|
||||
|
||||
const buffer = Buffer.alloc(16 * 1024);
|
||||
fs.read(this.fd, buffer, 0, buffer.length, this.bytesRead, (err, bytesRead) => {
|
||||
if (err) {
|
||||
console.error(err);
|
||||
this.end();
|
||||
return;
|
||||
}
|
||||
if (bytesRead === 0) {
|
||||
if (this.renamed) {
|
||||
this.end();
|
||||
}
|
||||
else {
|
||||
this.dataAvailable = false;
|
||||
this.push('');
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (!this.destroyed) {
|
||||
this.bytesRead += bytesRead;
|
||||
this.push(buffer.slice(0, bytesRead));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private initWatcher() {
|
||||
this.watcher = fs.watch(this.filepath, (event, filename) => {
|
||||
if (event === "change" && !this.dataAvailable) {
|
||||
this.dataAvailable = true;
|
||||
this.read(0);
|
||||
} else if (event === "rename") {
|
||||
if (this.filepath.endsWith(".tmp") && false) {
|
||||
this.dataAvailable = false;
|
||||
this.filepath = this.filepath.substring(0, this.filepath.length - 4);
|
||||
this.renamed = true;
|
||||
this.watcher.close();
|
||||
if (this.fd) {
|
||||
fs.close(this.fd, () => {
|
||||
});
|
||||
}
|
||||
|
||||
this.init();
|
||||
this.initWatcher();
|
||||
} else {
|
||||
this.end();
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
private end() {
|
||||
this.dataAvailable = false;
|
||||
if (this.fd) {
|
||||
fs.close(this.fd, () => {
|
||||
});
|
||||
}
|
||||
this.push(null);
|
||||
if (this.watcher) {
|
||||
this.watcher.close();
|
||||
}
|
||||
this.destroy();
|
||||
}
|
||||
}
|
||||
8
src/server/index.ts
Normal file
8
src/server/index.ts
Normal file
@@ -0,0 +1,8 @@
|
||||
import { Server } from "./Server";
|
||||
|
||||
// const server = new DashServer();
|
||||
const server = new Server();
|
||||
|
||||
server.listen(port => {
|
||||
console.log(`Server is listening on http://localhost:${port}`);
|
||||
});
|
||||
Reference in New Issue
Block a user