🧱 Inicio

enflujo · Dec 2, 2024 · cfd457e · cfd457e
commit cfd457e
Show file tree

Hide file tree

Showing 30 changed files with 3,923 additions and 0 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,10 @@
+root = true
+
+[*]
+end_of_line = lf
+insert_final_newline = true
+
+[*.{js,json,yml}]
+charset = utf-8
+indent_style = space
+indent_size = 2
diff --git a/.gitattributes b/.gitattributes
@@ -0,0 +1,4 @@
+/.yarn/**            linguist-vendored
+/.yarn/releases/*    binary
+/.yarn/plugins/**/*  binary
+/.pnp.*              binary linguist-generated
diff --git a/.github/workflows/despliegue.yml b/.github/workflows/despliegue.yml
@@ -0,0 +1,59 @@
+name: 🐘 Despliegue
+
+on:
+  push:
+    branches: ['main']
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  build:
+    name: 🐘 Desplegar
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: 🐯 Obtener código del repositorio
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: 🐜 Activar Corepack
+        run: corepack enable
+
+      - name: 🐝 Usar Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+          cache: 'yarn'
+          cache-dependency-path: './yarn.lock'
+
+      - name: 🦒 Instalar dependencias y hacer build
+        run: |
+          yarn install --immutable
+          yarn build
+
+      - name: 🐉 Configurar Servidor
+        id: pages
+        uses: actions/configure-pages@v5
+
+      - name: 🕸 Subir archivos exportados
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: publico
+
+  deploy:
+    name: 🦅 Despliegue a servidores de Github
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: 🦈 Mandar archivos transpilados al servidor de Github Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/.github/workflows/estilo-codigo.yml b/.github/workflows/estilo-codigo.yml
@@ -0,0 +1,35 @@
+name: 🐾 Estilo Código
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  ci:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: 🐯 Obtener código del repositorio
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: 🐜 Activar Corepack
+        run: corepack enable
+
+      - name: 🐝 Usar Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+          cache: 'yarn'
+
+      - name: 🦒 Instalar dependencias
+        run: |
+          yarn install --immutable
+
+      - name: 👀 Buscar errores
+        run: yarn lint
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,30 @@
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+publico
+dist-ssr
+*.local
+
+.vscode/*
+!.vscode/extensions.json
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Ver documentación de Yarn moderno (> v2): https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
+.yarn/*
+!.yarn/cache
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1 @@
+publico
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,7 @@
+{
+  "singleQuote": true,
+  "printWidth": 120,
+  "tabWidth": 2,
+  "endOfLine": "auto",
+  "trailingComma": "es5"
+}
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -0,0 +1 @@
+nodeLinker: node-modules
diff --git a/README.md b/README.md
@@ -0,0 +1,5 @@
+# Pantallas y Pixeles
+
+![Estilo Código](https://github.com/enflujo/enflujo-pantallas-pixeles/actions/workflows/estilo-codigo.yml/badge.svg)
+![Tamaño](https://img.shields.io/github/repo-size/enflujo/enflujo-pantallas-pixeles?color=%235757f7&label=Tama%C3%B1o%20repo&logo=open-access&logoColor=white)
+![Licencia](https://img.shields.io/github/license/enflujo/enflujo-pantallas-pixeles?label=Licencia&logo=open-source-initiative&logoColor=white)
diff --git a/estaticos/Nila.jpg b/estaticos/Nila.jpg
diff --git a/estaticos/apple-touch-icon.png b/estaticos/apple-touch-icon.png
diff --git a/estaticos/favicon.ico b/estaticos/favicon.ico
diff --git a/estaticos/favicon.svg b/estaticos/favicon.svg
diff --git a/estaticos/icono_192.png b/estaticos/icono_192.png
diff --git a/estaticos/icono_512.png b/estaticos/icono_512.png
diff --git a/estaticos/sitio.webmanifest b/estaticos/sitio.webmanifest
@@ -0,0 +1,8 @@
+{
+  "name": "Laboratorio EnFlujo",
+  "short_name": "EnFlujo",
+  "icons": [
+    { "src": "/icono_192.png", "sizes": "192x192", "type": "image/png" },
+    { "src": "/icono_512.png", "sizes": "512x512", "type": "image/png" }
+  ]
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,97 @@
+<!doctype html>
+<html lang="es">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+    <link rel="manifest" href="/sitio.webmanifest" />
+    <!-- <link rel="canonical" href="https://enflujo.com" /> -->
+
+    <title>..:: Pixeles | EnFlujo ::..</title>
+    <!-- <meta name="description" content="Descripción del sitio...." /> -->
+
+    <!-- OpenGraph -->
+    <meta property="og:locale" content="es_CO" />
+    <!-- <meta property="og:site_name" content="EnFlujo" /> -->
+    <meta property="og:type" content="website" />
+    <!-- <meta property="og:url" content="https://enflujo.com" /> -->
+    <!-- <meta property="og:title" content="Titulo ..." /> -->
+    <!-- <meta property="og:description" content="Descripción ..." /> -->
+    <!-- <meta property="og:image" content="https://xxxxxx.jpg" /> -->
+    <!-- <meta property="og:image:alt" content="Texto que describe la imagen" /> -->
+    <!-- <meta property="og:image:width" content="1200" /> -->
+    <!-- <meta property="og:image:height" content="630" /> -->
+
+    <!-- Twitter -->
+    <!-- <meta name="twitter:card" content="summary_large_image" /> -->
+    <!-- <meta name="twitter:site" content="@labenflujo" /> -->
+    <!-- <meta name="twitter:creator" content="@labenflujo" /> -->
+    <!-- <meta name="twitter:url" content="https://enflujo.com" /> -->
+    <!-- <meta name="twitter:title" content="Titulo ..." /> -->
+    <!-- <meta name="twitter:description" content="Descripción ..." /> -->
+    <!-- <meta name="twitter:image" content="https://xxxxxx.jpg" /> -->
+    <!-- <meta name="twitter:image:alt" content="Texto que describe la imagen" /> -->
+  </head>
+  <body>
+    <h1>Pantalla OLED 128x64 Monocromática</h1>
+    <main class="contenedor">
+      <div class="columna col1-5">
+        <input type="file" id="entredaImg" accept="image/*" />
+        <img id="nila" />
+        <section>
+          <h2>Algoritmos</h2>
+          <ul id="opcionesAlgoritmos">
+            <li data-llave="atkinson" class="seleccionado">Atkinson</li>
+            <li data-llave="floyd">Floyd-Steinberg</li>
+            <span class="separador"></span>
+            <li data-llave="burkes">Burkes</li>
+            <li data-llave="sierra">Sierra</li>
+            <li data-llave="stevensonArce">Stevenson Arce</li>
+            <li data-llave="jarvisJudiceNinke">Jarvis, Judice, and Ninke (JJN)</li>
+            <li data-llave="stucki">Stucki</li>
+            <li data-llave="ordenado">Ordenado</li>
+            <li data-llave="ordenadoMedioTono">Ordenado Medio Tono</li>
+          </ul>
+        </section>
+      </div>
+
+      <div class="columna col2-5">
+        <div id="oled">
+          <div class="marco">
+            <span class="hueco"></span>
+
+            <div class="pines">
+              <span>GND</span>
+              <span>VCC</span>
+              <span>D0</span>
+              <span>D1</span>
+              <span>RES</span>
+              <span>DC</span>
+              <span>CS</span>
+            </div>
+
+            <span class="hueco"></span>
+          </div>
+
+          <div class="pantalla">
+            <canvas id="lienzo"></canvas>
+          </div>
+
+          <div class="marco">
+            <span class="hueco"></span>
+
+            <span class="hueco"></span>
+          </div>
+        </div>
+      </div>
+
+      <div id="contenedorCodigo" class="columna col2-5">
+        <pre><code id="codigo" class="language-cpp"></code></pre>
+      </div>
+    </main>
+
+    <script type="module" src="/src/programa.ts"></script>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "enflujo-pantallas-pixeles",
+  "packageManager": "[email protected]",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite build && vite preview",
+    "lint": "prettier --check .",
+    "lint:fix": "prettier --write --list-different ."
+  },
+  "devDependencies": {
+    "@types/prismjs": "^1.26.5",
+    "autoprefixer": "^10.4.20",
+    "cssnano": "^7.0.6",
+    "postcss": "^8.4.49",
+    "prettier": "^3.4.1",
+    "sass": "^1.81.0",
+    "typescript": "^5.7.2",
+    "vite": "^6.0.1",
+    "vite-plugin-prismjs": "^0.0.11"
+  },
+  "dependencies": {
+    "prismjs": "^1.29.0"
+  }
+}
diff --git a/postcss.config.cjs b/postcss.config.cjs
@@ -0,0 +1,3 @@
+module.exports = {
+  plugins: [require('autoprefixer'), require('cssnano')({ preset: 'default' })],
+};