elex/js-examples
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2023-02-26 01:30

Browse Source
This commit is contained in:
Elex
2023-02-26 01:30:37 +09:00
commit 9a13ccbd17
122 changed files with 32148 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
gepetto/.gitignore vendored Normal file
View File

@@ -0,0 +1 @@
/node_modules

30
gepetto/index.html Normal file
View File

@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test</title>
<script type="module" src="build/bundle.js"></script>
<style>
html,
body {
margin: 0;
border: 0;
padding: 0;
font-size: 16px;
}
</style>
</head>
<body class="grid-container">
<elex-layout>
<div slot="north">
<elex-toolbar title="Elex">Hehehe</elex-toolbar>
</div>
<p>jkjk</p>
</elex-layout>
</body>
</html>

56
gepetto/main.js Normal file
View File

@@ -0,0 +1,56 @@
const { app, BrowserWindow, Menu, MenuItem } = require('electron');
function createWindow() {
let win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
});
createMenu();
win.loadFile('index.html');
win.webContents.openDevTools();
}
function createMenu() {
const menu = [
{
label: 'File',
submenu: [
{ label: 'Exit', role: 'quit' }
]
},
{
label: 'Edit',
submenu: [
{ label: 'Copy', role: 'copy' },
{ label: 'Cut', role: 'cut' },
{ label: 'Paste', role: 'paste' },
{ type: 'separator' },
{ label: 'Undo', role: 'undo' },
{ label: 'Redo', role: 'redo' },
]
}
];
Menu.setApplicationMenu(Menu.buildFromTemplate(menu));
}
app.whenReady().then(createWindow);
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});

30
gepetto/package.json Normal file
View File

@@ -0,0 +1,30 @@
{
"name": "gepetto",
"version": "1.0.0",
"description": "",
"main": "main.js",
"scripts": {
"start": "electron .",
"clean": "rm -r ./build/*",
"build": "webpack",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "Elex",
"license": "ELEX",
"devDependencies": {
"@babel/core": "^7.9.0",
"@babel/plugin-proposal-class-properties": "^7.8.3",
"@babel/plugin-proposal-decorators": "^7.8.3",
"@babel/preset-env": "^7.9.5",
"@babel/preset-typescript": "^7.9.0",
"babel-loader": "^8.1.0",
"electron": "^8.2.3",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.11"
},
"dependencies": {
"electron": "^8.2.3",
"lit-element": "^2.3.1"
}
}

6
gepetto/src/App.ts Normal file
View File

@@ -0,0 +1,6 @@
const Toolbar = require('./Toolbar.ts')
const AppLayout = require('./AppLayout.ts')
module.exports = {
Toolbar, AppLayout
};

30
gepetto/src/AppLayout.ts Normal file
View File

@@ -0,0 +1,30 @@
import { LitElement, html, css } from 'lit-element';
export class AppLayout extends LitElement {
static get styles() {
return css`
#layout {
display: grid; width:100%; height:100%;overflow:hidden;
grid-template-rows: fitContent(64) 1fr fitContent(24);
grid-template-columns: fitContent(180) 1fr fitContent(180);
}
.north {grid-row-start:1; grid-row-end: span 1; background-color: red;
grid-column-start:1; grid-column-end: span 3;}
`;
}
render() {
return html`
<div id="layout">
<div class="north"><slot name="north"></slot></div>
<div class="south"><slot name="south"></slot></div>
<div class="east"><slot name="east"></slot></div>
<div class="west"><slot name="west"></slot></div>
<div class="center"><slot name="center"></slot></div>
</div>
`;
}
}
customElements.define('elex-layout', AppLayout);

23
gepetto/src/Toolbar.ts Normal file
View File

@@ -0,0 +1,23 @@
import { LitElement, html, css } from 'lit-element';
export class Toolbar extends LitElement {
static get properties() {
return {
title: { type: String }
};
}
static get styles() {
return css`
div {min-height: 64px;}
h1 {margin:0;padding:0;font-size:2.4rem;}
`;
}
render() {
return html`
<div><h1>${this.title}</h1></div>
`;
}
}
customElements.define('elex-toolbar', Toolbar);

12
gepetto/tsconfig.json Normal file
View File

@@ -0,0 +1,12 @@
{
"compilerOptions": {
"target": "es2017",
"module": "es2015",
"moduleResolution": "node",
"lib": [
"es2017",
"dom"
],
"experimentalDecorators": true
}
}

37
gepetto/webpack.config.js Normal file
View File

@@ -0,0 +1,37 @@
const path = require('path');
module.exports = {
target: 'electron-renderer',
entry: {
app: './src/App.ts',
},
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'build')
},
module: {
rules: [
{
test: /\.ts$/,
include: '/src',
//exclude: '/node_modules/',
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-typescript'],
plugins: [
'@babel/plugin-proposal-class-properties',
['@babel/plugin-proposal-decorators',
{ decoratorsBeforeExport: true }],
]
}
}
}
]
},
mode: 'development',
watch: true,
optimization: {
minimize: true,
concatenateModules: true
},
}