This commit is contained in:
2025-10-14 21:32:35 +02:00
commit 8bceae2396
22 changed files with 2587 additions and 0 deletions

24
.gitignore vendored Normal file
View File

@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

3
.vscode/extensions.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"recommendations": ["svelte.svelte-vscode"]
}

47
README.md Normal file
View File

@ -0,0 +1,47 @@
# Svelte + TS + Vite
This template should help get you started developing with Svelte and TypeScript in Vite.
## Recommended IDE Setup
[VS Code](https://code.visualstudio.com/) + [Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).
## Need an official Svelte framework?
Check out [SvelteKit](https://github.com/sveltejs/kit#readme), which is also powered by Vite. Deploy anywhere with its serverless-first approach and adapt to various platforms, with out of the box support for TypeScript, SCSS, and Less, and easily-added support for mdsvex, GraphQL, PostCSS, Tailwind CSS, and more.
## Technical considerations
**Why use this over SvelteKit?**
- It brings its own routing solution which might not be preferable for some users.
- It is first and foremost a framework that just happens to use Vite under the hood, not a Vite app.
This template contains as little as possible to get started with Vite + TypeScript + Svelte, while taking into account the developer experience with regards to HMR and intellisense. It demonstrates capabilities on par with the other `create-vite` templates and is a good starting point for beginners dipping their toes into a Vite + Svelte project.
Should you later need the extended capabilities and extensibility provided by SvelteKit, the template has been structured similarly to SvelteKit so that it is easy to migrate.
**Why `global.d.ts` instead of `compilerOptions.types` inside `jsconfig.json` or `tsconfig.json`?**
Setting `compilerOptions.types` shuts out all other types not explicitly listed in the configuration. Using triple-slash references keeps the default TypeScript setting of accepting type information from the entire workspace, while also adding `svelte` and `vite/client` type information.
**Why include `.vscode/extensions.json`?**
Other templates indirectly recommend extensions via the README, but this file allows VS Code to prompt the user to install the recommended extension upon opening the project.
**Why enable `allowJs` in the TS template?**
While `allowJs: false` would indeed prevent the use of `.js` files in the project, it does not prevent the use of JavaScript syntax in `.svelte` files. In addition, it would force `checkJs: false`, bringing the worst of both worlds: not being able to guarantee the entire codebase is TypeScript, and also having worse typechecking for the existing JavaScript. In addition, there are valid use cases in which a mixed codebase may be relevant.
**Why is HMR not preserving my local component state?**
HMR state preservation comes with a number of gotchas! It has been disabled by default in both `svelte-hmr` and `@sveltejs/vite-plugin-svelte` due to its often surprising behavior. You can read the details [here](https://github.com/rixo/svelte-hmr#svelte-hmr).
If you have state that's important to retain within a component, consider creating an external store which would not be replaced by HMR.
```ts
// store.ts
// An extremely simple external store
import { writable } from 'svelte/store'
export default writable(0)
```

13
index.html Normal file
View File

@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>oldboy</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

36
package.json Normal file
View File

@ -0,0 +1,36 @@
{
"name": "oldboy",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json"
},
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "^6.2.1",
"@tsconfig/svelte": "^5.0.5",
"@types/node": "^24.6.0",
"@types/pako": "^2.0.4",
"svelte": "^5.39.6",
"svelte-check": "^4.3.2",
"typescript": "~5.9.3",
"vite": "npm:rolldown-vite@7.1.14"
},
"pnpm": {
"overrides": {
"vite": "npm:rolldown-vite@7.1.14"
}
},
"dependencies": {
"@codemirror/lang-css": "^6.3.1",
"@codemirror/lang-html": "^6.4.11",
"@codemirror/lang-javascript": "^6.2.4",
"@codemirror/theme-one-dark": "^6.1.3",
"@csound/browser": "7.0.0-beta11",
"codemirror": "^6.0.2",
"pako": "^2.1.0"
}
}

1380
pnpm-lock.yaml generated Normal file

File diff suppressed because it is too large Load Diff

1
public/vite.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

47
src/App.svelte Normal file
View File

@ -0,0 +1,47 @@
<script lang="ts">
import svelteLogo from './assets/svelte.svg'
import viteLogo from '/vite.svg'
import Counter from './lib/Counter.svelte'
</script>
<main>
<div>
<a href="https://vite.dev" target="_blank" rel="noreferrer">
<img src={viteLogo} class="logo" alt="Vite Logo" />
</a>
<a href="https://svelte.dev" target="_blank" rel="noreferrer">
<img src={svelteLogo} class="logo svelte" alt="Svelte Logo" />
</a>
</div>
<h1>Vite + Svelte</h1>
<div class="card">
<Counter />
</div>
<p>
Check out <a href="https://github.com/sveltejs/kit#readme" target="_blank" rel="noreferrer">SvelteKit</a>, the official Svelte app framework powered by Vite!
</p>
<p class="read-the-docs">
Click on the Vite and Svelte logos to learn more
</p>
</main>
<style>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.svelte:hover {
filter: drop-shadow(0 0 2em #ff3e00aa);
}
.read-the-docs {
color: #888;
}
</style>

79
src/app.css Normal file
View File

@ -0,0 +1,79 @@
:root {
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;
color-scheme: light dark;
color: rgba(255, 255, 255, 0.87);
background-color: #242424;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}
body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
min-height: 100vh;
}
h1 {
font-size: 3.2em;
line-height: 1.1;
}
.card {
padding: 2em;
}
#app {
max-width: 1280px;
margin: 0 auto;
padding: 2rem;
text-align: center;
}
button {
border-radius: 8px;
border: 1px solid transparent;
padding: 0.6em 1.2em;
font-size: 1em;
font-weight: 500;
font-family: inherit;
background-color: #1a1a1a;
cursor: pointer;
transition: border-color 0.25s;
}
button:hover {
border-color: #646cff;
}
button:focus,
button:focus-visible {
outline: 4px auto -webkit-focus-ring-color;
}
@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}

1
src/assets/svelte.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="26.6" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 308"><path fill="#FF3E00" d="M239.682 40.707C211.113-.182 154.69-12.301 113.895 13.69L42.247 59.356a82.198 82.198 0 0 0-37.135 55.056a86.566 86.566 0 0 0 8.536 55.576a82.425 82.425 0 0 0-12.296 30.719a87.596 87.596 0 0 0 14.964 66.244c28.574 40.893 84.997 53.007 125.787 27.016l71.648-45.664a82.182 82.182 0 0 0 37.135-55.057a86.601 86.601 0 0 0-8.53-55.577a82.409 82.409 0 0 0 12.29-30.718a87.573 87.573 0 0 0-14.963-66.244"></path><path fill="#FFF" d="M106.889 270.841c-23.102 6.007-47.497-3.036-61.103-22.648a52.685 52.685 0 0 1-9.003-39.85a49.978 49.978 0 0 1 1.713-6.693l1.35-4.115l3.671 2.697a92.447 92.447 0 0 0 28.036 14.007l2.663.808l-.245 2.659a16.067 16.067 0 0 0 2.89 10.656a17.143 17.143 0 0 0 18.397 6.828a15.786 15.786 0 0 0 4.403-1.935l71.67-45.672a14.922 14.922 0 0 0 6.734-9.977a15.923 15.923 0 0 0-2.713-12.011a17.156 17.156 0 0 0-18.404-6.832a15.78 15.78 0 0 0-4.396 1.933l-27.35 17.434a52.298 52.298 0 0 1-14.553 6.391c-23.101 6.007-47.497-3.036-61.101-22.649a52.681 52.681 0 0 1-9.004-39.849a49.428 49.428 0 0 1 22.34-33.114l71.664-45.677a52.218 52.218 0 0 1 14.563-6.398c23.101-6.007 47.497 3.036 61.101 22.648a52.685 52.685 0 0 1 9.004 39.85a50.559 50.559 0 0 1-1.713 6.692l-1.35 4.116l-3.67-2.693a92.373 92.373 0 0 0-28.037-14.013l-2.664-.809l.246-2.658a16.099 16.099 0 0 0-2.89-10.656a17.143 17.143 0 0 0-18.398-6.828a15.786 15.786 0 0 0-4.402 1.935l-71.67 45.674a14.898 14.898 0 0 0-6.73 9.975a15.9 15.9 0 0 0 2.709 12.012a17.156 17.156 0 0 0 18.404 6.832a15.841 15.841 0 0 0 4.402-1.935l27.345-17.427a52.147 52.147 0 0 1 14.552-6.397c23.101-6.006 47.497 3.037 61.102 22.65a52.681 52.681 0 0 1 9.003 39.848a49.453 49.453 0 0 1-22.34 33.12l-71.664 45.673a52.218 52.218 0 0 1-14.563 6.398"></path></svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

10
src/lib/Counter.svelte Normal file
View File

@ -0,0 +1,10 @@
<script lang="ts">
let count: number = $state(0)
const increment = () => {
count += 1
}
</script>
<button onclick={increment}>
count is {count}
</button>

View File

@ -0,0 +1,166 @@
import pako from 'pako';
import type { CsoundProject, CompressedProject } from './types';
const COMPRESSION_VERSION = 1;
/**
* Convert a string to a Uint8Array
*/
function stringToUint8Array(str: string): Uint8Array {
const encoder = new TextEncoder();
return encoder.encode(str);
}
/**
* Convert a Uint8Array to a string
*/
function uint8ArrayToString(arr: Uint8Array): string {
const decoder = new TextDecoder();
return decoder.decode(arr);
}
/**
* Convert Uint8Array to base64 string (URL-safe)
*/
function uint8ArrayToBase64(arr: Uint8Array): string {
let binary = '';
const len = arr.byteLength;
for (let i = 0; i < len; i++) {
binary += String.fromCharCode(arr[i]);
}
return btoa(binary)
.replace(/\+/g, '-')
.replace(/\//g, '_')
.replace(/=/g, '');
}
/**
* Convert base64 string (URL-safe) to Uint8Array
*/
function base64ToUint8Array(base64: string): Uint8Array {
// Restore standard base64
const standardBase64 = base64
.replace(/-/g, '+')
.replace(/_/g, '/');
// Add padding if needed
const padding = '='.repeat((4 - (standardBase64.length % 4)) % 4);
const paddedBase64 = standardBase64 + padding;
const binary = atob(paddedBase64);
const len = binary.length;
const arr = new Uint8Array(len);
for (let i = 0; i < len; i++) {
arr[i] = binary.charCodeAt(i);
}
return arr;
}
/**
* Compress a project to a base64 string for sharing
*/
export function compressProject(project: CsoundProject): CompressedProject {
try {
// Convert project to JSON string
const jsonString = JSON.stringify(project);
// Convert to Uint8Array
const uint8Array = stringToUint8Array(jsonString);
// Compress using pako (gzip)
const compressed = pako.deflate(uint8Array, { level: 9 });
// Convert to base64
const base64 = uint8ArrayToBase64(compressed);
return {
data: base64,
version: COMPRESSION_VERSION,
};
} catch (error) {
throw new Error(`Failed to compress project: ${error instanceof Error ? error.message : 'Unknown error'}`);
}
}
/**
* Decompress a base64 string back to a project
*/
export function decompressProject(compressed: CompressedProject): CsoundProject {
try {
// Check version compatibility
if (compressed.version !== COMPRESSION_VERSION) {
throw new Error(`Unsupported compression version: ${compressed.version}`);
}
// Convert base64 to Uint8Array
const uint8Array = base64ToUint8Array(compressed.data);
// Decompress using pako
const decompressed = pako.inflate(uint8Array);
// Convert to string
const jsonString = uint8ArrayToString(decompressed);
// Parse JSON
const project = JSON.parse(jsonString) as CsoundProject;
// Validate that we have the required fields
if (!project.id || !project.title || !project.content === undefined) {
throw new Error('Invalid project data structure');
}
return project;
} catch (error) {
throw new Error(`Failed to decompress project: ${error instanceof Error ? error.message : 'Unknown error'}`);
}
}
/**
* Create a shareable URL from a project
*/
export function projectToShareUrl(project: CsoundProject, baseUrl: string = window.location.origin): string {
const compressed = compressProject(project);
const params = new URLSearchParams({
v: compressed.version.toString(),
d: compressed.data,
});
return `${baseUrl}?${params.toString()}`;
}
/**
* Extract a project from a URL
*/
export function projectFromShareUrl(url: string): CsoundProject {
try {
const urlObj = new URL(url);
const params = urlObj.searchParams;
const version = parseInt(params.get('v') || '1', 10);
const data = params.get('d');
if (!data) {
throw new Error('No project data found in URL');
}
const compressed: CompressedProject = { version, data };
return decompressProject(compressed);
} catch (error) {
throw new Error(`Failed to parse project from URL: ${error instanceof Error ? error.message : 'Unknown error'}`);
}
}
/**
* Calculate the approximate compression ratio
*/
export function getCompressionRatio(project: CsoundProject): number {
const original = JSON.stringify(project);
const compressed = compressProject(project);
const originalSize = new TextEncoder().encode(original).length;
const compressedSize = base64ToUint8Array(compressed.data).length;
return originalSize / compressedSize;
}

View File

@ -0,0 +1,233 @@
import type { CsoundProject } from './types';
const DB_NAME = 'csound-projects-db';
const DB_VERSION = 1;
const STORE_NAME = 'projects';
/**
* Database wrapper for IndexedDB operations
*/
class ProjectDatabase {
private db: IDBDatabase | null = null;
private initPromise: Promise<void> | null = null;
/**
* Initialize the database connection
*/
async init(): Promise<void> {
if (this.db) {
return;
}
if (this.initPromise) {
return this.initPromise;
}
this.initPromise = new Promise((resolve, reject) => {
const request = indexedDB.open(DB_NAME, DB_VERSION);
request.onerror = () => {
reject(new Error(`Failed to open database: ${request.error?.message}`));
};
request.onsuccess = () => {
this.db = request.result;
resolve();
};
request.onupgradeneeded = (event) => {
const db = (event.target as IDBOpenDBRequest).result;
// Create object store if it doesn't exist
if (!db.objectStoreNames.contains(STORE_NAME)) {
const objectStore = db.createObjectStore(STORE_NAME, {
keyPath: 'id',
});
// Create indexes for efficient querying
objectStore.createIndex('title', 'title', { unique: false });
objectStore.createIndex('author', 'author', { unique: false });
objectStore.createIndex('dateCreated', 'dateCreated', { unique: false });
objectStore.createIndex('dateModified', 'dateModified', { unique: false });
objectStore.createIndex('tags', 'tags', { unique: false, multiEntry: true });
}
};
});
return this.initPromise;
}
/**
* Ensure database is initialized
*/
private async ensureDb(): Promise<IDBDatabase> {
await this.init();
if (!this.db) {
throw new Error('Database not initialized');
}
return this.db;
}
/**
* Get a project by ID
*/
async get(id: string): Promise<CsoundProject | null> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readonly');
const store = transaction.objectStore(STORE_NAME);
const request = store.get(id);
request.onsuccess = () => {
resolve(request.result || null);
};
request.onerror = () => {
reject(new Error(`Failed to get project: ${request.error?.message}`));
};
});
}
/**
* Get all projects
*/
async getAll(): Promise<CsoundProject[]> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readonly');
const store = transaction.objectStore(STORE_NAME);
const request = store.getAll();
request.onsuccess = () => {
resolve(request.result || []);
};
request.onerror = () => {
reject(new Error(`Failed to get all projects: ${request.error?.message}`));
};
});
}
/**
* Save or update a project
*/
async put(project: CsoundProject): Promise<void> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readwrite');
const store = transaction.objectStore(STORE_NAME);
const request = store.put(project);
request.onsuccess = () => {
resolve();
};
request.onerror = () => {
reject(new Error(`Failed to save project: ${request.error?.message}`));
};
});
}
/**
* Delete a project by ID
*/
async delete(id: string): Promise<void> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readwrite');
const store = transaction.objectStore(STORE_NAME);
const request = store.delete(id);
request.onsuccess = () => {
resolve();
};
request.onerror = () => {
reject(new Error(`Failed to delete project: ${request.error?.message}`));
};
});
}
/**
* Search projects by tag
*/
async getByTag(tag: string): Promise<CsoundProject[]> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readonly');
const store = transaction.objectStore(STORE_NAME);
const index = store.index('tags');
const request = index.getAll(tag);
request.onsuccess = () => {
resolve(request.result || []);
};
request.onerror = () => {
reject(new Error(`Failed to get projects by tag: ${request.error?.message}`));
};
});
}
/**
* Search projects by author
*/
async getByAuthor(author: string): Promise<CsoundProject[]> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readonly');
const store = transaction.objectStore(STORE_NAME);
const index = store.index('author');
const request = index.getAll(author);
request.onsuccess = () => {
resolve(request.result || []);
};
request.onerror = () => {
reject(new Error(`Failed to get projects by author: ${request.error?.message}`));
};
});
}
/**
* Clear all projects (use with caution!)
*/
async clear(): Promise<void> {
const db = await this.ensureDb();
return new Promise((resolve, reject) => {
const transaction = db.transaction([STORE_NAME], 'readwrite');
const store = transaction.objectStore(STORE_NAME);
const request = store.clear();
request.onsuccess = () => {
resolve();
};
request.onerror = () => {
reject(new Error(`Failed to clear projects: ${request.error?.message}`));
};
});
}
/**
* Close the database connection
*/
close(): void {
if (this.db) {
this.db.close();
this.db = null;
this.initPromise = null;
}
}
}
// Export singleton instance
export const projectDb = new ProjectDatabase();

View File

@ -0,0 +1,56 @@
/**
* Csound Project Management System
*
* This module provides a complete project system for managing Csound code files
* with browser-based storage (IndexedDB) and import/export functionality via
* compressed URLs.
*
* @example
* ```typescript
* import { projectManager } from './lib/project-system';
*
* // Initialize
* await projectManager.init();
*
* // Create a new project
* const result = await projectManager.createProject({
* title: 'My First Csound Project',
* author: 'John Doe',
* content: '<CsoundSynthesizer>...</CsoundSynthesizer>',
* tags: ['synth', 'experiment']
* });
*
* // Get all projects
* const projects = await projectManager.getAllProjects();
*
* // Export to shareable URL
* const urlResult = await projectManager.exportProjectToUrl(result.data.id);
*
* // Import from URL
* const imported = await projectManager.importProjectFromUrl(url);
* ```
*/
// Export types
export type {
CsoundProject,
CreateProjectData,
UpdateProjectData,
CompressedProject,
Result,
} from './types';
// Export main API
export { ProjectManager, projectManager } from './project-manager';
// Export database (for advanced usage)
export { projectDb } from './db';
// Export compression utilities (for advanced usage)
export {
compressProject,
decompressProject,
projectToShareUrl,
projectFromShareUrl,
getCompressionRatio,
} from './compression';

View File

@ -0,0 +1,343 @@
import type { CsoundProject, CreateProjectData, UpdateProjectData, Result } from './types';
import { projectDb } from './db';
import { compressProject, decompressProject, projectToShareUrl, projectFromShareUrl } from './compression';
const CSOUND_VERSION = '7.0.0'; // This should be detected from @csound/browser
/**
* Generate a unique ID for a project
*/
function generateId(): string {
return `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
}
/**
* Get the current ISO timestamp
*/
function getCurrentTimestamp(): string {
return new Date().toISOString();
}
/**
* Project Manager - Main API for managing Csound projects
*/
export class ProjectManager {
/**
* Initialize the project manager (initializes database)
*/
async init(): Promise<void> {
await projectDb.init();
}
/**
* Create a new project
*/
async createProject(data: CreateProjectData): Promise<Result<CsoundProject>> {
try {
const now = getCurrentTimestamp();
const project: CsoundProject = {
id: generateId(),
title: data.title,
author: data.author,
dateCreated: now,
dateModified: now,
saveCount: 0,
content: data.content || '',
tags: data.tags || [],
csoundVersion: CSOUND_VERSION,
};
await projectDb.put(project);
return { success: true, data: project };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to create project'),
};
}
}
/**
* Get a project by ID
*/
async getProject(id: string): Promise<Result<CsoundProject>> {
try {
const project = await projectDb.get(id);
if (!project) {
return {
success: false,
error: new Error(`Project not found: ${id}`),
};
}
return { success: true, data: project };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to get project'),
};
}
}
/**
* Get all projects
*/
async getAllProjects(): Promise<Result<CsoundProject[]>> {
try {
const projects = await projectDb.getAll();
return { success: true, data: projects };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to get projects'),
};
}
}
/**
* Update an existing project
*/
async updateProject(data: UpdateProjectData): Promise<Result<CsoundProject>> {
try {
const existingProject = await projectDb.get(data.id);
if (!existingProject) {
return {
success: false,
error: new Error(`Project not found: ${data.id}`),
};
}
const updatedProject: CsoundProject = {
...existingProject,
...(data.title !== undefined && { title: data.title }),
...(data.author !== undefined && { author: data.author }),
...(data.content !== undefined && { content: data.content }),
...(data.tags !== undefined && { tags: data.tags }),
dateModified: getCurrentTimestamp(),
saveCount: existingProject.saveCount + 1,
};
await projectDb.put(updatedProject);
return { success: true, data: updatedProject };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to update project'),
};
}
}
/**
* Delete a project
*/
async deleteProject(id: string): Promise<Result<void>> {
try {
await projectDb.delete(id);
return { success: true, data: undefined };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to delete project'),
};
}
}
/**
* Search projects by tag
*/
async getProjectsByTag(tag: string): Promise<Result<CsoundProject[]>> {
try {
const projects = await projectDb.getByTag(tag);
return { success: true, data: projects };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to search projects by tag'),
};
}
}
/**
* Search projects by author
*/
async getProjectsByAuthor(author: string): Promise<Result<CsoundProject[]>> {
try {
const projects = await projectDb.getByAuthor(author);
return { success: true, data: projects };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to search projects by author'),
};
}
}
/**
* Export a project to a shareable URL
*/
async exportProjectToUrl(id: string, baseUrl?: string): Promise<Result<string>> {
try {
const project = await projectDb.get(id);
if (!project) {
return {
success: false,
error: new Error(`Project not found: ${id}`),
};
}
const url = projectToShareUrl(project, baseUrl);
return { success: true, data: url };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to export project'),
};
}
}
/**
* Export a project to compressed data (for copying to clipboard, etc.)
*/
async exportProjectToCompressed(id: string): Promise<Result<string>> {
try {
const project = await projectDb.get(id);
if (!project) {
return {
success: false,
error: new Error(`Project not found: ${id}`),
};
}
const compressed = compressProject(project);
return { success: true, data: compressed.data };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to export project'),
};
}
}
/**
* Import a project from a URL
*/
async importProjectFromUrl(url: string): Promise<Result<CsoundProject>> {
try {
const project = projectFromShareUrl(url);
// Generate a new ID and reset timestamps
const now = getCurrentTimestamp();
const importedProject: CsoundProject = {
...project,
id: generateId(),
dateCreated: now,
dateModified: now,
saveCount: 0,
title: `${project.title} (imported)`,
};
await projectDb.put(importedProject);
return { success: true, data: importedProject };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to import project'),
};
}
}
/**
* Import a project from compressed data
*/
async importProjectFromCompressed(compressedData: string): Promise<Result<CsoundProject>> {
try {
const project = decompressProject({
data: compressedData,
version: 1,
});
// Generate a new ID and reset timestamps
const now = getCurrentTimestamp();
const importedProject: CsoundProject = {
...project,
id: generateId(),
dateCreated: now,
dateModified: now,
saveCount: 0,
title: `${project.title} (imported)`,
};
await projectDb.put(importedProject);
return { success: true, data: importedProject };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to import project'),
};
}
}
/**
* Duplicate a project
*/
async duplicateProject(id: string): Promise<Result<CsoundProject>> {
try {
const originalProject = await projectDb.get(id);
if (!originalProject) {
return {
success: false,
error: new Error(`Project not found: ${id}`),
};
}
const now = getCurrentTimestamp();
const duplicatedProject: CsoundProject = {
...originalProject,
id: generateId(),
title: `${originalProject.title} (copy)`,
dateCreated: now,
dateModified: now,
saveCount: 0,
};
await projectDb.put(duplicatedProject);
return { success: true, data: duplicatedProject };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to duplicate project'),
};
}
}
/**
* Clear all projects (use with caution!)
*/
async clearAllProjects(): Promise<Result<void>> {
try {
await projectDb.clear();
return { success: true, data: undefined };
} catch (error) {
return {
success: false,
error: error instanceof Error ? error : new Error('Failed to clear projects'),
};
}
}
}
// Export singleton instance
export const projectManager = new ProjectManager();

View File

@ -0,0 +1,70 @@
/**
* Core data structure for a Csound project
*/
export interface CsoundProject {
/** Unique identifier for the project */
id: string;
/** User-defined project title */
title: string;
/** Project author name */
author: string;
/** Date when the project was created (ISO string) */
dateCreated: string;
/** Date when the project was last modified (ISO string) */
dateModified: string;
/** Number of times the project has been saved */
saveCount: number;
/** The Csound code content */
content: string;
/** Optional tags for categorization */
tags: string[];
/** Csound version used to create this project */
csoundVersion: string;
}
/**
* Data structure for creating a new project (omits auto-generated fields)
*/
export interface CreateProjectData {
title: string;
author: string;
content?: string;
tags?: string[];
}
/**
* Data structure for updating an existing project
*/
export interface UpdateProjectData {
id: string;
title?: string;
author?: string;
content?: string;
tags?: string[];
}
/**
* Compressed project data for import/export via links
*/
export interface CompressedProject {
/** Base64-encoded compressed project data */
data: string;
/** Version of the compression format (for future compatibility) */
version: number;
}
/**
* Result type for async operations
*/
export type Result<T, E = Error> =
| { success: true; data: T }
| { success: false; error: E };

9
src/main.ts Normal file
View File

@ -0,0 +1,9 @@
import { mount } from 'svelte'
import './app.css'
import App from './App.svelte'
const app = mount(App, {
target: document.getElementById('app')!,
})
export default app

8
svelte.config.js Normal file
View File

@ -0,0 +1,8 @@
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
/** @type {import("@sveltejs/vite-plugin-svelte").SvelteConfig} */
export default {
// Consult https://svelte.dev/docs#compile-time-svelte-preprocess
// for more information about preprocessors
preprocess: vitePreprocess(),
}

21
tsconfig.app.json Normal file
View File

@ -0,0 +1,21 @@
{
"extends": "@tsconfig/svelte/tsconfig.json",
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"target": "ES2022",
"useDefineForClassFields": true,
"module": "ESNext",
"types": ["svelte", "vite/client"],
"noEmit": true,
/**
* Typecheck JS in `.svelte` and `.js` files by default.
* Disable checkJs if you'd like to use dynamic types in JS.
* Note that setting allowJs false does not prevent the use
* of JS in `.svelte` files.
*/
"allowJs": true,
"checkJs": true,
"moduleDetection": "force"
},
"include": ["src/**/*.ts", "src/**/*.js", "src/**/*.svelte"]
}

7
tsconfig.json Normal file
View File

@ -0,0 +1,7 @@
{
"files": [],
"references": [
{ "path": "./tsconfig.app.json" },
{ "path": "./tsconfig.node.json" }
]
}

26
tsconfig.node.json Normal file
View File

@ -0,0 +1,26 @@
{
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
"target": "ES2023",
"lib": ["ES2023"],
"module": "ESNext",
"types": ["node"],
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"verbatimModuleSyntax": true,
"moduleDetection": "force",
"noEmit": true,
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"erasableSyntaxOnly": true,
"noFallthroughCasesInSwitch": true,
"noUncheckedSideEffectImports": true
},
"include": ["vite.config.ts"]
}

7
vite.config.ts Normal file
View File

@ -0,0 +1,7 @@
import { defineConfig } from 'vite'
import { svelte } from '@sveltejs/vite-plugin-svelte'
// https://vite.dev/config/
export default defineConfig({
plugins: [svelte()],
})