Browse Source

Fixed up the bando svelte files.

dev
Zed A. Shaw 4 months ago
parent
commit
998cd97635
  1. 7
      .eslintrc.json
  2. 2
      .stylelintrc.json
  3. 2
      client/bando/Bandolier.svelte
  4. 13
      client/bando/Components.svelte
  5. 63
      client/bando/Djenterator.svelte
  6. 6
      client/bando/IconFinder.svelte

7
.eslintrc.json

@ -40,7 +40,7 @@
"class-methods-use-this": "off",
"comma-dangle": "off",
"comma-spacing": [
"error",
"warn",
{
"after": true,
"before": false
@ -258,10 +258,7 @@
"strict": "error",
"switch-colon-spacing": "error",
"symbol-description": "error",
"template-curly-spacing": [
"error",
"never"
],
"template-curly-spacing": [ "off", "never" ],
"template-tag-spacing": "error",
"unicode-bom": [
"error",

2
.stylelintrc.json

@ -49,7 +49,7 @@
"function-whitespace-after": "always",
"indentation": 2,
"keyframe-declaration-no-important": true,
"length-zero-no-unit": true,
"length-zero-no-unit": false,
"max-empty-lines": 10,
"media-feature-colon-space-after": "always",
"media-feature-colon-space-before": "never",

2
client/bando/Bandolier.svelte

@ -393,7 +393,7 @@
<code>
{#if error_selected.plugin}
{#each error_selected.frame.split("\n") as line, i}
{ line += "\n" }
{ line }
{/each}
{:else if error_selected.code}
{#each error_selected.code.split('\n') as line, i}

13
client/bando/Components.svelte

@ -38,7 +38,6 @@
import Code from "../components/Code.svelte";
import Layout from "../Layout.svelte";
import {onMount} from "svelte";
import { link } from "svelte-spa-router";
/* WARNING: If you put any component that uses /api/login into the first slot
@ -81,7 +80,7 @@
{title: "Video", active: false, icon: "video", component: Video},
];
panels.forEach(p => p.code = p.code || `/bando/demos/${ p.title }.svelte`);
panels.forEach(p => (p.code = p.code || `/bando/demos/${p.title}.svelte`));
let selected = panels[0];
let show_code = false;
@ -92,7 +91,7 @@
selected = item;
panels = panels.map((x,i) => {
panels = panels.map((x, i) => {
x.active = i == index;
return x;
});
@ -107,6 +106,8 @@
contents {
padding: 0.5rem;
width: 100%;
max-height: 100vh;
overflow-y: auto;
}
tabs {
@ -114,7 +115,7 @@
}
@media only screen and (max-width: 900px) {
div[slot="top"] h1 {
div[slot="top"] h3 {
display: none;
}
@ -137,10 +138,6 @@
min-width: min-content;
}
contents {
max-height: 100vh;
overflow-y: auto;
}
</style>
<Layout fullscreen={ true } header={false} footer={ false }>

63
client/bando/Djenterator.svelte

@ -1,15 +1,11 @@
<script>
import { push, link } from 'svelte-spa-router';
import { onMount } from 'svelte';
import template from "lodash/template";
import { fade } from "svelte/transition";
import Icon from "$/client/components/Icon.svelte";
import api from "$/client/api.js";
export let template_file = "";
let showing_rendered = false;
let user_info = {};
let results = "";
let source = "";
let variable_json = "{ }";
@ -19,16 +15,6 @@
let notice = "";
let last_good = "";
$: if(variable_json) render_template();
// this reload the templates when you click on a new one
$: if(template_file) re_render(template_file);
const re_render = async (what) => {
await load_variables(what);
await load_template(what);
}
const render_template = () => {
try {
// avoid rendering when the current template doesn't match the renderer
@ -37,7 +23,7 @@
results = renderer(variables);
notice = "";
last_good = results;
}
}
return true;
} catch(err) {
@ -52,7 +38,7 @@
if(res.status == 200) {
variable_json = await res.text();
} else {
} else {
variable_json = '{}';
notice = `No ${template_name}.vars file found. ${res.status}`;
}
@ -74,7 +60,7 @@
notice = `${error.message}`;
results = source;
}
} else {
} else {
notice = `Error loading ${template_name}: ${res.status}`;
}
}
@ -99,6 +85,17 @@
const canary = '3a025dba-1a62-4169-ae9f-f7cd4104c4f4';
console.log("Canary is compiled into build as", canary);
$: if(variable_json) render_template();
// this reload the templates when you click on a new one
const re_render = async (what) => {
await load_variables(what);
await load_template(what);
}
$: if(template_file) re_render(template_file);
</script>
<style>
@ -107,12 +104,19 @@
flex-direction: row;
}
pre {
position: relative;
height: 90vh;
max-height: 90vh;
overflow-y: auto;
}
right pre {
display: flex;
font-size: 1em;
flex-basis: 100%;
margin: 0px;
padding: 0px;
margin: 0;
padding: 0;
}
right pre code {
@ -121,7 +125,7 @@
flex-basis: 100%;
border-radius: 0px 4px 4px 0px;
line-height: unset;
margin: 0px;
margin: 0;
}
left {
@ -132,9 +136,11 @@
left textarea {
border-radius: 4px 0px 0px 4px;
margin: 0px;
margin: 0;
background-color: var(--color-secondary);
color: var(--color-bg);
height: 90vh;
max-height: 90vh;
}
right {
@ -174,18 +180,6 @@
padding-top: 0.5rem;
}
pre {
position: relative;
height: 90vh;
max-height: 90vh;
overflow-y: auto;
}
left textarea {
height: 90vh;
max-height: 90vh;
}
pre notice {
position: absolute;
bottom: 0;
@ -199,7 +193,6 @@
}
</style>
<main>
<left>
<textarea class="editor" bind:value={ variable_json } rows="15"></textarea>
@ -227,5 +220,3 @@
</pre>
</right>
</main>

6
client/bando/IconFinder.svelte

@ -11,12 +11,13 @@
export let tight=false;
let message = "";
$: search_icons(search);
const search_icons = (pattern) => {
icons = all_icons.filter(i => i.includes(pattern));
}
$: search_icons(search);
const gen_code = (name) => {
let results = `<Icon name="${name}" size="${size}" />`;
@ -70,7 +71,7 @@
search-bar input#search {
min-width: 30ch;
max-wdith: 30ch;
max-width: 30ch;
width: 30ch;
}
@ -89,7 +90,6 @@
grid-template-columns: repeat(3, 1fr);
}
}
</style>
<search-bar>

Loading…
Cancel
Save