style fixes + remove lastShared state

This commit is contained in:
Felix Roos 2023-12-26 00:29:43 +01:00
parent 4c337a5114
commit 53484db768
4 changed files with 17 additions and 7 deletions

View file

@ -108,7 +108,17 @@ export function initEditor({ initialCode = '', onChange, onEvaluate, onStop, roo
export class StrudelMirror { export class StrudelMirror {
constructor(options) { constructor(options) {
const { root, id, initialCode = '', onDraw, drawTime = [-2, 2], autodraw, prebake, ...replOptions } = options; const {
root,
id,
initialCode = '',
onDraw,
drawTime = [-2, 2],
autodraw,
prebake,
bgFill = true,
...replOptions
} = options;
this.code = initialCode; this.code = initialCode;
this.root = root; this.root = root;
this.miniLocations = []; this.miniLocations = [];
@ -183,7 +193,9 @@ export class StrudelMirror {
const cmEditor = this.root.querySelector('.cm-editor'); const cmEditor = this.root.querySelector('.cm-editor');
if (cmEditor) { if (cmEditor) {
this.root.style.display = 'block'; this.root.style.display = 'block';
this.root.style.backgroundColor = 'var(--background)'; if (bgFill) {
this.root.style.backgroundColor = 'var(--background)';
}
cmEditor.style.backgroundColor = 'transparent'; cmEditor.style.backgroundColor = 'transparent';
} }
const settings = codemirrorSettings.get(); const settings = codemirrorSettings.get();

View file

@ -18,7 +18,6 @@ export function Header({ context }) {
started, started,
pending, pending,
isDirty, isDirty,
lastShared,
activeCode, activeCode,
handleTogglePlay, handleTogglePlay,
handleUpdate, handleUpdate,
@ -119,7 +118,7 @@ export function Header({ context }) {
onClick={handleShare} onClick={handleShare}
> >
<LinkIcon className="w-6 h-6" /> <LinkIcon className="w-6 h-6" />
<span>share{lastShared && lastShared === (activeCode || code) ? 'd!' : ''}</span> <span>share</span>
</button> </button>
)} )}
{!isEmbedded && ( {!isEmbedded && (

View file

@ -209,7 +209,6 @@ export function Repl({ embedded = false }) {
started, started,
pending, pending,
isDirty, isDirty,
lastShared,
activeCode, activeCode,
handleChangeCode, handleChangeCode,
handleTogglePlay, handleTogglePlay,

View file

@ -28,6 +28,7 @@ import { Panel } from './panel/Panel';
import { useStore } from '@nanostores/react'; import { useStore } from '@nanostores/react';
import { prebake /* , resetSounds */ } from './prebake.mjs'; import { prebake /* , resetSounds */ } from './prebake.mjs';
import { getRandomTune, initCode, loadModules, shareCode } from './util.mjs'; import { getRandomTune, initCode, loadModules, shareCode } from './util.mjs';
import './Repl.css';
const { code: randomTune, name } = getRandomTune(); const { code: randomTune, name } = getRandomTune();
export const ReplContext = createContext(null); export const ReplContext = createContext(null);
@ -50,7 +51,6 @@ if (typeof window !== 'undefined') {
export function Repl2({ embedded = false }) { export function Repl2({ embedded = false }) {
//const isEmbedded = embedded || window.location !== window.parent.location; //const isEmbedded = embedded || window.location !== window.parent.location;
const isEmbedded = false; const isEmbedded = false;
const [lastShared, setLastShared] = useState();
const { panelPosition, isZen } = useSettings(); const { panelPosition, isZen } = useSettings();
/* const replState = useStore($replstate); /* const replState = useStore($replstate);
const isDirty = useStore($repldirty); */ const isDirty = useStore($repldirty); */
@ -89,6 +89,7 @@ export function Repl2({ embedded = false }) {
setLatestCode(code); setLatestCode(code);
window.location.hash = '#' + code2hash(code); window.location.hash = '#' + code2hash(code);
}, },
bgFill: false,
}); });
// init settings // init settings
initCode().then((decoded) => { initCode().then((decoded) => {
@ -185,7 +186,6 @@ export function Repl2({ embedded = false }) {
started, started,
pending, pending,
isDirty, isDirty,
lastShared,
activeCode, activeCode,
handleTogglePlay, handleTogglePlay,
handleUpdate, handleUpdate,