Skip to content

Commit 9151709

Browse files
btoprobtopro
committed
https://github.com/elmsln/issues/issues/1625
1 parent c912620 commit 9151709

File tree

2 files changed

+46
-74
lines changed

2 files changed

+46
-74
lines changed

‎elements/hax-cloud/hax-cloud.js

Lines changed: 23 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,14 @@
44
* @demo demo/index.html
55
* @element hax-cloud
66
*/
7-
import { LitElement, html } from "lit";
7+
import { html } from "lit";
8+
import { DDD } from "@lrnwebcomponents/d-d-d/d-d-d.js";
89
import { FileSystemBrokerSingleton } from "@lrnwebcomponents/file-system-broker/file-system-broker.js";
910
import "@lrnwebcomponents/simple-icon/lib/simple-icons.js";
1011
import "@lrnwebcomponents/hax-iconset/lib/simple-hax-iconset.js";
1112
import "@lrnwebcomponents/simple-icon/lib/simple-icon-button-lite.js";
1213
import "@lrnwebcomponents/haxcms-elements/lib/core/haxcms-site-builder.js";
13-
class HaxCloud extends LitElement {
14+
class HaxCloud extends DDD {
1415
createRenderRoot() {
1516
return this;
1617
}
@@ -20,16 +21,10 @@ class HaxCloud extends LitElement {
2021
static get tag() {
2122
return "hax-cloud";
2223
}
23-
static get properties() {
24-
return {
25-
step: { type: Number },
26-
};
27-
}
2824

2925
constructor() {
3026
super();
3127
this.windowControllers = new AbortController();
32-
this.step = 1;
3328
this.fileRoot = "";
3429
this.fileObjects = [];
3530
if (!window.__haxLogoFontLoaded) {
@@ -64,8 +59,8 @@ class HaxCloud extends LitElement {
6459
padding: 16px;
6560
margin: 0;
6661
--simple-icon-button-border-radius: 0;
67-
--simple-icon-width: 200px;
68-
--simple-icon-height: 200px;
62+
--simple-icon-width: 100px;
63+
--simple-icon-height: 100px;
6964
}
7065
simple-icon-button-lite::part(button) {
7166
font-size: 20px;
@@ -116,8 +111,8 @@ class HaxCloud extends LitElement {
116111
margin: 16px;
117112
}
118113
.name-icon {
119-
--simple-icon-width: 64px;
120-
--simple-icon-height: 64px;
114+
--simple-icon-width: 100px;
115+
--simple-icon-height: 100px;
121116
display: inline-flex;
122117
padding: 16px;
123118
}
@@ -148,7 +143,8 @@ class HaxCloud extends LitElement {
148143
<li>Click Download HAX site (if needed)</li>
149144
<li>Unzip folder where you manage files on your computer</li>
150145
<li>Click Select HAX site</li>
151-
<li>Select a HAX site (what you just unzipped)</li>
146+
<li>Select The HAX site that you just unzipped in Step 2</li>
147+
<li>Start editing HAX pages on your local machine!!</li>
152148
</ol>
153149
</details>
154150
<div class="step">
@@ -160,9 +156,8 @@ class HaxCloud extends LitElement {
160156
>
161157
</div>
162158
<div class="step">
163-
<h2>Step 2</h2>
159+
<h2>Step 3</h2>
164160
<simple-icon-button-lite
165-
?disabled="${this.step < 1}"
166161
icon="folder-open"
167162
@click="${this.findLocalHaxCopy}"
168163
>Select HAX site</simple-icon-button-lite
@@ -174,7 +169,6 @@ class HaxCloud extends LitElement {
174169
}
175170

176171
async downloadHAXLatest() {
177-
this.step = 1;
178172
let a = document.createElement("a");
179173
a.href =
180174
"https://github.com/elmsln/hax-single-site/archive/refs/heads/main.zip";
@@ -183,27 +177,20 @@ class HaxCloud extends LitElement {
183177
}
184178

185179
async findLocalHaxCopy() {
186-
if (this.step > 0) {
187-
const broker = FileSystemBrokerSingleton;
188-
// this allows confirmation that all file objects in this directory are open for read and write
189-
this.fileObjects = await broker.openDir(true, { mode: "readwrite" });
190-
await this.fileObjects.forEach(async (fileRecord) => {
191-
if (fileRecord.kind === "file" && fileRecord.name === "site.json") {
192-
let file = await fileRecord.handle.getFile();
193-
let manifest = JSON.parse(await file.text());
194-
this.fileRoot = fileRecord.folder;
195-
console.log(manifest);
196-
if (manifest && manifest.items.length > 0) {
197-
document.querySelector("haxcms-site-builder").manifest = manifest;
198-
}
199-
}
200-
});
201-
setTimeout(() => {
202-
if (this.step === 1) {
203-
alert("You must select a valid HAXcms site folder");
180+
const broker = FileSystemBrokerSingleton;
181+
// this allows confirmation that all file objects in this directory are open for read and write
182+
this.fileObjects = await broker.openDir(true, { mode: "readwrite" });
183+
await this.fileObjects.forEach(async (fileRecord) => {
184+
if (fileRecord.kind === "file" && fileRecord.name === "site.json") {
185+
let file = await fileRecord.handle.getFile();
186+
let manifest = JSON.parse(await file.text());
187+
this.fileRoot = fileRecord.folder;
188+
console.log(manifest);
189+
if (manifest && manifest.items.length > 0) {
190+
document.querySelector("haxcms-site-builder").manifest = manifest;
204191
}
205-
}, 10);
206-
}
192+
}
193+
});
207194
}
208195

209196
loadLocalHax() {
@@ -234,7 +221,6 @@ class HaxCloud extends LitElement {
234221
},
235222
},
236223
};
237-
this.step = 2;
238224
// inject the file object / directory root into the user file system backend handler
239225
// this way we can intercept failed page requests and redirect them to the local file system
240226
// and keep all logic inside the userfs handler and remove this element

‎elements/hax-cloud/src/hax-cloud.js

Lines changed: 23 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,14 @@
44
* @demo demo/index.html
55
* @element hax-cloud
66
*/
7-
import { LitElement, html } from "lit";
7+
import { html } from "lit";
8+
import { DDD } from "@lrnwebcomponents/d-d-d/d-d-d.js";
89
import { FileSystemBrokerSingleton } from "@lrnwebcomponents/file-system-broker/file-system-broker.js";
910
import "@lrnwebcomponents/simple-icon/lib/simple-icons.js";
1011
import "@lrnwebcomponents/hax-iconset/lib/simple-hax-iconset.js";
1112
import "@lrnwebcomponents/simple-icon/lib/simple-icon-button-lite.js";
1213
import "@lrnwebcomponents/haxcms-elements/lib/core/haxcms-site-builder.js";
13-
class HaxCloud extends LitElement {
14+
class HaxCloud extends DDD {
1415
createRenderRoot() {
1516
return this;
1617
}
@@ -20,16 +21,10 @@ class HaxCloud extends LitElement {
2021
static get tag() {
2122
return "hax-cloud";
2223
}
23-
static get properties() {
24-
return {
25-
step: { type: Number },
26-
};
27-
}
2824

2925
constructor() {
3026
super();
3127
this.windowControllers = new AbortController();
32-
this.step = 1;
3328
this.fileRoot = "";
3429
this.fileObjects = [];
3530
if (!window.__haxLogoFontLoaded) {
@@ -64,8 +59,8 @@ class HaxCloud extends LitElement {
6459
padding: 16px;
6560
margin: 0;
6661
--simple-icon-button-border-radius: 0;
67-
--simple-icon-width: 200px;
68-
--simple-icon-height: 200px;
62+
--simple-icon-width: 100px;
63+
--simple-icon-height: 100px;
6964
}
7065
simple-icon-button-lite::part(button) {
7166
font-size: 20px;
@@ -116,8 +111,8 @@ class HaxCloud extends LitElement {
116111
margin: 16px;
117112
}
118113
.name-icon {
119-
--simple-icon-width: 64px;
120-
--simple-icon-height: 64px;
114+
--simple-icon-width: 100px;
115+
--simple-icon-height: 100px;
121116
display: inline-flex;
122117
padding: 16px;
123118
}
@@ -148,7 +143,8 @@ class HaxCloud extends LitElement {
148143
<li>Click Download HAX site (if needed)</li>
149144
<li>Unzip folder where you manage files on your computer</li>
150145
<li>Click Select HAX site</li>
151-
<li>Select a HAX site (what you just unzipped)</li>
146+
<li>Select The HAX site that you just unzipped in Step 2</li>
147+
<li>Start editing HAX pages on your local machine!!</li>
152148
</ol>
153149
</details>
154150
<div class="step">
@@ -160,9 +156,8 @@ class HaxCloud extends LitElement {
160156
>
161157
</div>
162158
<div class="step">
163-
<h2>Step 2</h2>
159+
<h2>Step 3</h2>
164160
<simple-icon-button-lite
165-
?disabled="${this.step < 1}"
166161
icon="folder-open"
167162
@click="${this.findLocalHaxCopy}"
168163
>Select HAX site</simple-icon-button-lite
@@ -174,7 +169,6 @@ class HaxCloud extends LitElement {
174169
}
175170

176171
async downloadHAXLatest() {
177-
this.step = 1;
178172
let a = document.createElement("a");
179173
a.href =
180174
"https://github.com/elmsln/hax-single-site/archive/refs/heads/main.zip";
@@ -183,27 +177,20 @@ class HaxCloud extends LitElement {
183177
}
184178

185179
async findLocalHaxCopy() {
186-
if (this.step > 0) {
187-
const broker = FileSystemBrokerSingleton;
188-
// this allows confirmation that all file objects in this directory are open for read and write
189-
this.fileObjects = await broker.openDir(true, { mode: "readwrite" });
190-
await this.fileObjects.forEach(async (fileRecord) => {
191-
if (fileRecord.kind === "file" && fileRecord.name === "site.json") {
192-
let file = await fileRecord.handle.getFile();
193-
let manifest = JSON.parse(await file.text());
194-
this.fileRoot = fileRecord.folder;
195-
console.log(manifest);
196-
if (manifest && manifest.items.length > 0) {
197-
document.querySelector("haxcms-site-builder").manifest = manifest;
198-
}
199-
}
200-
});
201-
setTimeout(() => {
202-
if (this.step === 1) {
203-
alert("You must select a valid HAXcms site folder");
180+
const broker = FileSystemBrokerSingleton;
181+
// this allows confirmation that all file objects in this directory are open for read and write
182+
this.fileObjects = await broker.openDir(true, { mode: "readwrite" });
183+
await this.fileObjects.forEach(async (fileRecord) => {
184+
if (fileRecord.kind === "file" && fileRecord.name === "site.json") {
185+
let file = await fileRecord.handle.getFile();
186+
let manifest = JSON.parse(await file.text());
187+
this.fileRoot = fileRecord.folder;
188+
console.log(manifest);
189+
if (manifest && manifest.items.length > 0) {
190+
document.querySelector("haxcms-site-builder").manifest = manifest;
204191
}
205-
}, 10);
206-
}
192+
}
193+
});
207194
}
208195

209196
loadLocalHax() {
@@ -234,7 +221,6 @@ class HaxCloud extends LitElement {
234221
},
235222
},
236223
};
237-
this.step = 2;
238224
// inject the file object / directory root into the user file system backend handler
239225
// this way we can intercept failed page requests and redirect them to the local file system
240226
// and keep all logic inside the userfs handler and remove this element

0 commit comments

Comments
 (0)