david/code-editor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed some bugs, dark/white mode fix and sessionid in url

Browse Source
This commit is contained in:
David Meincke
2023-05-30 11:39:21 +02:00
parent e0c998cfac
commit 28631e8251
10 changed files with 5339 additions and 3554 deletions
Download Patch File Download Diff File Expand all files Collapse all files
codeeditor-app/boot.ts
+1 -1
View File
@@ -41,7 +41,7 @@ if (isSessionPage()) {
var sessionMenuItem = <HTMLElement>document.querySelector("window-control-connector[target='.menu-container']");
if (menuEle) {
menuEle.style.display = "block";
sessionMenuItem.style.display = "inline";
sessionMenuItem.style.display = "inline-block";
containers.style.display = "none";
outputframe.style.display = "none";
}
codeeditor-app/elements/session-list-item/session-list-item.less
+27 -3
View File
@@ -1,20 +1,32 @@
@import url('../../../shared/theme.less');
session-list-item {
color: white;
color: @primary-text-color-white;
padding: 10px;
display: block;
position: relative;
border-bottom: 1px solid grey;
border-bottom: 1px solid;
border-color: @primary-bg-color-white;
cursor: pointer;
}
session-list-item.selected {
background-color: #1e1e1e;
background-color: lighten(@primary-interaction-highlight-white, 30%);
}
.session-list-item-session-id::before {
content: "Session: ";
}
.session-list-item-timestamp::before {
content: "Created: ";
}
.session-list-item-timestamp {
font-size: 12px;
opacity: 0.9;
}
.session-list-item-session-id {
display: block;
white-space: nowrap;
@@ -24,6 +36,7 @@ session-list-item.selected {
.session-list-item-number-of-changes {
font-size: 12px;
opacity: 0.6;
}
.session-list-item-number-of-changes::before {
@@ -31,3 +44,14 @@ session-list-item.selected {
position: relative;
z-index: 0;
}
@media (prefers-color-scheme: dark) {
session-list-item {
border-color: @primary-bg-color-dark;
color: @primary-text-color-dark;
}
session-list-item.selected {
background-color: @primary-interaction-highlight-dark;
}
}
codeeditor-app/elements/session-list-item/session-list-item.ts
+22 -1
View File
@@ -2,6 +2,9 @@ import { BaseElement } from '../../../shared/_base';
import { CodeEditorContainer } from '../code-editor-container/code-editor-container';
import './session-list-item.less';
import * as sessionApi from '../../../shared/session-api';
import { formatDate } from '../../../shared/date-helper';
import { navigateTo } from '../../../shared/navigation';
import { getSessionDetailsId } from '../../../shared/page';
export class SessionListItem extends BaseElement {
onInit(): void {
@@ -12,6 +15,13 @@ export class SessionListItem extends BaseElement {
this.appendChild(sessionIdEle);
}
if (this.hasAttribute("timestamp")) {
var timestampEle = document.createElement("div");
timestampEle.classList.add("session-list-item-timestamp");
timestampEle.innerHTML = formatDate(this.getAttribute("timestamp")?.toString() ?? "");
this.appendChild(timestampEle);
}
if (this.hasAttribute("numberOfChanges")) {
var numberOfChangesEle = document.createElement("div");
numberOfChangesEle.classList.add("session-list-item-number-of-changes");
@@ -22,6 +32,10 @@ export class SessionListItem extends BaseElement {
this.addEventListener("click", (evt) => {
this.itemClicked();
});
if (this.isUrlSelected()) {
this.itemClicked();
}
}
private intervalHandle: number | null = null;
@@ -34,11 +48,17 @@ export class SessionListItem extends BaseElement {
}
}
isUrlSelected(): boolean {
var selectedId = getSessionDetailsId();
return selectedId === this.getAttribute("sessionId")?.toString()?? "";
}
startUpdate() {
this.stopUpdate();
this.classList.add("selected");
this.updateInputs();
this.intervalHandle = window.setInterval(this.updateInputs.bind(this), 1000);
}
@@ -86,6 +106,8 @@ export class SessionListItem extends BaseElement {
containers.style.display = "block";
outputframe.style.display = "block";
navigateTo("/sessions/" + this.getAttribute("sessionId")?.toString()?? "");
var children = this.parentElement?.children;
if (children) {
@@ -101,7 +123,6 @@ export class SessionListItem extends BaseElement {
}
}
else {
console.log("WOULD STOP!");
this.stopUpdate();
}
}
codeeditor-app/elements/session-list/session-list.ts
+1 -2
View File
@@ -23,8 +23,6 @@ export class SessionList extends BaseElement {
sessionApi.getSessions((sessions) => {
var loadingSpinner = this.getElementsByTagName("loading-spinner")[0];
console.log(loadingSpinner);
if (loadingSpinner) {
this.removeChild(loadingSpinner);
}
@@ -36,6 +34,7 @@ export class SessionList extends BaseElement {
var ele = document.createElement("session-list-item");
ele.setAttribute("sessionId", session.id);
ele.setAttribute("numberOfChanges", session.numberOfChanges);
ele.setAttribute("timestamp", session.timestamp);
this.appendChild(ele);
}
package-lock.json
Generated
+5283 -3566
View File
File diff suppressed because it is too large Load Diff
package.json
+20 -20
View File
@@ -13,33 +13,33 @@
"dependencies": {
},
"devDependencies": {
"monaco-editor-core": "0.33.0",
"monaco-editor": "^0.33.0",
"@types/node": "17.0.21",
"@babel/core": "7.17.8",
"@webcomponents/custom-elements": "1.5.0",
"babel-loader": "8.2.3",
"monaco-editor-core": "0.38.0",
"monaco-editor": "0.38.0",
"@types/node": "20.2.5",
"@babel/core": "7.22.1",
"@webcomponents/custom-elements": "1.6.0",
"babel-loader": "9.1.2",
"babel-plugin-transform-custom-element-classes": "0.1.0",
"babel-preset-env": "1.7.0",
"copy-webpack-plugin": "^10.2.4",
"css-loader": "6.7.1",
"copy-webpack-plugin": "11.0.0",
"css-loader": "6.8.1",
"extract-text-webpack-plugin": "3.0.2",
"file-loader": "6.2.0",
"gulp": "4.0.2",
"html-loader": "3.1.0",
"less": "4.1.2",
"less-loader": "10.2.0",
"npm": "8.5.5",
"open": "8.4.0",
"html-loader": "4.2.0",
"less": "4.1.3",
"less-loader": "11.1.1",
"npm": "9.6.7",
"open": "9.1.0",
"path": "0.12.7",
"replace-in-file-webpack-plugin": "1.0.6",
"style-loader": "3.3.1",
"ts-loader": "9.2.8",
"typescript": "4.6.2",
"webpack": "5.70.0",
"webpack-cli": "4.9.2",
"webpack-dev-server": "4.7.4",
"webpack-merge": "5.8.0",
"style-loader": "3.3.3",
"ts-loader": "9.4.3",
"typescript": "5.0.4",
"webpack": "5.84.1",
"webpack-cli": "5.1.1",
"webpack-dev-server": "4.15.0",
"webpack-merge": "5.9.0",
"raw-loader": "4.0.2",
"monaco-editor-webpack-plugin": "7.0.1"
}
shared/date-helper.ts
+13
View File
@@ -0,0 +1,13 @@
export function formatDate(date: string): string {
if (date == "") {
return "No date";
}
var d = new Date(date);
return pad(d.getDate()) + "-" + pad(d.getMonth() + 1) + "-" + d.getFullYear() + " " + pad(d.getHours()) + ":" + pad(d.getMinutes());
}
function pad(value: number): string {
var strVal = value.toString();
return strVal.length > 1 ? strVal : "0" + strVal;
}
shared/navigation.ts
+3
View File
@@ -0,0 +1,3 @@
export function navigateTo(url: string) {
window.history.pushState("", "", url);
}
shared/page.ts
+8
View File
@@ -5,3 +5,11 @@ export function isSessionPage() {
export function isRootPage() {
return document.URL.indexOf("/sessions") == -1;
}
export function isSessionDetailPage() {
return document.URL.indexOf("/sessions") != -1 && document.URL.length > 40;
}
export function getSessionDetailsId() {
return document.URL.length > 40 ? document.URL.substring(document.URL.indexOf("/sessions/") + 10) : "";
}
shared/url-helpers.ts
+1 -1
View File
@@ -8,7 +8,7 @@ export function IsLocalhost(): boolean {
export function GetOutputFrameUrl(): string {
if (IsLocalhost()) {
return "http://127.0.0.1:8021/";
return "http://localhost:8021/";
}
else {
return "https://outputframe.davidmeincke.dk/";