diff --git a/whisper_live/.formatter.exs b/whisper_live/.formatter.exs new file mode 100644 index 00000000..e945e12b --- /dev/null +++ b/whisper_live/.formatter.exs @@ -0,0 +1,5 @@ +[ + import_deps: [:phoenix], + plugins: [Phoenix.LiveView.HTMLFormatter], + inputs: ["*.{heex,ex,exs}", "{config,lib,test}/**/*.{heex,ex,exs}"] +] diff --git a/whisper_live/.gitignore b/whisper_live/.gitignore new file mode 100644 index 00000000..8c9a7861 --- /dev/null +++ b/whisper_live/.gitignore @@ -0,0 +1,37 @@ +# The directory Mix will write compiled artifacts to. +/_build/ + +# If you run "mix test --cover", coverage assets end up here. +/cover/ + +# The directory Mix downloads your dependencies sources to. +/deps/ + +# Where 3rd-party dependencies like ExDoc output generated docs. +/doc/ + +# Ignore .fetch files in case you like to edit your project deps locally. +/.fetch + +# If the VM crashes, it generates a dump, let's ignore it too. +erl_crash.dump + +# Also ignore archive artifacts (built via "mix archive.build"). +*.ez + +# Temporary files, for example, from tests. +/tmp/ + +# Ignore package tarball (built via "mix hex.build"). +whisper_live-*.tar + +# Ignore assets that are produced by build tools. +/priv/static/assets/ + +# Ignore digested assets cache. +/priv/static/cache_manifest.json + +# In case you use Node.js/npm, you want to ignore these. +npm-debug.log +/assets/node_modules/ + diff --git a/whisper_live/README.md b/whisper_live/README.md new file mode 100644 index 00000000..ec1616f4 --- /dev/null +++ b/whisper_live/README.md @@ -0,0 +1,18 @@ +# WhisperLive + +To start your Phoenix server: + + * Run `mix setup` to install and setup dependencies + * Start Phoenix endpoint with `mix phx.server` or inside IEx with `iex -S mix phx.server` + +Now you can visit [`localhost:4004`](http://localhost:4004) from your browser. + +Ready to run in production? Please [check our deployment guides](https://hexdocs.pm/phoenix/deployment.html). + +## Learn more + + * Official website: https://www.phoenixframework.org/ + * Guides: https://hexdocs.pm/phoenix/overview.html + * Docs: https://hexdocs.pm/phoenix + * Forum: https://elixirforum.com/c/phoenix-forum + * Source: https://github.com/phoenixframework/phoenix diff --git a/whisper_live/assets/css/app.css b/whisper_live/assets/css/app.css new file mode 100644 index 00000000..e0d24ce1 --- /dev/null +++ b/whisper_live/assets/css/app.css @@ -0,0 +1,10 @@ +@import "tailwindcss/base"; +@import "tailwindcss/components"; +@import "tailwindcss/utilities"; + +/* This file is for your main application CSS */ +.realtime { + white-space: pre-wrap; + font-family: monospace; + margin-top: 1em; +} diff --git a/whisper_live/assets/js/app.js b/whisper_live/assets/js/app.js new file mode 100644 index 00000000..5e97f224 --- /dev/null +++ b/whisper_live/assets/js/app.js @@ -0,0 +1,118 @@ +// If you want to use Phoenix channels, run `mix help phx.gen.channel` +// to get started and then uncomment the line below. +// import "./user_socket.js" + +// You can include dependencies in two ways. +// +// The simplest option is to put them in assets/vendor and +// import them using relative paths: +// +// import "../vendor/some-package.js" +// +// Alternatively, you can `npm install some-package --prefix assets` and import +// them using a path starting with the package name: +// +// import "some-package" +// + +// Include phoenix_html to handle method=PUT/DELETE in forms and buttons. +import "phoenix_html" +// Establish Phoenix Socket and LiveView configuration. +import {Socket} from "phoenix" +import {LiveSocket} from "phoenix_live_view" +import topbar from "../vendor/topbar" + +let Hooks = {}; + +Hooks.RecorderHook = { + mounted() { + console.log("[RecorderHook] mounted") + const el = document.getElementById("transcription") + el.innerText = "🎤 Hook activo!" + + this.socket = null + this.audioContext = null + this.processor = null + this.mediaStream = null + this.buffer = [] + + this.handleEvent("start-recording", () => this.start()) + this.handleEvent("stop-recording", () => this.stop()) + }, + + start() { + this.socket = new WebSocket("ws://localhost:4000/ws/transcribe") + + this.socket.onopen = () => console.log("✅ WebSocket abierto") + this.socket.onmessage = (event) => { + const data = JSON.parse(event.data) + document.getElementById("transcription").innerText += " " + data.text + } + + navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => { + console.log("🎤 Micrófono OK") + this.audioContext = new AudioContext({ sampleRate: 48000 }) + this.mediaStream = stream + + const source = this.audioContext.createMediaStreamSource(stream) + this.processor = this.audioContext.createScriptProcessor(4096, 1, 1) + + source.connect(this.processor) + this.processor.connect(this.audioContext.destination) + + this.processor.onaudioprocess = (e) => { + const input = e.inputBuffer.getChannelData(0) + const pcm = new Int16Array(input.length) + for (let i = 0; i < input.length; i++) { + let s = Math.max(-1, Math.min(1, input[i])) + pcm[i] = s < 0 ? s * 0x8000 : s * 0x7FFF + } + + const uint8 = new Uint8Array(pcm.buffer) + if (this.socket.readyState === WebSocket.OPEN) { + this.socket.send(uint8) + } + } + + console.log("⏺️ Grabación iniciada") + }).catch(err => { + console.error("❌ Error acceso micrófono", err) + }) + }, + + stop() { + if (this.processor) this.processor.disconnect() + if (this.audioContext) this.audioContext.close() + if (this.mediaStream) this.mediaStream.getTracks().forEach(t => t.stop()) + + if (this.socket) { + this.socket.close() + this.socket = null + } + + console.log("🛑 Grabación detenida") + } +}; + + +let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content") +let liveSocket = new LiveSocket("/live", Socket, { + longPollFallbackMs: 2500, + hooks: Hooks, + params: {_csrf_token: csrfToken} +}) + +// Show progress bar on live navigation and form submits +topbar.config({barColors: {0: "#29d"}, shadowColor: "rgba(0, 0, 0, .3)"}) +window.addEventListener("phx:page-loading-start", _info => topbar.show(300)) +window.addEventListener("phx:page-loading-stop", _info => topbar.hide()) + +// connect if there are any LiveViews on the page +liveSocket.connect() + +// expose liveSocket on window for web console debug logs and latency simulation: +// >> liveSocket.enableDebug() +// >> liveSocket.enableLatencySim(1000) // enabled for duration of browser session +// >> liveSocket.disableLatencySim() +window.liveSocket = liveSocket + diff --git a/whisper_live/assets/tailwind.config.js b/whisper_live/assets/tailwind.config.js new file mode 100644 index 00000000..3c65b6a0 --- /dev/null +++ b/whisper_live/assets/tailwind.config.js @@ -0,0 +1,74 @@ +// See the Tailwind configuration guide for advanced usage +// https://tailwindcss.com/docs/configuration + +const plugin = require("tailwindcss/plugin") +const fs = require("fs") +const path = require("path") + +module.exports = { + content: [ + "./js/**/*.js", + "../lib/whisper_live_web.ex", + "../lib/whisper_live_web/**/*.*ex" + ], + theme: { + extend: { + colors: { + brand: "#FD4F00", + } + }, + }, + plugins: [ + require("@tailwindcss/forms"), + // Allows prefixing tailwind classes with LiveView classes to add rules + // only when LiveView classes are applied, for example: + // + //
+ // + plugin(({addVariant}) => addVariant("phx-click-loading", [".phx-click-loading&", ".phx-click-loading &"])), + plugin(({addVariant}) => addVariant("phx-submit-loading", [".phx-submit-loading&", ".phx-submit-loading &"])), + plugin(({addVariant}) => addVariant("phx-change-loading", [".phx-change-loading&", ".phx-change-loading &"])), + + // Embeds Heroicons (https://heroicons.com) into your app.css bundle + // See your `CoreComponents.icon/1` for more information. + // + plugin(function({matchComponents, theme}) { + let iconsDir = path.join(__dirname, "../deps/heroicons/optimized") + let values = {} + let icons = [ + ["", "/24/outline"], + ["-solid", "/24/solid"], + ["-mini", "/20/solid"], + ["-micro", "/16/solid"] + ] + icons.forEach(([suffix, dir]) => { + fs.readdirSync(path.join(iconsDir, dir)).forEach(file => { + let name = path.basename(file, ".svg") + suffix + values[name] = {name, fullPath: path.join(iconsDir, dir, file)} + }) + }) + matchComponents({ + "hero": ({name, fullPath}) => { + let content = fs.readFileSync(fullPath).toString().replace(/\r?\n|\r/g, "") + let size = theme("spacing.6") + if (name.endsWith("-mini")) { + size = theme("spacing.5") + } else if (name.endsWith("-micro")) { + size = theme("spacing.4") + } + return { + [`--hero-${name}`]: `url('data:image/svg+xml;utf8,${content}')`, + "-webkit-mask": `var(--hero-${name})`, + "mask": `var(--hero-${name})`, + "mask-repeat": "no-repeat", + "background-color": "currentColor", + "vertical-align": "middle", + "display": "inline-block", + "width": size, + "height": size + } + } + }, {values}) + }) + ] +} diff --git a/whisper_live/assets/vendor/topbar.js b/whisper_live/assets/vendor/topbar.js new file mode 100644 index 00000000..41957274 --- /dev/null +++ b/whisper_live/assets/vendor/topbar.js @@ -0,0 +1,165 @@ +/** + * @license MIT + * topbar 2.0.0, 2023-02-04 + * https://buunguyen.github.io/topbar + * Copyright (c) 2021 Buu Nguyen + */ +(function (window, document) { + "use strict"; + + // https://gist.github.com/paulirish/1579671 + (function () { + var lastTime = 0; + var vendors = ["ms", "moz", "webkit", "o"]; + for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { + window.requestAnimationFrame = + window[vendors[x] + "RequestAnimationFrame"]; + window.cancelAnimationFrame = + window[vendors[x] + "CancelAnimationFrame"] || + window[vendors[x] + "CancelRequestAnimationFrame"]; + } + if (!window.requestAnimationFrame) + window.requestAnimationFrame = function (callback, element) { + var currTime = new Date().getTime(); + var timeToCall = Math.max(0, 16 - (currTime - lastTime)); + var id = window.setTimeout(function () { + callback(currTime + timeToCall); + }, timeToCall); + lastTime = currTime + timeToCall; + return id; + }; + if (!window.cancelAnimationFrame) + window.cancelAnimationFrame = function (id) { + clearTimeout(id); + }; + })(); + + var canvas, + currentProgress, + showing, + progressTimerId = null, + fadeTimerId = null, + delayTimerId = null, + addEvent = function (elem, type, handler) { + if (elem.addEventListener) elem.addEventListener(type, handler, false); + else if (elem.attachEvent) elem.attachEvent("on" + type, handler); + else elem["on" + type] = handler; + }, + options = { + autoRun: true, + barThickness: 3, + barColors: { + 0: "rgba(26, 188, 156, .9)", + ".25": "rgba(52, 152, 219, .9)", + ".50": "rgba(241, 196, 15, .9)", + ".75": "rgba(230, 126, 34, .9)", + "1.0": "rgba(211, 84, 0, .9)", + }, + shadowBlur: 10, + shadowColor: "rgba(0, 0, 0, .6)", + className: null, + }, + repaint = function () { + canvas.width = window.innerWidth; + canvas.height = options.barThickness * 5; // need space for shadow + + var ctx = canvas.getContext("2d"); + ctx.shadowBlur = options.shadowBlur; + ctx.shadowColor = options.shadowColor; + + var lineGradient = ctx.createLinearGradient(0, 0, canvas.width, 0); + for (var stop in options.barColors) + lineGradient.addColorStop(stop, options.barColors[stop]); + ctx.lineWidth = options.barThickness; + ctx.beginPath(); + ctx.moveTo(0, options.barThickness / 2); + ctx.lineTo( + Math.ceil(currentProgress * canvas.width), + options.barThickness / 2 + ); + ctx.strokeStyle = lineGradient; + ctx.stroke(); + }, + createCanvas = function () { + canvas = document.createElement("canvas"); + var style = canvas.style; + style.position = "fixed"; + style.top = style.left = style.right = style.margin = style.padding = 0; + style.zIndex = 100001; + style.display = "none"; + if (options.className) canvas.classList.add(options.className); + document.body.appendChild(canvas); + addEvent(window, "resize", repaint); + }, + topbar = { + config: function (opts) { + for (var key in opts) + if (options.hasOwnProperty(key)) options[key] = opts[key]; + }, + show: function (delay) { + if (showing) return; + if (delay) { + if (delayTimerId) return; + delayTimerId = setTimeout(() => topbar.show(), delay); + } else { + showing = true; + if (fadeTimerId !== null) window.cancelAnimationFrame(fadeTimerId); + if (!canvas) createCanvas(); + canvas.style.opacity = 1; + canvas.style.display = "block"; + topbar.progress(0); + if (options.autoRun) { + (function loop() { + progressTimerId = window.requestAnimationFrame(loop); + topbar.progress( + "+" + 0.05 * Math.pow(1 - Math.sqrt(currentProgress), 2) + ); + })(); + } + } + }, + progress: function (to) { + if (typeof to === "undefined") return currentProgress; + if (typeof to === "string") { + to = + (to.indexOf("+") >= 0 || to.indexOf("-") >= 0 + ? currentProgress + : 0) + parseFloat(to); + } + currentProgress = to > 1 ? 1 : to; + repaint(); + return currentProgress; + }, + hide: function () { + clearTimeout(delayTimerId); + delayTimerId = null; + if (!showing) return; + showing = false; + if (progressTimerId != null) { + window.cancelAnimationFrame(progressTimerId); + progressTimerId = null; + } + (function loop() { + if (topbar.progress("+.1") >= 1) { + canvas.style.opacity -= 0.05; + if (canvas.style.opacity <= 0.05) { + canvas.style.display = "none"; + fadeTimerId = null; + return; + } + } + fadeTimerId = window.requestAnimationFrame(loop); + })(); + }, + }; + + if (typeof module === "object" && typeof module.exports === "object") { + module.exports = topbar; + } else if (typeof define === "function" && define.amd) { + define(function () { + return topbar; + }); + } else { + this.topbar = topbar; + } +}.call(this, window, document)); diff --git a/whisper_live/config/config.exs b/whisper_live/config/config.exs new file mode 100644 index 00000000..d7756db9 --- /dev/null +++ b/whisper_live/config/config.exs @@ -0,0 +1,65 @@ +# This file is responsible for configuring your application +# and its dependencies with the aid of the Config module. +# +# This configuration file is loaded before any dependency and +# is restricted to this project. + +# General application configuration +import Config + +config :whisper_live, + generators: [timestamp_type: :utc_datetime] + +# Configures the endpoint +config :whisper_live, WhisperLiveWeb.Endpoint, + url: [host: "localhost"], + adapter: Bandit.PhoenixAdapter, + render_errors: [ + formats: [html: WhisperLiveWeb.ErrorHTML, json: WhisperLiveWeb.ErrorJSON], + layout: false + ], + pubsub_server: WhisperLive.PubSub, + live_view: [signing_salt: "T5+mrQUR"] + +# Configures the mailer +# +# By default it uses the "Local" adapter which stores the emails +# locally. You can see the emails in your browser, at "/dev/mailbox". +# +# For production it's recommended to configure a different adapter +# at the `config/runtime.exs`. +config :whisper_live, WhisperLive.Mailer, adapter: Swoosh.Adapters.Local + +# Configure esbuild (the version is required) +config :esbuild, + version: "0.17.11", + whisper_live: [ + args: + ~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*), + cd: Path.expand("../assets", __DIR__), + env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)} + ] + +# Configure tailwind (the version is required) +config :tailwind, + version: "3.4.3", + whisper_live: [ + args: ~w( + --config=tailwind.config.js + --input=css/app.css + --output=../priv/static/assets/app.css + ), + cd: Path.expand("../assets", __DIR__) + ] + +# Configures Elixir's Logger +config :logger, :console, + format: "$time $metadata[$level] $message\n", + metadata: [:request_id] + +# Use Jason for JSON parsing in Phoenix +config :phoenix, :json_library, Jason + +# Import environment specific config. This must remain at the bottom +# of this file so it overrides the configuration defined above. +import_config "#{config_env()}.exs" diff --git a/whisper_live/config/dev.exs b/whisper_live/config/dev.exs new file mode 100644 index 00000000..835ff33a --- /dev/null +++ b/whisper_live/config/dev.exs @@ -0,0 +1,75 @@ +import Config + +# For development, we disable any cache and enable +# debugging and code reloading. +# +# The watchers configuration can be used to run external +# watchers to your application. For example, we can use it +# to bundle .js and .css sources. +config :whisper_live, WhisperLiveWeb.Endpoint, + # Binding to loopback ipv4 address prevents access from other machines. + # Change to `ip: {0, 0, 0, 0}` to allow access from other machines. + http: [ip: {127, 0, 0, 1}, port: 4004], + check_origin: false, + code_reloader: true, + debug_errors: true, + secret_key_base: "12cAnKWRnJSxtMjKMlA4/RtIap/6QIw8WfIj3x3sg7l48jwwEUYeBD0rQxRc7zte", + watchers: [ + esbuild: {Esbuild, :install_and_run, [:whisper_live, ~w(--sourcemap=inline --watch)]}, + tailwind: {Tailwind, :install_and_run, [:whisper_live, ~w(--watch)]} + ] + +# ## SSL Support +# +# In order to use HTTPS in development, a self-signed +# certificate can be generated by running the following +# Mix task: +# +# mix phx.gen.cert +# +# Run `mix help phx.gen.cert` for more information. +# +# The `http:` config above can be replaced with: +# +# https: [ +# port: 4001, +# cipher_suite: :strong, +# keyfile: "priv/cert/selfsigned_key.pem", +# certfile: "priv/cert/selfsigned.pem" +# ], +# +# If desired, both `http:` and `https:` keys can be +# configured to run both http and https servers on +# different ports. + +# Watch static and templates for browser reloading. +config :whisper_live, WhisperLiveWeb.Endpoint, + live_reload: [ + patterns: [ + ~r"priv/static/(?!uploads/).*(js|css|png|jpeg|jpg|gif|svg)$", + ~r"priv/gettext/.*(po)$", + ~r"lib/whisper_live_web/(controllers|live|components)/.*(ex|heex)$" + ] + ] + +# Enable dev routes for dashboard and mailbox +config :whisper_live, dev_routes: true + +# Do not include metadata nor timestamps in development logs +config :logger, :console, format: "[$level] $message\n" + +# Set a higher stacktrace during development. Avoid configuring such +# in production as building large stacktraces may be expensive. +config :phoenix, :stacktrace_depth, 20 + +# Initialize plugs at runtime for faster development compilation +config :phoenix, :plug_init_mode, :runtime + +config :phoenix_live_view, + # Include HEEx debug annotations as HTML comments in rendered markup + debug_heex_annotations: true, + # Enable helpful, but potentially expensive runtime checks + enable_expensive_runtime_checks: true + +# Disable swoosh api client as it is only required for production adapters. +config :swoosh, :api_client, false diff --git a/whisper_live/config/prod.exs b/whisper_live/config/prod.exs new file mode 100644 index 00000000..9b399d79 --- /dev/null +++ b/whisper_live/config/prod.exs @@ -0,0 +1,21 @@ +import Config + +# Note we also include the path to a cache manifest +# containing the digested version of static files. This +# manifest is generated by the `mix assets.deploy` task, +# which you should run after static files are built and +# before starting your production server. +config :whisper_live, WhisperLiveWeb.Endpoint, + cache_static_manifest: "priv/static/cache_manifest.json" + +# Configures Swoosh API Client +config :swoosh, api_client: Swoosh.ApiClient.Finch, finch_name: WhisperLive.Finch + +# Disable Swoosh Local Memory Storage +config :swoosh, local: false + +# Do not print debug messages in production +config :logger, level: :info + +# Runtime production configuration, including reading +# of environment variables, is done on config/runtime.exs. diff --git a/whisper_live/config/runtime.exs b/whisper_live/config/runtime.exs new file mode 100644 index 00000000..50a0934b --- /dev/null +++ b/whisper_live/config/runtime.exs @@ -0,0 +1,102 @@ +import Config + +# config/runtime.exs is executed for all environments, including +# during releases. It is executed after compilation and before the +# system starts, so it is typically used to load production configuration +# and secrets from environment variables or elsewhere. Do not define +# any compile-time configuration in here, as it won't be applied. +# The block below contains prod specific runtime configuration. + +# ## Using releases +# +# If you use `mix release`, you need to explicitly enable the server +# by passing the PHX_SERVER=true when you start it: +# +# PHX_SERVER=true bin/whisper_live start +# +# Alternatively, you can use `mix phx.gen.release` to generate a `bin/server` +# script that automatically sets the env var above. +if System.get_env("PHX_SERVER") do + config :whisper_live, WhisperLiveWeb.Endpoint, server: true +end + +if config_env() == :prod do + # The secret key base is used to sign/encrypt cookies and other secrets. + # A default value is used in config/dev.exs and config/test.exs but you + # want to use a different value for prod and you most likely don't want + # to check this value into version control, so we use an environment + # variable instead. + secret_key_base = + System.get_env("SECRET_KEY_BASE") || + raise """ + environment variable SECRET_KEY_BASE is missing. + You can generate one by calling: mix phx.gen.secret + """ + + host = System.get_env("PHX_HOST") || "example.com" + port = String.to_integer(System.get_env("PORT") || "4004") + + config :whisper_live, :dns_cluster_query, System.get_env("DNS_CLUSTER_QUERY") + + config :whisper_live, WhisperLiveWeb.Endpoint, + url: [host: host, port: 443, scheme: "https"], + http: [ + # Enable IPv6 and bind on all interfaces. + # Set it to {0, 0, 0, 0, 0, 0, 0, 1} for local network only access. + # See the documentation on https://hexdocs.pm/bandit/Bandit.html#t:options/0 + # for details about using IPv6 vs IPv4 and loopback vs public addresses. + ip: {0, 0, 0, 0, 0, 0, 0, 0}, + port: port + ], + secret_key_base: secret_key_base + + # ## SSL Support + # + # To get SSL working, you will need to add the `https` key + # to your endpoint configuration: + # + # config :whisper_live, WhisperLiveWeb.Endpoint, + # https: [ + # ..., + # port: 443, + # cipher_suite: :strong, + # keyfile: System.get_env("SOME_APP_SSL_KEY_PATH"), + # certfile: System.get_env("SOME_APP_SSL_CERT_PATH") + # ] + # + # The `cipher_suite` is set to `:strong` to support only the + # latest and more secure SSL ciphers. This means old browsers + # and clients may not be supported. You can set it to + # `:compatible` for wider support. + # + # `:keyfile` and `:certfile` expect an absolute path to the key + # and cert in disk or a relative path inside priv, for example + # "priv/ssl/server.key". For all supported SSL configuration + # options, see https://hexdocs.pm/plug/Plug.SSL.html#configure/1 + # + # We also recommend setting `force_ssl` in your config/prod.exs, + # ensuring no data is ever sent via http, always redirecting to https: + # + # config :whisper_live, WhisperLiveWeb.Endpoint, + # force_ssl: [hsts: true] + # + # Check `Plug.SSL` for all available options in `force_ssl`. + + # ## Configuring the mailer + # + # In production you need to configure the mailer to use a different adapter. + # Also, you may need to configure the Swoosh API client of your choice if you + # are not using SMTP. Here is an example of the configuration: + # + # config :whisper_live, WhisperLive.Mailer, + # adapter: Swoosh.Adapters.Mailgun, + # api_key: System.get_env("MAILGUN_API_KEY"), + # domain: System.get_env("MAILGUN_DOMAIN") + # + # For this example you need include a HTTP client required by Swoosh API client. + # Swoosh supports Hackney and Finch out of the box: + # + # config :swoosh, :api_client, Swoosh.ApiClient.Hackney + # + # See https://hexdocs.pm/swoosh/Swoosh.html#module-installation for details. +end diff --git a/whisper_live/config/test.exs b/whisper_live/config/test.exs new file mode 100644 index 00000000..99a31ba9 --- /dev/null +++ b/whisper_live/config/test.exs @@ -0,0 +1,24 @@ +import Config + +# We don't run a server during test. If one is required, +# you can enable the server option below. +config :whisper_live, WhisperLiveWeb.Endpoint, + http: [ip: {127, 0, 0, 1}, port: 4002], + secret_key_base: "p/2LKeP//vkVcRXF1XInIwM0ZrBoeC3FYoKUiH62dRRmNdpKbbWOtgpC9Bh+3iy0", + server: false + +# In test we don't send emails +config :whisper_live, WhisperLive.Mailer, adapter: Swoosh.Adapters.Test + +# Disable swoosh api client as it is only required for production adapters +config :swoosh, :api_client, false + +# Print only warnings and errors during test +config :logger, level: :warning + +# Initialize plugs at runtime for faster test compilation +config :phoenix, :plug_init_mode, :runtime + +# Enable helpful, but potentially expensive runtime checks +config :phoenix_live_view, + enable_expensive_runtime_checks: true diff --git a/whisper_live/lib/whisper_live.ex b/whisper_live/lib/whisper_live.ex new file mode 100644 index 00000000..1b62cd45 --- /dev/null +++ b/whisper_live/lib/whisper_live.ex @@ -0,0 +1,9 @@ +defmodule WhisperLive do + @moduledoc """ + WhisperLive keeps the contexts that define your domain + and business logic. + + Contexts are also responsible for managing your data, regardless + if it comes from the database, an external API or others. + """ +end diff --git a/whisper_live/lib/whisper_live/application.ex b/whisper_live/lib/whisper_live/application.ex new file mode 100644 index 00000000..22375943 --- /dev/null +++ b/whisper_live/lib/whisper_live/application.ex @@ -0,0 +1,30 @@ +defmodule WhisperLive.Application do + # See https://hexdocs.pm/elixir/Application.html + # for more information on OTP Applications + @moduledoc false + + use Application + + @impl true + def start(_type, _args) do + children = [ + {Registry, keys: :unique, name: WhisperLive.Registry}, + {Registry, keys: :unique, name: WhisperLive.AudioRegistry}, # ESTE + WhisperLiveWeb.Endpoint, + {Phoenix.PubSub, name: WhisperLive.PubSub} + ] + + # See https://hexdocs.pm/elixir/Supervisor.html + # for other strategies and supported options + opts = [strategy: :one_for_one, name: WhisperLive.Supervisor] + Supervisor.start_link(children, opts) + end + + # Tell Phoenix to update the endpoint configuration + # whenever the application is updated. + @impl true + def config_change(changed, _new, removed) do + WhisperLiveWeb.Endpoint.config_change(changed, removed) + :ok + end +end diff --git a/whisper_live/lib/whisper_live/audio_buffer.ex b/whisper_live/lib/whisper_live/audio_buffer.ex new file mode 100644 index 00000000..82f759d4 --- /dev/null +++ b/whisper_live/lib/whisper_live/audio_buffer.ex @@ -0,0 +1,23 @@ +defmodule WhisperLive.AudioBuffer do + use GenServer + + ## API + + def start_link(ref), do: GenServer.start_link(__MODULE__, [], name: via(ref)) + + def append(ref, chunk), do: GenServer.cast(via(ref), {:append, chunk}) + + def get_all(ref), do: GenServer.call(via(ref), :get_all) + + def stop(ref), do: GenServer.stop(via(ref)) + + defp via(ref), do: {:via, Registry, {WhisperLive.AudioRegistry, ref}} + + ## Callbacks + + def init(_), do: {:ok, []} + + def handle_cast({:append, chunk}, state), do: {:noreply, [chunk | state]} + + def handle_call(:get_all, _from, state), do: {:reply, Enum.reverse(state), state} +end diff --git a/whisper_live/lib/whisper_live/mailer.ex b/whisper_live/lib/whisper_live/mailer.ex new file mode 100644 index 00000000..d7db4e52 --- /dev/null +++ b/whisper_live/lib/whisper_live/mailer.ex @@ -0,0 +1,3 @@ +defmodule WhisperLive.Mailer do + use Swoosh.Mailer, otp_app: :whisper_live +end diff --git a/whisper_live/lib/whisper_live/transcriber.ex b/whisper_live/lib/whisper_live/transcriber.ex new file mode 100644 index 00000000..a268e6a6 --- /dev/null +++ b/whisper_live/lib/whisper_live/transcriber.ex @@ -0,0 +1,116 @@ +defmodule WhisperLive.Transcriber do + use GenServer + require Logger + alias WhisperLive.AudioBuffer + alias Phoenix.PubSub + + @interval_ms 3000 + + def start_link(ref) do + GenServer.start_link(__MODULE__, ref, name: via_tuple(ref)) + end + + def stop(ref) do + GenServer.stop(via_tuple(ref), :normal) + end + + defp via_tuple(ref), do: {:via, Registry, {WhisperLive.Registry, ref}} + + def init(ref) do + schedule() + {:ok, %{ref: ref}} + end + + def handle_info(:transcribe, %{ref: ref} = state) do + case AudioBuffer.get_all(ref) do + [] -> + :noop + + [{rate, _} | _] = chunks -> + merged = chunks |> Enum.map(fn {_, bin} -> bin end) |> IO.iodata_to_binary() + tmpfile = tmp_path("realtime_#{ref}") + :ok = File.write!(tmpfile, encode_wav(merged, rate)) + + case send_to_whisper(tmpfile) do + {:ok, response} -> + PubSub.broadcast(WhisperLive.PubSub, "transcription:#{ref}", {:transcription, response}) + + {:error, reason} -> + Logger.warning("Realtime transcription error: #{inspect(reason)}") + end + + File.rm(tmpfile) + end + + schedule() + {:noreply, state} + end + + defp tmp_path(prefix) do + unique = :erlang.unique_integer([:positive]) |> Integer.to_string() + filename = prefix <> "_" <> unique <> ".wav" + Path.join(System.tmp_dir!(), filename) + end + + + # def handle_info({:transcription, raw_json}, socket) do + # new_text = + # raw_json + # |> Jason.decode!() + # |> get_in(["chunks", Access.at(0), "text"]) + + # {:noreply, update(socket, :transcription, &(&1 <> " " <> new_text))} + # end + + defp schedule, do: Process.send_after(self(), :transcribe, @interval_ms) + + defp encode_wav(data, sample_rate) do + num_channels = 1 + bits_per_sample = 16 + byte_rate = sample_rate * num_channels * div(bits_per_sample, 8) + block_align = div(bits_per_sample * num_channels, 8) + data_size = byte_size(data) + riff_size = 36 + data_size + + << + "RIFF", + <>, + "WAVE", + "fmt ", + <<16::little-size(32)>>, + <<1::little-size(16)>>, + <>, + <>, + <>, + <>, + <>, + "data", + <> + >> <> data + end + + defp send_to_whisper(filepath) do + url = "http://localhost:4000/infer" + {:ok, file_bin} = File.read(filepath) + filename = Path.basename(filepath) + + headers = [ + {'Content-Type', 'multipart/form-data; boundary=----ElixirBoundary'} + ] + + body = [ + "------ElixirBoundary\r\n", + "Content-Disposition: form-data; name=\"file\"; filename=\"#{filename}\"\r\n", + "Content-Type: audio/wav\r\n\r\n", + file_bin, + "\r\n------ElixirBoundary--\r\n" + ] + + :httpc.request(:post, {url, headers, 'multipart/form-data; boundary=----ElixirBoundary', body}, [], []) + |> case do + {:ok, {{_, 200, _}, _headers, body}} -> {:ok, to_string(body)} + {:ok, {{_, status, _}, _, body}} -> {:error, {:http_error, status, to_string(body)}} + error -> {:error, error} + end + end +end diff --git a/whisper_live/lib/whisper_live_web.ex b/whisper_live/lib/whisper_live_web.ex new file mode 100644 index 00000000..cb88013a --- /dev/null +++ b/whisper_live/lib/whisper_live_web.ex @@ -0,0 +1,116 @@ +defmodule WhisperLiveWeb do + @moduledoc """ + The entrypoint for defining your web interface, such + as controllers, components, channels, and so on. + + This can be used in your application as: + + use WhisperLiveWeb, :controller + use WhisperLiveWeb, :html + + The definitions below will be executed for every controller, + component, etc, so keep them short and clean, focused + on imports, uses and aliases. + + Do NOT define functions inside the quoted expressions + below. Instead, define additional modules and import + those modules here. + """ + + def static_paths, do: ~w(assets fonts images favicon.ico robots.txt) + + def router do + quote do + use Phoenix.Router, helpers: false + + # Import common connection and controller functions to use in pipelines + import Plug.Conn + import Phoenix.Controller + import Phoenix.LiveView.Router + end + end + + def channel do + quote do + use Phoenix.Channel + end + end + + def controller do + quote do + use Phoenix.Controller, + formats: [:html, :json], + layouts: [html: WhisperLiveWeb.Layouts] + + use Gettext, backend: WhisperLiveWeb.Gettext + + import Plug.Conn + + unquote(verified_routes()) + end + end + + def live_view do + quote do + use Phoenix.LiveView, + layout: {WhisperLiveWeb.Layouts, :app} + + unquote(html_helpers()) + end + end + + def live_component do + quote do + use Phoenix.LiveComponent + + unquote(html_helpers()) + end + end + + def html do + quote do + use Phoenix.Component + + # Import convenience functions from controllers + import Phoenix.Controller, + only: [get_csrf_token: 0, view_module: 1, view_template: 1] + + # Include general helpers for rendering HTML + unquote(html_helpers()) + end + end + + defp html_helpers do + quote do + # Translation + use Gettext, backend: WhisperLiveWeb.Gettext + + # HTML escaping functionality + import Phoenix.HTML + # Core UI components + import WhisperLiveWeb.CoreComponents + + # Shortcut for generating JS commands + alias Phoenix.LiveView.JS + + # Routes generation with the ~p sigil + unquote(verified_routes()) + end + end + + def verified_routes do + quote do + use Phoenix.VerifiedRoutes, + endpoint: WhisperLiveWeb.Endpoint, + router: WhisperLiveWeb.Router, + statics: WhisperLiveWeb.static_paths() + end + end + + @doc """ + When used, dispatch to the appropriate controller/live_view/etc. + """ + defmacro __using__(which) when is_atom(which) do + apply(__MODULE__, which, []) + end +end diff --git a/whisper_live/lib/whisper_live_web/channels/audio_channel.ex b/whisper_live/lib/whisper_live_web/channels/audio_channel.ex new file mode 100644 index 00000000..18fa0e0c --- /dev/null +++ b/whisper_live/lib/whisper_live_web/channels/audio_channel.ex @@ -0,0 +1,134 @@ +defmodule WhisperLiveWeb.AudioChannel do + use Phoenix.Channel + require Logger + alias WhisperLive.AudioBuffer + + def join("audio:lobby", _payload, socket) do + ref = socket_id(socket) + Logger.info("Cliente conectado al canal audio:lobby") + {:ok, _} = AudioBuffer.start_link(ref) + {:ok, _} = WhisperLive.Transcriber.start_link(ref) + {:ok, socket} + end + + def handle_in("audio_chunk", %{"data" => base64_audio, "sample_rate" => sample_rate}, socket) do + # 1. Decodificas el audio base64 + {:ok, bin} = Base.decode64(base64_audio) + + # 2. Guardas o procesas el chunk de audio + # Podrías escribirlo en un archivo temporal para enviar a Whisper + tmpfile = tmp_path("chunk_#{socket.assigns.ref}") + :ok = File.write!(tmpfile, encode_wav(bin, sample_rate)) + + # 3. Llamas a la transcripción del chunk (podría ser sync o async) + case send_to_whisper(tmpfile) do + {:ok, transcription} -> + # 4. Envías el texto parcial por PubSub o Push a LiveView/cliente + Phoenix.PubSub.broadcast(YourApp.PubSub, "transcription:#{socket.assigns.ref}", {:transcription, transcription}) + + {:error, reason} -> + Logger.error("Error en transcripción parcial: #{inspect(reason)}") + end + + File.rm(tmpfile) + + {:noreply, socket} + end + + + def handle_in("stop_audio", _payload, socket) do + Logger.info("🛑 Grabación detenida por cliente") + + ref = socket_id(socket) + + case AudioBuffer.get_all(ref) do + [{rate, _} | _] = chunks -> + merged = chunks |> Enum.map(fn {_, bin} -> bin end) |> IO.iodata_to_binary() + filename = "recordings/recording_#{System.system_time(:millisecond)}.wav" + File.mkdir_p!("recordings") + File.write!(filename, encode_wav(merged, rate)) + Logger.info("💾 Audio guardado en #{filename}") + + # 🔁 Transcribir automáticamente + case send_to_whisper(filename) do + {:ok, response} -> + Logger.info("📝 Transcripción recibida: #{response}") + {:error, reason} -> + Logger.error("❌ Error al transcribir: #{inspect(reason)}") + end + + _ -> + Logger.warning("⚠️ No se recibieron chunks de audio") + end + + AudioBuffer.stop(ref) + WhisperLive.Transcriber.stop(ref) + {:noreply, socket} + end + + defp socket_id(socket), do: socket.transport_pid |> :erlang.pid_to_list() |> List.to_string() + + defp encode_wav(data, sample_rate) do + num_channels = 1 + bits_per_sample = 16 + byte_rate = sample_rate * num_channels * div(bits_per_sample, 8) + block_align = div(bits_per_sample * num_channels, 8) + data_size = byte_size(data) + riff_size = 36 + data_size + + << + "RIFF", + <>, + "WAVE", + "fmt ", + <<16::little-size(32)>>, + <<1::little-size(16)>>, + <>, + <>, + <>, + <>, + <>, + "data", + <> + >> <> data + end + + defp send_to_whisper(filepath) do + url = "http://localhost:4000/infer" + + {:ok, file_bin} = File.read(filepath) + filename = Path.basename(filepath) + + headers = [ + {'Content-Type', 'multipart/form-data; boundary=----ElixirBoundary'} + ] + + body = + [ + "------ElixirBoundary\r\n", + "Content-Disposition: form-data; name=\"file\"; filename=\"#{filename}\"\r\n", + "Content-Type: audio/wav\r\n\r\n", + file_bin, + "\r\n------ElixirBoundary--\r\n" + ] + + :httpc.request(:post, {url, headers, 'multipart/form-data; boundary=----ElixirBoundary', body}, [], []) + |> case do + {:ok, {{_, 200, _}, _headers, body}} -> + {:ok, to_string(body)} + + {:ok, {{_, status, _}, _, body}} -> + {:error, {:http_error, status, to_string(body)}} + + error -> + {:error, error} + end + end + + defp tmp_path(prefix) do + unique = :erlang.unique_integer([:positive]) |> Integer.to_string() + filename = prefix <> "_" <> unique <> ".wav" + Path.join(System.tmp_dir!(), filename) + end + +end diff --git a/whisper_live/lib/whisper_live_web/channels/user_socket.ex b/whisper_live/lib/whisper_live_web/channels/user_socket.ex new file mode 100644 index 00000000..fc34cd8e --- /dev/null +++ b/whisper_live/lib/whisper_live_web/channels/user_socket.ex @@ -0,0 +1,14 @@ +defmodule WhisperLiveWeb.UserSocket do + use Phoenix.Socket + + ## Canales que acepta este socket: + channel "audio:*", WhisperLiveWeb.AudioChannel + + transport :websocket, Phoenix.Transports.WebSocket + + def connect(_params, socket, _connect_info) do + {:ok, socket} + end + + def id(_socket), do: nil +end diff --git a/whisper_live/lib/whisper_live_web/components/core_components.ex b/whisper_live/lib/whisper_live_web/components/core_components.ex new file mode 100644 index 00000000..3da89b74 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/components/core_components.ex @@ -0,0 +1,676 @@ +defmodule WhisperLiveWeb.CoreComponents do + @moduledoc """ + Provides core UI components. + + At first glance, this module may seem daunting, but its goal is to provide + core building blocks for your application, such as modals, tables, and + forms. The components consist mostly of markup and are well-documented + with doc strings and declarative assigns. You may customize and style + them in any way you want, based on your application growth and needs. + + The default components use Tailwind CSS, a utility-first CSS framework. + See the [Tailwind CSS documentation](https://tailwindcss.com) to learn + how to customize them or feel free to swap in another framework altogether. + + Icons are provided by [heroicons](https://heroicons.com). See `icon/1` for usage. + """ + use Phoenix.Component + use Gettext, backend: WhisperLiveWeb.Gettext + + alias Phoenix.LiveView.JS + + @doc """ + Renders a modal. + + ## Examples + + <.modal id="confirm-modal"> + This is a modal. + + + JS commands may be passed to the `:on_cancel` to configure + the closing/cancel event, for example: + + <.modal id="confirm" on_cancel={JS.navigate(~p"/posts")}> + This is another modal. + + + """ + attr :id, :string, required: true + attr :show, :boolean, default: false + attr :on_cancel, JS, default: %JS{} + slot :inner_block, required: true + + def modal(assigns) do + ~H""" + + """ + end + + def input(%{type: "select"} = assigns) do + ~H""" +
+ <.label for={@id}>{@label} + + <.error :for={msg <- @errors}>{msg} +
+ """ + end + + def input(%{type: "textarea"} = assigns) do + ~H""" +
+ <.label for={@id}>{@label} + + <.error :for={msg <- @errors}>{msg} +
+ """ + end + + # All other inputs text, datetime-local, url, password, etc. are handled here... + def input(assigns) do + ~H""" +
+ <.label for={@id}>{@label} + + <.error :for={msg <- @errors}>{msg} +
+ """ + end + + @doc """ + Renders a label. + """ + attr :for, :string, default: nil + slot :inner_block, required: true + + def label(assigns) do + ~H""" + + """ + end + + @doc """ + Generates a generic error message. + """ + slot :inner_block, required: true + + def error(assigns) do + ~H""" +

+ <.icon name="hero-exclamation-circle-mini" class="mt-0.5 h-5 w-5 flex-none" /> + {render_slot(@inner_block)} +

+ """ + end + + @doc """ + Renders a header with title. + """ + attr :class, :string, default: nil + + slot :inner_block, required: true + slot :subtitle + slot :actions + + def header(assigns) do + ~H""" +
+
+

+ {render_slot(@inner_block)} +

+

+ {render_slot(@subtitle)} +

+
+
{render_slot(@actions)}
+
+ """ + end + + @doc ~S""" + Renders a table with generic styling. + + ## Examples + + <.table id="users" rows={@users}> + <:col :let={user} label="id">{user.id} + <:col :let={user} label="username">{user.username} + + """ + attr :id, :string, required: true + attr :rows, :list, required: true + attr :row_id, :any, default: nil, doc: "the function for generating the row id" + attr :row_click, :any, default: nil, doc: "the function for handling phx-click on each row" + + attr :row_item, :any, + default: &Function.identity/1, + doc: "the function for mapping each row before calling the :col and :action slots" + + slot :col, required: true do + attr :label, :string + end + + slot :action, doc: "the slot for showing user actions in the last table column" + + def table(assigns) do + assigns = + with %{rows: %Phoenix.LiveView.LiveStream{}} <- assigns do + assign(assigns, row_id: assigns.row_id || fn {id, _item} -> id end) + end + + ~H""" +
+ + + + + + + + + + + + + +
{col[:label]} + {gettext("Actions")} +
+
+ + + {render_slot(col, @row_item.(row))} + +
+ 		+
+ + + {render_slot(action, @row_item.(row))} + +
+
+
+ """ + end + + @doc """ + Renders a data list. + + ## Examples + + <.list> + <:item title="Title">{@post.title} + <:item title="Views">{@post.views} + + """ + slot :item, required: true do + attr :title, :string, required: true + end + + def list(assigns) do + ~H""" +
+
+
+
{item.title}
+
{render_slot(item)}
+
+
+
+ """ + end + + @doc """ + Renders a back navigation link. + + ## Examples + + <.back navigate={~p"/posts"}>Back to posts + """ + attr :navigate, :any, required: true + slot :inner_block, required: true + + def back(assigns) do + ~H""" +
+ <.link + navigate={@navigate} + class="text-sm font-semibold leading-6 text-zinc-900 hover:text-zinc-700" + > + <.icon name="hero-arrow-left-solid" class="h-3 w-3" /> + {render_slot(@inner_block)} + +
+ """ + end + + @doc """ + Renders a [Heroicon](https://heroicons.com). + + Heroicons come in three styles – outline, solid, and mini. + By default, the outline style is used, but solid and mini may + be applied by using the `-solid` and `-mini` suffix. + + You can customize the size and colors of the icons by setting + width, height, and background color classes. + + Icons are extracted from the `deps/heroicons` directory and bundled within + your compiled app.css by the plugin in your `assets/tailwind.config.js`. + + ## Examples + + <.icon name="hero-x-mark-solid" /> + <.icon name="hero-arrow-path" class="ml-1 w-3 h-3 animate-spin" /> + """ + attr :name, :string, required: true + attr :class, :string, default: nil + + def icon(%{name: "hero-" <> _} = assigns) do + ~H""" + + """ + end + + ## JS Commands + + def show(js \\ %JS{}, selector) do + JS.show(js, + to: selector, + time: 300, + transition: + {"transition-all transform ease-out duration-300", + "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95", + "opacity-100 translate-y-0 sm:scale-100"} + ) + end + + def hide(js \\ %JS{}, selector) do + JS.hide(js, + to: selector, + time: 200, + transition: + {"transition-all transform ease-in duration-200", + "opacity-100 translate-y-0 sm:scale-100", + "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"} + ) + end + + def show_modal(js \\ %JS{}, id) when is_binary(id) do + js + |> JS.show(to: "##{id}") + |> JS.show( + to: "##{id}-bg", + time: 300, + transition: {"transition-all transform ease-out duration-300", "opacity-0", "opacity-100"} + ) + |> show("##{id}-container") + |> JS.add_class("overflow-hidden", to: "body") + |> JS.focus_first(to: "##{id}-content") + end + + def hide_modal(js \\ %JS{}, id) do + js + |> JS.hide( + to: "##{id}-bg", + transition: {"transition-all transform ease-in duration-200", "opacity-100", "opacity-0"} + ) + |> hide("##{id}-container") + |> JS.hide(to: "##{id}", transition: {"block", "block", "hidden"}) + |> JS.remove_class("overflow-hidden", to: "body") + |> JS.pop_focus() + end + + @doc """ + Translates an error message using gettext. + """ + def translate_error({msg, opts}) do + # When using gettext, we typically pass the strings we want + # to translate as a static argument: + # + # # Translate the number of files with plural rules + # dngettext("errors", "1 file", "%{count} files", count) + # + # However the error messages in our forms and APIs are generated + # dynamically, so we need to translate them by calling Gettext + # with our gettext backend as first argument. Translations are + # available in the errors.po file (as we use the "errors" domain). + if count = opts[:count] do + Gettext.dngettext(WhisperLiveWeb.Gettext, "errors", msg, msg, count, opts) + else + Gettext.dgettext(WhisperLiveWeb.Gettext, "errors", msg, opts) + end + end + + @doc """ + Translates the errors for a field from a keyword list of errors. + """ + def translate_errors(errors, field) when is_list(errors) do + for {^field, {msg, opts}} <- errors, do: translate_error({msg, opts}) + end +end diff --git a/whisper_live/lib/whisper_live_web/components/layouts.ex b/whisper_live/lib/whisper_live_web/components/layouts.ex new file mode 100644 index 00000000..78a62cb4 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/components/layouts.ex @@ -0,0 +1,14 @@ +defmodule WhisperLiveWeb.Layouts do + @moduledoc """ + This module holds different layouts used by your application. + + See the `layouts` directory for all templates available. + The "root" layout is a skeleton rendered as part of the + application router. The "app" layout is set as the default + layout on both `use WhisperLiveWeb, :controller` and + `use WhisperLiveWeb, :live_view`. + """ + use WhisperLiveWeb, :html + + embed_templates "layouts/*" +end diff --git a/whisper_live/lib/whisper_live_web/components/layouts/app.html.heex b/whisper_live/lib/whisper_live_web/components/layouts/app.html.heex new file mode 100644 index 00000000..3b3b6074 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/components/layouts/app.html.heex @@ -0,0 +1,32 @@ +
+
+
+ + + +

+ v{Application.spec(:phoenix, :vsn)} +

+
+
+ + @elixirphoenix + + + GitHub + + + Get Started + +
+
+
+
+
+ <.flash_group flash={@flash} /> + {@inner_content} +
+
diff --git a/whisper_live/lib/whisper_live_web/components/layouts/root.html.heex b/whisper_live/lib/whisper_live_web/components/layouts/root.html.heex new file mode 100644 index 00000000..1a98bae9 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/components/layouts/root.html.heex @@ -0,0 +1,17 @@ + + + + + + + <.live_title default="WhisperLive" suffix=" · Phoenix Framework"> + {assigns[:page_title]} + + + + + + {@inner_content} + + diff --git a/whisper_live/lib/whisper_live_web/controllers/error_html.ex b/whisper_live/lib/whisper_live_web/controllers/error_html.ex new file mode 100644 index 00000000..d35c27da --- /dev/null +++ b/whisper_live/lib/whisper_live_web/controllers/error_html.ex @@ -0,0 +1,24 @@ +defmodule WhisperLiveWeb.ErrorHTML do + @moduledoc """ + This module is invoked by your endpoint in case of errors on HTML requests. + + See config/config.exs. + """ + use WhisperLiveWeb, :html + + # If you want to customize your error pages, + # uncomment the embed_templates/1 call below + # and add pages to the error directory: + # + # * lib/whisper_live_web/controllers/error_html/404.html.heex + # * lib/whisper_live_web/controllers/error_html/500.html.heex + # + # embed_templates "error_html/*" + + # The default is to render a plain text page based on + # the template name. For example, "404.html" becomes + # "Not Found". + def render(template, _assigns) do + Phoenix.Controller.status_message_from_template(template) + end +end diff --git a/whisper_live/lib/whisper_live_web/controllers/error_json.ex b/whisper_live/lib/whisper_live_web/controllers/error_json.ex new file mode 100644 index 00000000..d2b0201b --- /dev/null +++ b/whisper_live/lib/whisper_live_web/controllers/error_json.ex @@ -0,0 +1,21 @@ +defmodule WhisperLiveWeb.ErrorJSON do + @moduledoc """ + This module is invoked by your endpoint in case of errors on JSON requests. + + See config/config.exs. + """ + + # If you want to customize a particular status code, + # you may add your own clauses, such as: + # + # def render("500.json", _assigns) do + # %{errors: %{detail: "Internal Server Error"}} + # end + + # By default, Phoenix returns the status message from + # the template name. For example, "404.json" becomes + # "Not Found". + def render(template, _assigns) do + %{errors: %{detail: Phoenix.Controller.status_message_from_template(template)}} + end +end diff --git a/whisper_live/lib/whisper_live_web/controllers/page_controller.ex b/whisper_live/lib/whisper_live_web/controllers/page_controller.ex new file mode 100644 index 00000000..59c3ad01 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/controllers/page_controller.ex @@ -0,0 +1,9 @@ +defmodule WhisperLiveWeb.PageController do + use WhisperLiveWeb, :controller + + def home(conn, _params) do + # The home page is often custom made, + # so skip the default app layout. + render(conn, :home, layout: false) + end +end diff --git a/whisper_live/lib/whisper_live_web/controllers/page_html.ex b/whisper_live/lib/whisper_live_web/controllers/page_html.ex new file mode 100644 index 00000000..4221a31c --- /dev/null +++ b/whisper_live/lib/whisper_live_web/controllers/page_html.ex @@ -0,0 +1,10 @@ +defmodule WhisperLiveWeb.PageHTML do + @moduledoc """ + This module contains pages rendered by PageController. + + See the `page_html` directory for all templates available. + """ + use WhisperLiveWeb, :html + + embed_templates "page_html/*" +end diff --git a/whisper_live/lib/whisper_live_web/controllers/page_html/home.html.heex b/whisper_live/lib/whisper_live_web/controllers/page_html/home.html.heex new file mode 100644 index 00000000..d72b03c2 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/controllers/page_html/home.html.heex @@ -0,0 +1,222 @@ +<.flash_group flash={@flash} /> + +
+
+ +

+ Phoenix Framework + + v{Application.spec(:phoenix, :vsn)} + +

+

+ Peace of mind from prototype to production. +

+

+ Build rich, interactive web applications quickly, with less code and fewer moving parts. Join our growing community of developers using Phoenix to craft APIs, HTML5 apps and more, for fun or at scale. +

+
+
+
+ + + + + + Guides & Docs + + + + + + + + Source Code + + + + + + + + Changelog + + +
+
+ + + + + +
+
+
+
+
diff --git a/whisper_live/lib/whisper_live_web/endpoint.ex b/whisper_live/lib/whisper_live_web/endpoint.ex new file mode 100644 index 00000000..6d5fa10e --- /dev/null +++ b/whisper_live/lib/whisper_live_web/endpoint.ex @@ -0,0 +1,56 @@ +defmodule WhisperLiveWeb.Endpoint do + use Phoenix.Endpoint, otp_app: :whisper_live + + # The session will be stored in the cookie and signed, + # this means its contents can be read but not tampered with. + # Set :encryption_salt if you would also like to encrypt it. + @session_options [ + store: :cookie, + key: "_whisper_live_key", + signing_salt: "j3rg54L3", + same_site: "Lax" + ] + + socket "/live", Phoenix.LiveView.Socket + # websocket: [connect_info: [session: @session_options]], + # longpoll: [connect_info: [session: @session_options]] + + socket "/socket", WhisperLiveWeb.UserSocket, + websocket: true, + longpoll: false + + # Serve at "/" the static files from "priv/static" directory. + # + # You should set gzip to true if you are running phx.digest + # when deploying your static files in production. + plug Plug.Static, + at: "/", + from: :whisper_live, + gzip: false, + only: WhisperLiveWeb.static_paths() + + # Code reloading can be explicitly enabled under the + # :code_reloader configuration of your endpoint. + if code_reloading? do + socket "/phoenix/live_reload/socket", Phoenix.LiveReloader.Socket + plug Phoenix.LiveReloader + plug Phoenix.CodeReloader + end + + plug Phoenix.LiveDashboard.RequestLogger, + param_key: "request_logger", + cookie_key: "request_logger" + + plug Plug.RequestId + plug Plug.Telemetry, event_prefix: [:phoenix, :endpoint] + + plug Plug.Parsers, + parsers: [:urlencoded, :multipart, :json], + pass: ["*/*"], + json_decoder: Phoenix.json_library() + + plug Plug.MethodOverride + plug Plug.Head + plug Plug.Session, @session_options + plug WhisperLiveWeb.Router +end diff --git a/whisper_live/lib/whisper_live_web/gettext.ex b/whisper_live/lib/whisper_live_web/gettext.ex new file mode 100644 index 00000000..b59089d4 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/gettext.ex @@ -0,0 +1,25 @@ +defmodule WhisperLiveWeb.Gettext do + @moduledoc """ + A module providing Internationalization with a gettext-based API. + + By using [Gettext](https://hexdocs.pm/gettext), your module compiles translations + that you can use in your application. To use this Gettext backend module, + call `use Gettext` and pass it as an option: + + use Gettext, backend: WhisperLiveWeb.Gettext + + # Simple translation + gettext("Here is the string to translate") + + # Plural translation + ngettext("Here is the string to translate", + "Here are the strings to translate", + 3) + + # Domain-based translation + dgettext("errors", "Here is the error message to translate") + + See the [Gettext Docs](https://hexdocs.pm/gettext) for detailed usage. + """ + use Gettext.Backend, otp_app: :whisper_live +end diff --git a/whisper_live/lib/whisper_live_web/live/recorder.ex b/whisper_live/lib/whisper_live_web/live/recorder.ex new file mode 100644 index 00000000..86c84129 --- /dev/null +++ b/whisper_live/lib/whisper_live_web/live/recorder.ex @@ -0,0 +1,160 @@ +defmodule WhisperLiveWeb.Live.Recorder do + use WhisperLiveWeb, :live_view + alias Phoenix.PubSub + + def mount(_, _, socket) do + if connected?(socket), do: PubSub.subscribe(WhisperLive.PubSub, "transcription:#{socket_id(socket)}") + {:ok, assign(socket, transcription: "")} + end + + def handle_info({:transcription, raw_json}, socket) do + new_text = + raw_json + |> Jason.decode!() + |> get_in(["chunks", Access.at(0), "text"]) + + {:noreply, update(socket, :transcription, &(&1 <> " " <> new_text))} + end + + def handle_event("start_recording", _params, socket) do + push_event(socket, "start-recording", %{}) + {:noreply, socket} + end + + def handle_event("stop_recording", _params, socket) do + push_event(socket, "stop-recording", %{}) + {:noreply, socket} + end + + defp socket_id(socket), do: socket.transport_pid |> :erlang.pid_to_list() |> List.to_string() + + def render(assigns) do + ~H""" +
+ + + +
+
<%= @transcription %>
+
+
+ + +
+ """ + end +end diff --git a/whisper_live/lib/whisper_live_web/router.ex b/whisper_live/lib/whisper_live_web/router.ex new file mode 100644 index 00000000..7df5ec5a --- /dev/null +++ b/whisper_live/lib/whisper_live_web/router.ex @@ -0,0 +1,45 @@ +defmodule WhisperLiveWeb.Router do + use WhisperLiveWeb, :router + + pipeline :browser do + plug :accepts, ["html"] + plug :fetch_session + plug :fetch_live_flash + plug :put_root_layout, html: {WhisperLiveWeb.Layouts, :root} + plug :protect_from_forgery + plug :put_secure_browser_headers + end + + pipeline :api do + plug :accepts, ["json"] + end + + scope "/", WhisperLiveWeb do + pipe_through :browser + + get "/", PageController, :home + live "/recorder", Live.Recorder + end + + # Other scopes may use custom stacks. + # scope "/api", WhisperLiveWeb do + # pipe_through :api + # end + + # Enable LiveDashboard and Swoosh mailbox preview in development + if Application.compile_env(:whisper_live, :dev_routes) do + # If you want to use the LiveDashboard in production, you should put + # it behind authentication and allow only admins to access it. + # If your application does not have an admins-only section yet, + # you can use Plug.BasicAuth to set up some basic authentication + # as long as you are also using SSL (which you should anyway). + import Phoenix.LiveDashboard.Router + + scope "/dev" do + pipe_through :browser + + live_dashboard "/dashboard", metrics: WhisperLiveWeb.Telemetry + forward "/mailbox", Plug.Swoosh.MailboxPreview + end + end +end diff --git a/whisper_live/lib/whisper_live_web/telemetry.ex b/whisper_live/lib/whisper_live_web/telemetry.ex new file mode 100644 index 00000000..c4d4a5dc --- /dev/null +++ b/whisper_live/lib/whisper_live_web/telemetry.ex @@ -0,0 +1,70 @@ +defmodule WhisperLiveWeb.Telemetry do + use Supervisor + import Telemetry.Metrics + + def start_link(arg) do + Supervisor.start_link(__MODULE__, arg, name: __MODULE__) + end + + @impl true + def init(_arg) do + children = [ + # Telemetry poller will execute the given period measurements + # every 10_000ms. Learn more here: https://hexdocs.pm/telemetry_metrics + {:telemetry_poller, measurements: periodic_measurements(), period: 10_000} + # Add reporters as children of your supervision tree. + # {Telemetry.Metrics.ConsoleReporter, metrics: metrics()} + ] + + Supervisor.init(children, strategy: :one_for_one) + end + + def metrics do + [ + # Phoenix Metrics + summary("phoenix.endpoint.start.system_time", + unit: {:native, :millisecond} + ), + summary("phoenix.endpoint.stop.duration", + unit: {:native, :millisecond} + ), + summary("phoenix.router_dispatch.start.system_time", + tags: [:route], + unit: {:native, :millisecond} + ), + summary("phoenix.router_dispatch.exception.duration", + tags: [:route], + unit: {:native, :millisecond} + ), + summary("phoenix.router_dispatch.stop.duration", + tags: [:route], + unit: {:native, :millisecond} + ), + summary("phoenix.socket_connected.duration", + unit: {:native, :millisecond} + ), + sum("phoenix.socket_drain.count"), + summary("phoenix.channel_joined.duration", + unit: {:native, :millisecond} + ), + summary("phoenix.channel_handled_in.duration", + tags: [:event], + unit: {:native, :millisecond} + ), + + # VM Metrics + summary("vm.memory.total", unit: {:byte, :kilobyte}), + summary("vm.total_run_queue_lengths.total"), + summary("vm.total_run_queue_lengths.cpu"), + summary("vm.total_run_queue_lengths.io") + ] + end + + defp periodic_measurements do + [ + # A module, function and arguments to be invoked periodically. + # This function must call :telemetry.execute/3 and a metric must be added above. + # {WhisperLiveWeb, :count_users, []} + ] + end +end diff --git a/whisper_live/mix.exs b/whisper_live/mix.exs new file mode 100644 index 00000000..06984a14 --- /dev/null +++ b/whisper_live/mix.exs @@ -0,0 +1,81 @@ +defmodule WhisperLive.MixProject do + use Mix.Project + + def project do + [ + app: :whisper_live, + version: "0.1.0", + elixir: "~> 1.14", + elixirc_paths: elixirc_paths(Mix.env()), + start_permanent: Mix.env() == :prod, + aliases: aliases(), + deps: deps() + ] + end + + # Configuration for the OTP application. + # + # Type `mix help compile.app` for more information. + def application do + [ + mod: {WhisperLive.Application, []}, + extra_applications: [:logger, :runtime_tools] + ] + end + + # Specifies which paths to compile per environment. + defp elixirc_paths(:test), do: ["lib", "test/support"] + defp elixirc_paths(_), do: ["lib"] + + # Specifies your project dependencies. + # + # Type `mix help deps` for examples and options. + defp deps do + [ + {:phoenix, "~> 1.7.21"}, + {:phoenix_html, "~> 4.1"}, + {:phoenix_live_reload, "~> 1.2", only: :dev}, + {:phoenix_live_view, "~> 1.0"}, + {:floki, ">= 0.30.0", only: :test}, + {:phoenix_live_dashboard, "~> 0.8.3"}, + {:esbuild, "~> 0.8", runtime: Mix.env() == :dev}, + {:tailwind, "~> 0.2.0", runtime: Mix.env() == :dev}, + {:heroicons, + github: "tailwindlabs/heroicons", + tag: "v2.1.1", + sparse: "optimized", + app: false, + compile: false, + depth: 1}, + {:swoosh, "~> 1.5"}, + {:finch, "~> 0.13"}, + {:telemetry_metrics, "~> 1.0"}, + {:telemetry_poller, "~> 1.0"}, + {:gettext, "~> 0.26"}, + {:jason, "~> 1.2"}, + {:dns_cluster, "~> 0.1.1"}, + {:bandit, "~> 1.5"}, + {:temp, "~> 0.4.6"}, + + ] + end + + # Aliases are shortcuts or tasks specific to the current project. + # For example, to install project dependencies and perform other setup tasks, run: + # + # $ mix setup + # + # See the documentation for `Mix` for more info on aliases. + defp aliases do + [ + setup: ["deps.get", "assets.setup", "assets.build"], + "assets.setup": ["tailwind.install --if-missing", "esbuild.install --if-missing"], + "assets.build": ["tailwind whisper_live", "esbuild whisper_live"], + "assets.deploy": [ + "tailwind whisper_live --minify", + "esbuild whisper_live --minify", + "phx.digest" + ] + ] + end +end diff --git a/whisper_live/mix.lock b/whisper_live/mix.lock new file mode 100644 index 00000000..8788e1c4 --- /dev/null +++ b/whisper_live/mix.lock @@ -0,0 +1,36 @@ +%{ + "bandit": {:hex, :bandit, "1.7.0", "d1564f30553c97d3e25f9623144bb8df11f3787a26733f00b21699a128105c0c", [:mix], [{:hpax, "~> 1.0", [hex: :hpax, repo: "hexpm", optional: false]}, {:plug, "~> 1.18", [hex: :plug, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}, {:thousand_island, "~> 1.0", [hex: :thousand_island, repo: "hexpm", optional: false]}, {:websock, "~> 0.5", [hex: :websock, repo: "hexpm", optional: false]}], "hexpm", "3e2f7a98c7a11f48d9d8c037f7177cd39778e74d55c7af06fe6227c742a8168a"}, + "castore": {:hex, :castore, "1.0.14", "4582dd7d630b48cf5e1ca8d3d42494db51e406b7ba704e81fbd401866366896a", [:mix], [], "hexpm", "7bc1b65249d31701393edaaac18ec8398d8974d52c647b7904d01b964137b9f4"}, + "dns_cluster": {:hex, :dns_cluster, "0.1.3", "0bc20a2c88ed6cc494f2964075c359f8c2d00e1bf25518a6a6c7fd277c9b0c66", [:mix], [], "hexpm", "46cb7c4a1b3e52c7ad4cbe33ca5079fbde4840dedeafca2baf77996c2da1bc33"}, + "esbuild": {:hex, :esbuild, "0.10.0", "b0aa3388a1c23e727c5a3e7427c932d89ee791746b0081bbe56103e9ef3d291f", [:mix], [{:jason, "~> 1.4", [hex: :jason, repo: "hexpm", optional: false]}], "hexpm", "468489cda427b974a7cc9f03ace55368a83e1a7be12fba7e30969af78e5f8c70"}, + "expo": {:hex, :expo, "1.1.0", "f7b9ed7fb5745ebe1eeedf3d6f29226c5dd52897ac67c0f8af62a07e661e5c75", [:mix], [], "hexpm", "fbadf93f4700fb44c331362177bdca9eeb8097e8b0ef525c9cc501cb9917c960"}, + "file_system": {:hex, :file_system, "1.1.0", "08d232062284546c6c34426997dd7ef6ec9f8bbd090eb91780283c9016840e8f", [:mix], [], "hexpm", "bfcf81244f416871f2a2e15c1b515287faa5db9c6bcf290222206d120b3d43f6"}, + "finch": {:hex, :finch, "0.20.0", "5330aefb6b010f424dcbbc4615d914e9e3deae40095e73ab0c1bb0968933cadf", [:mix], [{:mime, "~> 1.0 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:mint, "~> 1.6.2 or ~> 1.7", [hex: :mint, repo: "hexpm", optional: false]}, {:nimble_options, "~> 0.4 or ~> 1.0", [hex: :nimble_options, repo: "hexpm", optional: false]}, {:nimble_pool, "~> 1.1", [hex: :nimble_pool, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "2658131a74d051aabfcba936093c903b8e89da9a1b63e430bee62045fa9b2ee2"}, + "floki": {:hex, :floki, "0.38.0", "62b642386fa3f2f90713f6e231da0fa3256e41ef1089f83b6ceac7a3fd3abf33", [:mix], [], "hexpm", "a5943ee91e93fb2d635b612caf5508e36d37548e84928463ef9dd986f0d1abd9"}, + "gettext": {:hex, :gettext, "0.26.2", "5978aa7b21fada6deabf1f6341ddba50bc69c999e812211903b169799208f2a8", [:mix], [{:expo, "~> 0.5.1 or ~> 1.0", [hex: :expo, repo: "hexpm", optional: false]}], "hexpm", "aa978504bcf76511efdc22d580ba08e2279caab1066b76bb9aa81c4a1e0a32a5"}, + "heroicons": {:git, "https://github.com/tailwindlabs/heroicons.git", "88ab3a0d790e6a47404cba02800a6b25d2afae50", [tag: "v2.1.1", sparse: "optimized", depth: 1]}, + "hpax": {:hex, :hpax, "1.0.3", "ed67ef51ad4df91e75cc6a1494f851850c0bd98ebc0be6e81b026e765ee535aa", [:mix], [], "hexpm", "8eab6e1cfa8d5918c2ce4ba43588e894af35dbd8e91e6e55c817bca5847df34a"}, + "jason": {:hex, :jason, "1.4.4", "b9226785a9aa77b6857ca22832cffa5d5011a667207eb2a0ad56adb5db443b8a", [:mix], [{:decimal, "~> 1.0 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm", "c5eb0cab91f094599f94d55bc63409236a8ec69a21a67814529e8d5f6cc90b3b"}, + "mime": {:hex, :mime, "2.0.7", "b8d739037be7cd402aee1ba0306edfdef982687ee7e9859bee6198c1e7e2f128", [:mix], [], "hexpm", "6171188e399ee16023ffc5b76ce445eb6d9672e2e241d2df6050f3c771e80ccd"}, + "mint": {:hex, :mint, "1.7.1", "113fdb2b2f3b59e47c7955971854641c61f378549d73e829e1768de90fc1abf1", [:mix], [{:castore, "~> 0.1.0 or ~> 1.0", [hex: :castore, repo: "hexpm", optional: true]}, {:hpax, "~> 0.1.1 or ~> 0.2.0 or ~> 1.0", [hex: :hpax, repo: "hexpm", optional: false]}], "hexpm", "fceba0a4d0f24301ddee3024ae116df1c3f4bb7a563a731f45fdfeb9d39a231b"}, + "nimble_options": {:hex, :nimble_options, "1.1.1", "e3a492d54d85fc3fd7c5baf411d9d2852922f66e69476317787a7b2bb000a61b", [:mix], [], "hexpm", "821b2470ca9442c4b6984882fe9bb0389371b8ddec4d45a9504f00a66f650b44"}, + "nimble_pool": {:hex, :nimble_pool, "1.1.0", "bf9c29fbdcba3564a8b800d1eeb5a3c58f36e1e11d7b7fb2e084a643f645f06b", [:mix], [], "hexpm", "af2e4e6b34197db81f7aad230c1118eac993acc0dae6bc83bac0126d4ae0813a"}, + "phoenix": {:hex, :phoenix, "1.7.21", "14ca4f1071a5f65121217d6b57ac5712d1857e40a0833aff7a691b7870fc9a3b", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.1", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.7", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.2 or ~> 2.0", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}, {:websock_adapter, "~> 0.5.3", [hex: :websock_adapter, repo: "hexpm", optional: false]}], "hexpm", "336dce4f86cba56fed312a7d280bf2282c720abb6074bdb1b61ec8095bdd0bc9"}, + "phoenix_html": {:hex, :phoenix_html, "4.2.1", "35279e2a39140068fc03f8874408d58eef734e488fc142153f055c5454fd1c08", [:mix], [], "hexpm", "cff108100ae2715dd959ae8f2a8cef8e20b593f8dfd031c9cba92702cf23e053"}, + "phoenix_live_dashboard": {:hex, :phoenix_live_dashboard, "0.8.7", "405880012cb4b706f26dd1c6349125bfc903fb9e44d1ea668adaf4e04d4884b7", [:mix], [{:ecto, "~> 3.6.2 or ~> 3.7", [hex: :ecto, repo: "hexpm", optional: true]}, {:ecto_mysql_extras, "~> 0.5", [hex: :ecto_mysql_extras, repo: "hexpm", optional: true]}, {:ecto_psql_extras, "~> 0.7", [hex: :ecto_psql_extras, repo: "hexpm", optional: true]}, {:ecto_sqlite3_extras, "~> 1.1.7 or ~> 1.2.0", [hex: :ecto_sqlite3_extras, repo: "hexpm", optional: true]}, {:mime, "~> 1.6 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.19 or ~> 1.0", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}, {:telemetry_metrics, "~> 0.6 or ~> 1.0", [hex: :telemetry_metrics, repo: "hexpm", optional: false]}], "hexpm", "3a8625cab39ec261d48a13b7468dc619c0ede099601b084e343968309bd4d7d7"}, + "phoenix_live_reload": {:hex, :phoenix_live_reload, "1.6.0", "2791fac0e2776b640192308cc90c0dbcf67843ad51387ed4ecae2038263d708d", [:mix], [{:file_system, "~> 0.2.10 or ~> 1.0", [hex: :file_system, repo: "hexpm", optional: false]}, {:phoenix, "~> 1.4", [hex: :phoenix, repo: "hexpm", optional: false]}], "hexpm", "b3a1fa036d7eb2f956774eda7a7638cf5123f8f2175aca6d6420a7f95e598e1c"}, + "phoenix_live_view": {:hex, :phoenix_live_view, "1.0.17", "beeb16d83a7d3760f7ad463df94e83b087577665d2acc0bf2987cd7d9778068f", [:mix], [{:floki, "~> 0.36", [hex: :floki, repo: "hexpm", optional: true]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6.15 or ~> 1.7.0 or ~> 1.8.0-rc", [hex: :phoenix, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 3.3 or ~> 4.0", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:plug, "~> 1.15", [hex: :plug, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "a4ca05c1eb6922c4d07a508a75bfa12c45e5f4d8f77ae83283465f02c53741e1"}, + "phoenix_pubsub": {:hex, :phoenix_pubsub, "2.1.3", "3168d78ba41835aecad272d5e8cd51aa87a7ac9eb836eabc42f6e57538e3731d", [:mix], [], "hexpm", "bba06bc1dcfd8cb086759f0edc94a8ba2bc8896d5331a1e2c2902bf8e36ee502"}, + "phoenix_template": {:hex, :phoenix_template, "1.0.4", "e2092c132f3b5e5b2d49c96695342eb36d0ed514c5b252a77048d5969330d639", [:mix], [{:phoenix_html, "~> 2.14.2 or ~> 3.0 or ~> 4.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}], "hexpm", "2c0c81f0e5c6753faf5cca2f229c9709919aba34fab866d3bc05060c9c444206"}, + "plug": {:hex, :plug, "1.18.1", "5067f26f7745b7e31bc3368bc1a2b818b9779faa959b49c934c17730efc911cf", [:mix], [{:mime, "~> 1.0 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2 or ~> 2.0", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.3 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "57a57db70df2b422b564437d2d33cf8d33cd16339c1edb190cd11b1a3a546cc2"}, + "plug_crypto": {:hex, :plug_crypto, "2.1.1", "19bda8184399cb24afa10be734f84a16ea0a2bc65054e23a62bb10f06bc89491", [:mix], [], "hexpm", "6470bce6ffe41c8bd497612ffde1a7e4af67f36a15eea5f921af71cf3e11247c"}, + "swoosh": {:hex, :swoosh, "1.19.3", "02ad4455939f502386e4e1443d4de94c514995fd0e51b3cafffd6bd270ffe81c", [:mix], [{:bandit, ">= 1.0.0", [hex: :bandit, repo: "hexpm", optional: true]}, {:cowboy, "~> 1.1 or ~> 2.4", [hex: :cowboy, repo: "hexpm", optional: true]}, {:ex_aws, "~> 2.1", [hex: :ex_aws, repo: "hexpm", optional: true]}, {:finch, "~> 0.6", [hex: :finch, repo: "hexpm", optional: true]}, {:gen_smtp, "~> 0.13 or ~> 1.0", [hex: :gen_smtp, repo: "hexpm", optional: true]}, {:hackney, "~> 1.9", [hex: :hackney, repo: "hexpm", optional: true]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:mail, "~> 0.2", [hex: :mail, repo: "hexpm", optional: true]}, {:mime, "~> 1.1 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:mua, "~> 0.2.3", [hex: :mua, repo: "hexpm", optional: true]}, {:multipart, "~> 0.4", [hex: :multipart, repo: "hexpm", optional: true]}, {:plug, "~> 1.9", [hex: :plug, repo: "hexpm", optional: true]}, {:plug_cowboy, ">= 1.0.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:req, "~> 0.5.10 or ~> 0.6 or ~> 1.0", [hex: :req, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "04a10f8496786b744b84130e3510eb53ca51e769c39511b65023bdf4136b732f"}, + "tailwind": {:hex, :tailwind, "0.2.4", "5706ec47182d4e7045901302bf3a333e80f3d1af65c442ba9a9eed152fb26c2e", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}], "hexpm", "c6e4a82b8727bab593700c998a4d98cf3d8025678bfde059aed71d0000c3e463"}, + "telemetry": {:hex, :telemetry, "1.3.0", "fedebbae410d715cf8e7062c96a1ef32ec22e764197f70cda73d82778d61e7a2", [:rebar3], [], "hexpm", "7015fc8919dbe63764f4b4b87a95b7c0996bd539e0d499be6ec9d7f3875b79e6"}, + "telemetry_metrics": {:hex, :telemetry_metrics, "1.1.0", "5bd5f3b5637e0abea0426b947e3ce5dd304f8b3bc6617039e2b5a008adc02f8f", [:mix], [{:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "e7b79e8ddfde70adb6db8a6623d1778ec66401f366e9a8f5dd0955c56bc8ce67"}, + "telemetry_poller": {:hex, :telemetry_poller, "1.3.0", "d5c46420126b5ac2d72bc6580fb4f537d35e851cc0f8dbd571acf6d6e10f5ec7", [:rebar3], [{:telemetry, "~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "51f18bed7128544a50f75897db9974436ea9bfba560420b646af27a9a9b35211"}, + "temp": {:hex, :temp, "0.4.9", "eb6355bfa7925a568b3d9eb3bb57e89aa6d2b78bfe8dfb6b698e090631b7f41f", [:mix], [], "hexpm", "bc8bf7b27d9105bef933ef4bf4ba37ac6b899dbeba329deaa88c60b62d6b4b6d"}, + "thousand_island": {:hex, :thousand_island, "1.3.14", "ad45ebed2577b5437582bcc79c5eccd1e2a8c326abf6a3464ab6c06e2055a34a", [:mix], [{:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "d0d24a929d31cdd1d7903a4fe7f2409afeedff092d277be604966cd6aa4307ef"}, + "websock": {:hex, :websock, "0.5.3", "2f69a6ebe810328555b6fe5c831a851f485e303a7c8ce6c5f675abeb20ebdadc", [:mix], [], "hexpm", "6105453d7fac22c712ad66fab1d45abdf049868f253cf719b625151460b8b453"}, + "websock_adapter": {:hex, :websock_adapter, "0.5.8", "3b97dc94e407e2d1fc666b2fb9acf6be81a1798a2602294aac000260a7c4a47d", [:mix], [{:bandit, ">= 0.6.0", [hex: :bandit, repo: "hexpm", optional: true]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.6", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:websock, "~> 0.5", [hex: :websock, repo: "hexpm", optional: false]}], "hexpm", "315b9a1865552212b5f35140ad194e67ce31af45bcee443d4ecb96b5fd3f3782"}, +} diff --git a/whisper_live/priv/gettext/en/LC_MESSAGES/errors.po b/whisper_live/priv/gettext/en/LC_MESSAGES/errors.po new file mode 100644 index 00000000..cdec3a11 --- /dev/null +++ b/whisper_live/priv/gettext/en/LC_MESSAGES/errors.po @@ -0,0 +1,11 @@ +## `msgid`s in this file come from POT (.pot) files. +## +## Do not add, change, or remove `msgid`s manually here as +## they're tied to the ones in the corresponding POT file +## (with the same domain). +## +## Use `mix gettext.extract --merge` or `mix gettext.merge` +## to merge POT files into PO files. +msgid "" +msgstr "" +"Language: en\n" diff --git a/whisper_live/priv/gettext/errors.pot b/whisper_live/priv/gettext/errors.pot new file mode 100644 index 00000000..d6f47fa8 --- /dev/null +++ b/whisper_live/priv/gettext/errors.pot @@ -0,0 +1,10 @@ +## This is a PO Template file. +## +## `msgid`s here are often extracted from source code. +## Add new translations manually only if they're dynamic +## translations that can't be statically extracted. +## +## Run `mix gettext.extract` to bring this file up to +## date. Leave `msgstr`s empty as changing them here has no +## effect: edit them in PO (`.po`) files instead. + diff --git a/whisper_live/priv/static/favicon-91f37b602a111216f1eef3aa337ad763.ico b/whisper_live/priv/static/favicon-91f37b602a111216f1eef3aa337ad763.ico new file mode 100644 index 00000000..7f372bfc Binary files /dev/null and b/whisper_live/priv/static/favicon-91f37b602a111216f1eef3aa337ad763.ico differ diff --git a/whisper_live/priv/static/favicon.ico b/whisper_live/priv/static/favicon.ico new file mode 100644 index 00000000..7f372bfc Binary files /dev/null and b/whisper_live/priv/static/favicon.ico differ diff --git a/whisper_live/priv/static/images/logo-06a11be1f2cdde2c851763d00bdd2e80.svg b/whisper_live/priv/static/images/logo-06a11be1f2cdde2c851763d00bdd2e80.svg new file mode 100644 index 00000000..9f26baba --- /dev/null +++ b/whisper_live/priv/static/images/logo-06a11be1f2cdde2c851763d00bdd2e80.svg @@ -0,0 +1,6 @@ + diff --git a/whisper_live/priv/static/images/logo-06a11be1f2cdde2c851763d00bdd2e80.svg.gz b/whisper_live/priv/static/images/logo-06a11be1f2cdde2c851763d00bdd2e80.svg.gz new file mode 100644 index 00000000..1f3179ce Binary files /dev/null and b/whisper_live/priv/static/images/logo-06a11be1f2cdde2c851763d00bdd2e80.svg.gz differ diff --git a/whisper_live/priv/static/images/logo.svg b/whisper_live/priv/static/images/logo.svg new file mode 100644 index 00000000..9f26baba --- /dev/null +++ b/whisper_live/priv/static/images/logo.svg @@ -0,0 +1,6 @@ + diff --git a/whisper_live/priv/static/images/logo.svg.gz b/whisper_live/priv/static/images/logo.svg.gz new file mode 100644 index 00000000..1f3179ce Binary files /dev/null and b/whisper_live/priv/static/images/logo.svg.gz differ diff --git a/whisper_live/priv/static/robots-9e2c81b0855bbff2baa8371bc4a78186.txt b/whisper_live/priv/static/robots-9e2c81b0855bbff2baa8371bc4a78186.txt new file mode 100644 index 00000000..26e06b5f --- /dev/null +++ b/whisper_live/priv/static/robots-9e2c81b0855bbff2baa8371bc4a78186.txt @@ -0,0 +1,5 @@ +# See https://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file +# +# To ban all spiders from the entire site uncomment the next two lines: +# User-agent: * +# Disallow: / diff --git a/whisper_live/priv/static/robots-9e2c81b0855bbff2baa8371bc4a78186.txt.gz b/whisper_live/priv/static/robots-9e2c81b0855bbff2baa8371bc4a78186.txt.gz new file mode 100644 index 00000000..043be337 Binary files /dev/null and b/whisper_live/priv/static/robots-9e2c81b0855bbff2baa8371bc4a78186.txt.gz differ diff --git a/whisper_live/priv/static/robots.txt b/whisper_live/priv/static/robots.txt new file mode 100644 index 00000000..26e06b5f --- /dev/null +++ b/whisper_live/priv/static/robots.txt @@ -0,0 +1,5 @@ +# See https://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file +# +# To ban all spiders from the entire site uncomment the next two lines: +# User-agent: * +# Disallow: / diff --git a/whisper_live/priv/static/robots.txt.gz b/whisper_live/priv/static/robots.txt.gz new file mode 100644 index 00000000..043be337 Binary files /dev/null and b/whisper_live/priv/static/robots.txt.gz differ diff --git a/whisper_live/recordings/recording_1752601669350.wav b/whisper_live/recordings/recording_1752601669350.wav new file mode 100644 index 00000000..0fa4041e Binary files /dev/null and b/whisper_live/recordings/recording_1752601669350.wav differ diff --git a/whisper_live/recordings/recording_1752602147301.wav b/whisper_live/recordings/recording_1752602147301.wav new file mode 100644 index 00000000..581f28c0 Binary files /dev/null and b/whisper_live/recordings/recording_1752602147301.wav differ diff --git a/whisper_live/recordings/recording_1752605184367.wav b/whisper_live/recordings/recording_1752605184367.wav new file mode 100644 index 00000000..4f0c900f Binary files /dev/null and b/whisper_live/recordings/recording_1752605184367.wav differ diff --git a/whisper_live/recordings/recording_1752605420377.wav b/whisper_live/recordings/recording_1752605420377.wav new file mode 100644 index 00000000..9c083894 Binary files /dev/null and b/whisper_live/recordings/recording_1752605420377.wav differ diff --git a/whisper_live/test/support/conn_case.ex b/whisper_live/test/support/conn_case.ex new file mode 100644 index 00000000..e217f0c0 --- /dev/null +++ b/whisper_live/test/support/conn_case.ex @@ -0,0 +1,37 @@ +defmodule WhisperLiveWeb.ConnCase do + @moduledoc """ + This module defines the test case to be used by + tests that require setting up a connection. + + Such tests rely on `Phoenix.ConnTest` and also + import other functionality to make it easier + to build common data structures and query the data layer. + + Finally, if the test case interacts with the database, + we enable the SQL sandbox, so changes done to the database + are reverted at the end of every test. If you are using + PostgreSQL, you can even run database tests asynchronously + by setting `use WhisperLiveWeb.ConnCase, async: true`, although + this option is not recommended for other databases. + """ + + use ExUnit.CaseTemplate + + using do + quote do + # The default endpoint for testing + @endpoint WhisperLiveWeb.Endpoint + + use WhisperLiveWeb, :verified_routes + + # Import conveniences for testing with connections + import Plug.Conn + import Phoenix.ConnTest + import WhisperLiveWeb.ConnCase + end + end + + setup _tags do + {:ok, conn: Phoenix.ConnTest.build_conn()} + end +end diff --git a/whisper_live/test/test_helper.exs b/whisper_live/test/test_helper.exs new file mode 100644 index 00000000..869559e7 --- /dev/null +++ b/whisper_live/test/test_helper.exs @@ -0,0 +1 @@ +ExUnit.start() diff --git a/whisper_live/test/whisper_live_web/controllers/error_html_test.exs b/whisper_live/test/whisper_live_web/controllers/error_html_test.exs new file mode 100644 index 00000000..e6c0b6b5 --- /dev/null +++ b/whisper_live/test/whisper_live_web/controllers/error_html_test.exs @@ -0,0 +1,14 @@ +defmodule WhisperLiveWeb.ErrorHTMLTest do + use WhisperLiveWeb.ConnCase, async: true + + # Bring render_to_string/4 for testing custom views + import Phoenix.Template + + test "renders 404.html" do + assert render_to_string(WhisperLiveWeb.ErrorHTML, "404", "html", []) == "Not Found" + end + + test "renders 500.html" do + assert render_to_string(WhisperLiveWeb.ErrorHTML, "500", "html", []) == "Internal Server Error" + end +end diff --git a/whisper_live/test/whisper_live_web/controllers/error_json_test.exs b/whisper_live/test/whisper_live_web/controllers/error_json_test.exs new file mode 100644 index 00000000..7a365e69 --- /dev/null +++ b/whisper_live/test/whisper_live_web/controllers/error_json_test.exs @@ -0,0 +1,12 @@ +defmodule WhisperLiveWeb.ErrorJSONTest do + use WhisperLiveWeb.ConnCase, async: true + + test "renders 404" do + assert WhisperLiveWeb.ErrorJSON.render("404.json", %{}) == %{errors: %{detail: "Not Found"}} + end + + test "renders 500" do + assert WhisperLiveWeb.ErrorJSON.render("500.json", %{}) == + %{errors: %{detail: "Internal Server Error"}} + end +end diff --git a/whisper_live/test/whisper_live_web/controllers/page_controller_test.exs b/whisper_live/test/whisper_live_web/controllers/page_controller_test.exs new file mode 100644 index 00000000..a2189c5e --- /dev/null +++ b/whisper_live/test/whisper_live_web/controllers/page_controller_test.exs @@ -0,0 +1,8 @@ +defmodule WhisperLiveWeb.PageControllerTest do + use WhisperLiveWeb.ConnCase + + test "GET /", %{conn: conn} do + conn = get(conn, ~p"/") + assert html_response(conn, 200) =~ "Peace of mind from prototype to production" + end +end