initial commit

.changeset/README.md

@@ -0,0 +1,8 @@
+# Changesets
+
+Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
+with multi-package repos, or single-package repos to help you version and publish your code. You can
+find the full documentation for it [in our repository](https://github.com/changesets/changesets)
+
+We have a quick list of common questions to get you started engaging with this project in
+[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)

.changeset/config.json

@@ -0,0 +1,11 @@
+{
+  "$schema": "https://unpkg.com/@changesets/config@3.0.0/schema.json",
+  "changelog": "@changesets/cli/changelog",
+  "commit": false,
+  "fixed": [],
+  "linked": [],
+  "access": "public",
+  "baseBranch": "main",
+  "updateInternalDependencies": "patch",
+  "ignore": ["@dudes/playground"]
+}

.github/workflows/gh-pages.yaml

@@ -0,0 +1,51 @@
+name: GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  cache-and-install:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+        id: pnpm-install
+        with:
+          version: 8
+          run_install: false
+
+      - name: Get pnpm store directory
+        id: pnpm-cache
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT
+
+      - name: Setup pnpm cache
+        uses: actions/cache@v3
+        with:
+          path: ${{ steps.pnpm-cache.outputs.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build
+        run: pnpm build
+
+      - name: Deploy to GitHub Pages
+        uses: JamesIves/github-pages-deploy-action@4.1.5
+        with:
+          branch: gh-pages
+          folder: ./apps/playground/dist

.github/workflows/npm-publish.yaml

@@ -0,0 +1,54 @@
+name: NPM Publish
+
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  id-token: write
+
+jobs:
+  cache-and-install:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+        id: pnpm-install
+        with:
+          version: 8
+          run_install: false
+
+      - name: Get pnpm store directory
+        id: pnpm-cache
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT
+
+      - name: Setup pnpm cache
+        uses: actions/cache@v3
+        with:
+          path: ${{ steps.pnpm-cache.outputs.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build packages
+        run: pnpm build
+
+      - name: Publish packages
+        shell: bash
+        run: |
+          echo "//registry.npmjs.org/:_authToken="${{ secrets.NPM_TOKEN }}"" > ~/.npmrc
+          pnpm -r --filter='./apps/*' publish --access public --provenance

.gitignore

@@ -0,0 +1,25 @@
+# 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?
+.turbo

.prettierignore

@@ -0,0 +1,24 @@
+node_modules
+dist
+public
+build
+logs
+coverage
+.next
+.turbo
+.github
+.angular
+.svelte-kit
+.vscode
+*.log*
+*.log
+*.lock
+*.yaml
+*.yml
+*.sh
+*.svg
+*rc.*
+*.htm
+*.html
+*.md
+.*ignore

.prettierrc.cjs

@@ -0,0 +1 @@
+module.exports = require('@crashmax/prettier-config')

.vscode/extensions.json

@@ -0,0 +1,6 @@
+{
+  "recommendations": [
+    "Vue.volar",
+    "Vue.vscode-typescript-vue-plugin"
+  ]
+}

README.md

@@ -0,0 +1,107 @@
+# Dudes
+
+> Animated dudes for chatters in your stream
+
+> [!WARNING]
+> Permantly moved to [twirapp/dudes](https://github.com/twirapp/dudes)
+
+## Install
+
+```bash
+pnpm add @twirapp/dudes
+```
+
+## Usage
+
+```vue
+<script setup lang="ts">
+import DudesOverlay, { DudesLayers } from '@twirapp/dudes'
+import { onMounted, ref } from 'vue'
+
+import type {
+  DudesStyles,
+  AssetsLoaderOptions,
+  SoundAsset
+} from '@twirapp/dudes/types'
+
+const soundAssets: SoundAsset[] = [
+  {
+    alias: 'Jump',
+    src: './sounds/jump.mp3'
+  }
+]
+
+const assetsLoaderOptions: AssetsLoaderOptions = {
+  basePath: location.href + 'sprites/',
+  defaultSearchParams: {
+    ts: Date.now()
+  }
+}
+
+const settings = ref<DudesStyles>({
+  // override default settings
+})
+
+const dudesRef = ref<DudesMethods | null>(null)
+
+onMounted(async () => {
+  if (!dudesRef.value) return
+  await dudesRef.value.initDudes()
+
+  const dudeName = 'Twir'
+  const dude = await dudesRef.value.createDude({
+    id: dudeName,
+    name,
+    sprite: {
+      name: 'dude',
+      layers: [
+        {
+          layer: DudesLayers.Body,
+          // http://localhost:5173/sprites/body.png
+          src: 'body.png'
+        },
+        {
+          layer: DudesLayers.Eyes,
+          // http://localhost:5173/sprites/eyes.png
+          src: 'eyes.png'
+        }
+      ]
+    }
+  })
+})
+</script>
+
+<template>
+  <dudes-overlay
+    ref="dudesRef"
+    :assets-loader-options="assetsLoaderOptions"
+    :sounds="soundAssets"
+    :settings="settings"
+  />
+</template>
+
+<style>
+* {
+  margin: 0;
+  box-sizing: border-box;
+}
+
+body {
+  overflow: hidden;
+  background: #000;
+}
+</style>
+```
+
+## Creating new sprites
+
+It's really easy to create sprites with [Aseprite](https://github.com/aseprite/aseprite)
+
+Sprite size is 32x32.
+
+Example can be found in [sprites](apps/playground/public/sprites) folder.
+
+## Useful links
+
+- [https://0x72.itch.io/pixeldudesmaker](https://0x72.itch.io/pixeldudesmaker)
+- [https://masterpose.itch.io/pixelduuuuudesmaker](https://masterpose.itch.io/pixelduuuuudesmaker)

apps/dudes/CHANGELOG.md

@@ -0,0 +1,50 @@
+# @twirapp/dudes
+
+## 1.1.2
+
+### Patch Changes
+
+- chore: lowercase layers and frametags names
+  chore: removed method `updateSettings`
+
+## 1.1.1
+
+### Patch Changes
+
+- fix: types
+
+## 1.1.0
+
+### Minor Changes
+
+- feat: refactor `createDude`
+
+## 1.0.2
+
+### Patch Changes
+
+- chore: refactor load/unload bundle
+
+## 1.0.1
+
+### Patch Changes
+
+- fix: idle animation
+
+## 1.0.0
+
+### Major Changes
+
+- feat: sprite builder
+
+## 0.6.1
+
+### Patch Changes
+
+- fix: collisions and types
+
+## 0.6.0
+
+### Minor Changes
+
+- chore: refactor

apps/dudes/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@twirapp/dudes",
+  "version": "1.1.2",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/dudes.js",
+      "require": "./dist/dudes.umd.cjs"
+    },
+    "./types": {
+      "types": "./dist/types.d.ts"
+    }
+  },
+  "scripts": {
+    "dev": "pnpm run \"/^watch:.*/\"",
+    "watch:build": "vite build --watch",
+    "watch:types": "pnpm types --watch",
+    "build": "vite build && pnpm types",
+    "types": "vue-tsc --declaration --emitDeclarationOnly "
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "5.0.4",
+    "vite": "5.1.5",
+    "vue-tsc": "2.0.6"
+  },
+  "peerDependencies": {
+    "vue": ">=3.0.0"
+  },
+  "dependencies": {
+    "@pixi/gif": "2.1.1",
+    "gsap": "3.12.5",
+    "pixi.js": "7.4.0",
+    "vue": "3.4.21"
+  }
+}