Skip to content

Commit 880e427

Browse files
committed
just added spa support and now should be ready
1 parent 1d4d4f7 commit 880e427

32 files changed

+935
-1
lines changed

core/cli.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import Template from '../io/temp/temp.ts'
22
import App from '../io/app/index.ts'
3+
import SPA from '../io/spa/index.ts'
34
import Engine from '../io/engine/index.ts'
45
import Update from '../io/update/index.ts'
56

@@ -149,7 +150,7 @@ if (import.meta.main) {
149150
switch (expr) {
150151
case 'spa':
151152
console.log("starting to create app...");
152-
createApp();
153+
SPA();
153154
break;
154155
case 'Server':
155156
console.log('Creating Server');

io/spa/index.ts

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import * as sdk from "../../imports/index.ts";
2+
const directory = `./${sdk.env.get('tool')}/io/spa`
3+
4+
5+
const app = async () => {
6+
7+
8+
//ensureDir("./notes").then(() => console.log('has')).catch(() => console.log("err"))
9+
try {
10+
console.log(`creating ${Deno.args}`)
11+
console.log(`in folder ${Deno.cwd()}`)
12+
//await Deno.chmod(Deno.cwd(), 0o777);
13+
//console.log(`Creating ${name} Folder`)
14+
//await sdk.CraeteFolder(`./`)
15+
16+
17+
18+
try {
19+
20+
await sdk.copyDirectory(`${directory}/resources`)
21+
22+
23+
} catch(err) {
24+
console.log("unable to copy files",err)
25+
}
26+
27+
28+
} catch (e) {
29+
console.log("unable to copy folder", e)
30+
}
31+
32+
33+
}
34+
35+
36+
async function getList(path: string, pre = "") {
37+
for await (const dirEntry of Deno.readDir(path)) {
38+
39+
const entryPath = `${path}/${dirEntry.name}`;
40+
const getPath = entryPath.split('/')
41+
42+
let dest = `${pre}${dirEntry.name}`
43+
44+
//console.log();
45+
if (dirEntry.isDirectory) {
46+
47+
await sdk.CraeteFolder(`./${dest}`);
48+
49+
await getList(entryPath, `${dest}/`);
50+
51+
52+
} else if (dirEntry.isFile) {
53+
await Deno.copyFile(entryPath, `./${dest}`);
54+
}
55+
}
56+
57+
}
58+
59+
60+
61+
export default app

io/spa/resources/.env

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
TESTAPI=helloWorld

io/spa/resources/.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules
2+
.parcel-cache
3+
dist

io/spa/resources/.postcssrc

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"modules": false,
3+
"plugins": {
4+
"postcss-import": {},
5+
"postcss-url": {},
6+
"postcss-custom-properties": {},
7+
"tailwindcss" : {},
8+
9+
}
10+
}
11+
12+
//findout why it changes the css

io/spa/resources/api/index.js

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
2+
3+
module.exports = (req, res) => {
4+
console.log("reading from api", process.env.TESTAPI)
5+
6+
try {
7+
res.json({
8+
body: req.body,
9+
query: req.query,
10+
cookies: req.cookies,
11+
testapi: process.env.TESTAPI
12+
})
13+
} catch (e) {
14+
15+
if (e instanceof TypeError) {
16+
console.log('error calling api trying manal call',req)
17+
18+
return "you are a method"
19+
}
20+
21+
res.json({
22+
type: "error",
23+
24+
})
25+
}
26+
}

io/spa/resources/jsconfig.json

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
}
5+
}

io/spa/resources/package.json

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"name": "problem",
3+
"version": "1.0.0",
4+
"description": "",
5+
"scripts": {
6+
"test": "echo \"Error: no test specified\" && exit 1",
7+
"start": "parcel serve ./pages/**/*.html",
8+
"build": "parcel build ./pages/index.html ./pages/**/*.html",
9+
"dev": "parcel watch ./pages/**/*.html"
10+
},
11+
"keywords": [],
12+
"author": "",
13+
"license": "ISC",
14+
"devDependencies": {
15+
"@babel/core": "^7.14.6",
16+
"autoprefixer": "^10.2.6",
17+
"parcel": "^2.0.0-beta.3.1",
18+
"postcss": "^8.3.0",
19+
"postcss-custom-properties": "^11.0.0",
20+
"postcss-import": "^14.0.2",
21+
"postcss-url": "^10.1.3",
22+
"tailwindcss": "^2.1.4"
23+
},
24+
"dependencies": {
25+
"hello": "file:./src/pkg"
26+
},
27+
"alias": {
28+
"api": "./api",
29+
"components": "./src/components"
30+
},
31+
"targets": {
32+
"app": {
33+
"distDir": "./dist"
34+
}
35+
}
36+
}
+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Pop-up info box — web components</title>
6+
7+
<link rel="stylesheet" href="../index.css" type="text/css" />
8+
9+
<script src="../../src/components/head.js" defer></script>
10+
<script src="../../src/components/example.js" defer></script>
11+
<head-title id="hello" data-text="Hello World"></head-title>
12+
</head>
13+
<body class="canvas_home">
14+
15+
<a href="hello">Hello</a>
16+
<script src="../index.js"></script>
17+
</body>
18+
</html>

io/spa/resources/pages/index.css

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
@tailwind base;
2+
@tailwind components;
3+
4+
5+
.hello {
6+
7+
background-color: black;
8+
}
9+
10+
11+
12+
@tailwind utilities;
13+
14+
15+
@layer components {
16+
17+
18+
19+
20+
.canvas_home {
21+
@apply w-screen h-full flex flex-col p-0;
22+
}
23+
24+
@import "./second/index.module.css";
25+
}

io/spa/resources/pages/index.html

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Index</title>
6+
7+
<link rel="stylesheet" href="./index.css" type="text/css" />
8+
</head>
9+
<body>
10+
<!-- <template id="nav">
11+
<div class="nav">
12+
<div class="w-1/2 flex text-black text-white">
13+
<slot name="title"> title</slot>
14+
</div>
15+
<div class="w-1/2 flex text-black text-white">
16+
<slot name="second"> title</slot>
17+
</div>
18+
</div>
19+
</template> -->
20+
21+
<nav-header data-title="Index">
22+
<span slot="title">hello world</span>
23+
<span id="click-here" slot="menu">click change</span>
24+
</nav-header>
25+
<script src="../src/index.js"></script>
26+
</body>
27+
</html>

io/spa/resources/pages/index.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import api from 'api'
2+
3+
4+
init()
5+
.then(() => {
6+
7+
const helloWorld = Hello.new('so have we found it')
8+
9+
console.log(helloWorld.message())
10+
11+
});
12+
13+
14+
15+
api('testing my knowledge')
16+
17+
// let doc = document.getElementById("hello")
18+
19+
// console.log(doc)
20+
21+
// doc.setAttribute('data-text','We Work')
+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>About Second Page</title>
6+
7+
<link rel="stylesheet" href="../index.css" type="text/css" />
8+
9+
<body class="canvas_home">
10+
11+
<a href="hello">Hello</a>
12+
13+
</body>
14+
</html>
+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Second Page</title>
6+
7+
<link rel="stylesheet" href="../index.css" type="text/css" />
8+
9+
<body class="canvas_home">
10+
11+
<a href="hello">Hello</a>
12+
<script src="./index.js"></script>
13+
</body>
14+
</html>
+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// import init, { Hello } from "hello";
2+
3+
// init()
4+
// .then(() => {
5+
6+
// const helloWorld = Hello.new('so have we found it')
7+
8+
// console.log(helloWorld.message())
9+
10+
// });
11+
12+
13+
// let doc = document.getElementById("hello")
14+
15+
console.log("second page")
16+
17+
// doc.setAttribute('data-text','We Work')
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
2+
3+
.bye{
4+
@apply bg-white;
5+
}
6+
7+
8+

io/spa/resources/readme.md

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# React is failing me
2+
3+
## Time to Move on
4+
5+
6+
## TO DO
7+
8+
[] add vercel cli support
9+
10+
### Modern Day Picasso Web App
11+
12+
- p2p(decentralized)
13+
- native web
+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
class PopUpInfo extends HTMLElement {
2+
constructor() {
3+
// Always call super first in constructor
4+
super();
5+
6+
// write element functionality in here
7+
8+
// Create a shadow root
9+
10+
this.attachShadow({mode: 'open'}); // sets and returns 'this.shadowRoot'
11+
12+
// Create (nested) span elements
13+
const wrapper = document.createElement('span');
14+
wrapper.setAttribute('class','wrapper');
15+
const icon = wrapper.appendChild(document.createElement('span'));
16+
icon.setAttribute('class','icon');
17+
icon.setAttribute('tabindex', 0);
18+
// Insert icon from defined attribute or default icon
19+
const img = icon.appendChild(document.createElement('img'));
20+
img.src = this.hasAttribute('img') ? this.getAttribute('img') : 'img/default.png';
21+
22+
const info = wrapper.appendChild(document.createElement('span'));
23+
info.setAttribute('class','info');
24+
// Take attribute content and put it inside the info span
25+
info.textContent = this.textContent
26+
27+
//this.getAttribute('data-text');
28+
29+
// Create some CSS to apply to the shadow dom
30+
const style = document.createElement('style');
31+
style.textContent = '.wrapper {' +
32+
// CSS truncated for brevity
33+
34+
// attach the created elements to the shadow DOM
35+
this.shadowRoot.append(style,wrapper);
36+
37+
38+
}
39+
}
40+
customElements.define('popup-info', PopUpInfo);

0 commit comments

Comments
 (0)