quartznet/quartznet-info
Watch
3
0
Fork
You've already forked quartznet-info
 0
Code Issues Pull requests Packages Activity Actions

Squashed commit of the following:

Browse source 
commit 787b84159c894cb38ea9eb1423069884f8b56bc4
Author: ChrisDill <chris.rj.dill@gmail.com>
Date:   Sat Jul 24 16:57:16 2021 +0100

    Test footer fix for smaller resolutions

commit bc8cba413d12250d76118ce31668a6dd4e8eebbd
Author: ChrisDill <chris.rj.dill@gmail.com>
Date:   Wed Jul 21 18:53:05 2021 +0100

    Add jsconfig.json and update error/layout prefix

commit 03d1cfced8b095ff79173a25ac2612aaa7f895aa
Author: ChrisDill <chris.rj.dill@gmail.com>
Date:   Wed Jul 21 18:06:45 2021 +0100

    Test sveltekit fixes to get static adapter to work

commit 6f4c28b0ead9d758fbb649d13188da38a6dfb00f
Author: ChrisDill <chris.rj.dill@gmail.com>
Date:   Wed Dec 16 10:25:42 2020 +0000

    Initial sveltekit test
    - New branch for testing out sveltekit. It is not yet 1.0 so this is for experimental purposes.
This commit is contained in:
Chris 2021-07-26 12:22:47 +01:00
commit d06e2b88eb
24 changed files with 388 additions and 3054 deletions
Download patch file Download diff file Expand all files Collapse all files

4
.gitignore vendored
View file

@ -1,2 +1,4 @@
__sapper__
node_modules
node_modules
.svelte-kit
build

4
cypress.json
View file

@ -1,4 +0,0 @@
{
"baseUrl": "http://localhost:3000",
"video": false
}

5
cypress/fixtures/example.json
View file

@ -1,5 +0,0 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}

19
cypress/integration/spec.js
View file

@ -1,19 +0,0 @@
describe('Sapper template app', () => {
beforeEach(() => {
cy.visit('/')
});
it('has the correct <h1>', () => {
cy.contains('h1', 'Great success!')
});
it('navigates to /about', () => {
cy.get('nav a').contains('about').click();
cy.url().should('include', '/about');
});
it('navigates to /blog', () => {
cy.get('nav a').contains('blog').click();
cy.url().should('include', '/blog');
});
});

17
cypress/plugins/index.js
View file

@ -1,17 +0,0 @@
// ***********************************************************
// This example plugins/index.js can be used to load plugins
//
// You can change the location of this file or turn off loading
// the plugins file with the 'pluginsFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/plugins-guide
// ***********************************************************
// This function is called when a project is opened or re-opened (e.g. due to
// the project's config changing)
module.exports = (on, config) => {
// `on` is used to hook into various events Cypress emits
// `config` is the resolved Cypress config
}

25
cypress/support/commands.js
View file

@ -1,25 +0,0 @@
// ***********************************************
// This example commands.js shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add("login", (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This is will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })

20
cypress/support/index.js
View file

@ -1,20 +0,0 @@
// ***********************************************************
// This example support/index.js is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************
// Import commands.js using ES2015 syntax:
import './commands'
// Alternatively you can use CommonJS syntax:
// require('./commands')

10
jsconfig.json Normal file
View file

@ -0,0 +1,10 @@
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"$lib": ["src/lib"],
"$lib/*": ["src/lib/*"]
}
},
"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"]
}

2695
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

37
package.json
View file

@ -1,36 +1,15 @@
{
"name": "Quartznet",
"description": "Quartznet website",
"version": "0.0.1",
"scripts": {
"dev": "sapper dev",
"build": "sapper build --legacy",
"export": "sapper export --legacy",
"start": "node __sapper__/build",
"cy:run": "cypress run",
"cy:open": "cypress open",
"test": "run-p --race dev cy:run"
},
"dependencies": {
"compression": "^1.7.4",
"polka": "next"
"dev": "svelte-kit dev",
"build": "svelte-kit build",
"preview": "svelte-kit preview"
},
"devDependencies": {
"npm-run-all": "^4.1.5",
"sapper": "^0.28.0",
"svelte": "^3.24.1",
"@babel/core": "^7.11.1",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/plugin-transform-runtime": "^7.11.0",
"@babel/preset-env": "^7.11.0",
"@babel/runtime": "^7.11.2",
"@rollup/plugin-babel": "^5.2.0",
"@rollup/plugin-commonjs": "^15.0.0",
"@rollup/plugin-node-resolve": "^9.0.0",
"@rollup/plugin-replace": "^2.3.3",
"rollup": "^2.26.4",
"rollup-plugin-svelte": "^5.2.3",
"rollup-plugin-terser": "^7.0.0",
"sirv": "^1.0.6"
}
"@sveltejs/adapter-static": "^1.0.0-next.13",
"@sveltejs/kit": "next",
"svelte": "^3.34.0"
},
"type": "module"
}

105
rollup.config.js
View file

@ -1,105 +0,0 @@
import resolve from '@rollup/plugin-node-resolve';
import replace from '@rollup/plugin-replace';
import commonjs from '@rollup/plugin-commonjs';
import svelte from 'rollup-plugin-svelte';
import babel from '@rollup/plugin-babel';
import {terser} from 'rollup-plugin-terser';
import config from 'sapper/config/rollup.js';
import pkg from './package.json';
const mode = process.env.NODE_ENV;
const dev = mode === 'development';
const legacy = !!process.env.SAPPER_LEGACY_BUILD;
const onwarn = (warning, onwarn) =>
(warning.code === 'MISSING_EXPORT' && /'preload'/.test(warning.message)) ||
(warning.code === 'CIRCULAR_DEPENDENCY' && /[/\\]@sapper[/\\]/.test(warning.message)) ||
onwarn(warning);
export default {
client: {
input: config.client.input(),
output: config.client.output(),
plugins: [
replace({
'process.browser': true,
'process.env.NODE_ENV': JSON.stringify(mode)
}),
svelte({
dev,
hydratable: true,
emitCss: true
}),
resolve({
browser: true,
dedupe: ['svelte']
}),
commonjs(),
legacy && babel({
extensions: ['.js', '.mjs', '.html', '.svelte'],
babelHelpers: 'runtime',
exclude: ['node_modules/@babel/**'],
presets: [
['@babel/preset-env', {
targets: '> 0.25%, not dead'
}]
],
plugins: [
'@babel/plugin-syntax-dynamic-import',
['@babel/plugin-transform-runtime', {
useESModules: true
}]
]
}),
!dev && terser({
module: true
})
],
preserveEntrySignatures: false,
onwarn,
},
server: {
input: config.server.input(),
output: config.server.output(),
plugins: [
replace({
'process.browser': false,
'process.env.NODE_ENV': JSON.stringify(mode)
}),
svelte({
generate: 'ssr',
hydratable: true,
dev
}),
resolve({
dedupe: ['svelte']
}),
commonjs()
],
external: Object.keys(pkg.dependencies).concat(require('module').builtinModules),
preserveEntrySignatures: 'strict',
onwarn,
},
serviceworker: {
input: config.serviceworker.input(),
output: config.serviceworker.output(),
plugins: [
resolve(),
replace({
'process.browser': true,
'process.env.NODE_ENV': JSON.stringify(mode)
}),
commonjs(),
!dev && terser()
],
preserveEntrySignatures: false,
onwarn,
}
};

125
scripts/setupTypeScript.js
View file

@ -1,125 +0,0 @@
// @ts-check
/** This script modifies the project to support TS code in .svelte files like:
<script lang="ts">
export let name: string;
</script>
As well as validating the code for CI.
*/
/** To work on this script:
rm -rf test-template template && git clone sveltejs/template test-template && node scripts/setupTypeScript.js test-template
*/
const fs = require("fs")
const path = require("path")
const {argv} = require("process")
const projectRoot = argv[2] || path.join(__dirname, "..")
// Add deps to pkg.json
const packageJSON = JSON.parse(fs.readFileSync(path.join(projectRoot, "package.json"), "utf8"))
packageJSON.devDependencies = Object.assign(packageJSON.devDependencies, {
"svelte-check": "^1.0.0",
"svelte-preprocess": "^4.0.0",
"@rollup/plugin-typescript": "^4.0.0",
"typescript": "^3.9.3",
"tslib": "^2.0.0",
"@tsconfig/svelte": "^1.0.0"
})
// Add script for checking
packageJSON.scripts = Object.assign(packageJSON.scripts, {
"validate": "svelte-check"
})
// Write the package JSON
fs.writeFileSync(path.join(projectRoot, "package.json"), JSON.stringify(packageJSON, null, " "))
// mv src/main.js to main.ts - note, we need to edit rollup.config.js for this too
const beforeMainJSPath = path.join(projectRoot, "src", "main.js")
const afterMainTSPath = path.join(projectRoot, "src", "main.ts")
fs.renameSync(beforeMainJSPath, afterMainTSPath)
// Switch the app.svelte file to use TS
const appSveltePath = path.join(projectRoot, "src", "index.svelte")
let appFile = fs.readFileSync(appSveltePath, "utf8")
appFile = appFile.replace("<script>", '<script lang="ts">')
appFile = appFile.replace("export let name;", 'export let name: string;')
fs.writeFileSync(appSveltePath, appFile)
// Edit rollup config
const rollupConfigPath = path.join(projectRoot, "rollup.config.js")
let rollupConfig = fs.readFileSync(rollupConfigPath, "utf8")
// Edit imports
rollupConfig = rollupConfig.replace(`'rollup-plugin-terser';`, `'rollup-plugin-terser';
import sveltePreprocess from 'svelte-preprocess';
import typescript from '@rollup/plugin-typescript';`)
// Replace name of entry point
rollupConfig = rollupConfig.replace(`'src/main.js'`, `'src/main.ts'`)
// Add preprocess to the svelte config, this is tricky because there's no easy signifier.
// Instead we look for `css:` then the next `}` and add the preprocessor to that
let foundCSS = false
let match
// https://regex101.com/r/OtNjwo/1
const configEditor = new RegExp(/css:.|\n*}/gmi)
while ((match = configEditor.exec(rollupConfig)) != null) {
if (foundCSS) {
const endOfCSSIndex = match.index + 1
rollupConfig = rollupConfig.slice(0, endOfCSSIndex) + ",\n preprocess: sveltePreprocess()," + rollupConfig.slice(endOfCSSIndex);
break
}
if (match[0].includes("css:")) foundCSS = true
}
// Add TypeScript
rollupConfig = rollupConfig.replace("commonjs(),", 'commonjs(),\n\t\ttypescript({ sourceMap: !production }),')
fs.writeFileSync(rollupConfigPath, rollupConfig)
// Add TSConfig
const tsconfig = `{
"extends": "@tsconfig/svelte/tsconfig.json",
"include": ["src/**/*"],
"exclude": ["node_modules/*", "__sapper__/*", "public/*"],
}`
const tsconfigPath = path.join(projectRoot, "tsconfig.json")
fs.writeFileSync(tsconfigPath, tsconfig)
// Delete this script, but not during testing
if (!argv[2]) {
// Remove the script
fs.unlinkSync(path.join(__filename))
// Check for Mac's DS_store file, and if it's the only one left remove it
const remainingFiles = fs.readdirSync(path.join(__dirname))
if (remainingFiles.length === 1 && remainingFiles[0] === '.DS_store') {
fs.unlinkSync(path.join(__dirname, '.DS_store'))
}
// Check if the scripts folder is empty
if (fs.readdirSync(path.join(__dirname)).length === 0) {
// Remove the scripts folder
fs.rmdirSync(path.join(__dirname))
}
}
// Adds the extension recommendation
fs.mkdirSync(path.join(projectRoot, ".vscode"))
fs.writeFileSync(path.join(projectRoot, ".vscode", "extensions.json"), `{
"recommendations": ["svelte.svelte-vscode"]
}
`)
console.log("Converted to TypeScript.")
if (fs.existsSync(path.join(projectRoot, "node_modules"))) {
console.log("\nYou will need to re-run your dependency manager to get started.")
}

19
src/app.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#333333">
<meta name="description" content="Quartznet is a small team developing games, tools and more!">
<link rel="stylesheet" href="/css/bootstrap.min.css">
<link rel="stylesheet" href="/css/global.css">
<link rel="manifest" href="manifest.json" crossorigin="use-credentials">
<link rel="icon" type="image/png" href="/img/favicon.ico">
%svelte.head%
</head>
<body>
<div id="svelte">%svelte.body%</div>
</body>
</html>

5
src/client.js
View file

@ -1,5 +0,0 @@
import * as sapper from '@sapper/app';
sapper.start({
target: document.querySelector('#sapper')
});

2
src/components/banner.svelte
View file

@ -19,8 +19,6 @@
font-size: 3rem;
text-decoration: none;
}
</style>
<div class="overlay">

10
src/main.js
View file

@ -1,10 +0,0 @@
import App from './routes/index.svelte';
const app = new App({
target: document.body,
props: {
name: 'Quartznet'
}
});
export default app;

80
src/404.svelte → src/routes/__error.svelte Executable file → Normal file
View file

@ -1,7 +1,12 @@
<script>
import {onMount} from 'svelte'
import Banner from '../components/banner.svelte'
export let status;
export let error;
const dev = process.env.NODE_ENV === 'development';
var view = document.getElementsByTagName('pre')[0];
var appa = ` .,-:;//;:=,
. :H@@@MM@M#H/.,+%;,
,/X+ +M@@M@MM%=,-%HMMM@X/,
@ -212,32 +217,76 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
,:/%XM####H/.
,.:=-.`;
//appa
//atom
//nuke
// appa, atom, nuke
var options = [cake, heart, fire, tick, bang, mesa, cube];
let active = cake
function updateView() {
active = "<br>" + options[Math.floor((Math.random() * options.length))];
active = options[Math.floor((Math.random() * options.length))];
setTimeout(updateView, 5000);
}
onMount(() => updateView());
</script>
<style>
* {
color: white !important;
font-family: monospace;
white-space: pre;
}
.ascii {
text-align: center;
width: 100%;
}
.info {
margin-bottom: 30px;
position: relative;
white-space: pre;
text-align: center;
}
pre {
/* display: inline-block; */
margin: 0 auto;
/* position: center; */
/* text-align: left; */
font-family: monospace;
white-space: pre;
}
@media (min-width: 480px) {
h1 {
font-size: 4em;
}
}
</style>
<svelte:head>
<title>Quartnzet - {status}</title>
</svelte:head>
<body style="text-align: center">
<audio controls autoplay>
<source src="alive.ogg" type="audio/wav">
</audio>
<Banner title="{status}"/>
<pre>{active}</pre>
<br>
<main class="container">
<p>{error.message}</p>
{#if dev && error.stack}
<pre>{error.stack}</pre>
{:else}
<audio controls autoplay>
<track kind="captions"/>
<source src="http://quartznet.info/alive.ogg" type="audio/wav">
</audio>
<div class="ascii">
<div>
<pre><br>{active}</pre>
</div>
</div>
<hr>
<p class="info">
This was a triumph!
I'm making a note here:
Huge success!
@ -312,5 +361,6 @@ still alive
Still alive.
Still alive.
</body>
</html>
</p>
{/if}
</main>

41
src/routes/__layout.svelte Normal file
View file

@ -0,0 +1,41 @@
<script>
import Nav from '../components/Nav.svelte';
import userManager from '../components/userManager.svelte'
import Modal from '../components/Modal.svelte'
import Footer from '../components/footer.svelte'
export let segment;
</script>
<style>
/*main {
position: relative;
max-width: 56em;
background-color: white;
padding: 2em;
margin: 0 auto;
box-sizing: border-box;
}*/
/* Dark theme */
:global(html[data-theme='dark']) {
--background-color: #222222;
--headings-color: #ffffff;
--font-color: #ffffff;
}
:global(body) {
font-family: 'Open Sans', sans-serif;
font-size: 1rem;
background-color: var(--background-color);
color: var(--font-color);
box-sizing: border-box;
}
</style>
<Modal/>
<Nav {segment} rightComponent={userManager}/>
<slot></slot>
<Footer/>

18
src/server.js
View file

@ -1,18 +0,0 @@
import sirv from 'sirv';
import polka from 'polka';
import compression from 'compression';
import * as sapper from '@sapper/server';
const {PORT, NODE_ENV} = process.env;
const dev = NODE_ENV === 'development';
polka() // You can also use Express
.use(
compression({threshold: 0}),
sirv('static', {dev}),
sapper.middleware()
)
.listen(PORT, err => {
if (err) console.log('error', err);
});
console.log('> DEV: ' + dev.toString())

Some files were not shown because too many files have changed in this diff Show more