sujiko 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: efc1d04c17508c044c19cfa9ee51f71e00ca0635b8ea2c586aee4f603fde90a1
+  data.tar.gz: 51aaee86eab07a1afe5854b9e5839db56e58b1c3b2620473b78978a80193d86a
+SHA512:
+  metadata.gz: c5274ff9cd50ec4f25400acfbf68b254f79098a8dfbc6fc4ce8c99e0da983fd49d2ff7d1a1df59a970136af1415c4251f197bc583090456905e7dba6fcf1efca
+  data.tar.gz: 933de2d231eadfee62a2523ebc126cab5df6dca857bc0bf387649de4ff736e8e830dd70d5b5003e256d5a7f0b24a2132f36030429a98ebd1c4f5410eed7c1ae9

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2026 TODO: Write your name
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,77 @@
+# Sujiko
+
+**当然ジョーク用（お遊び）の gem です**  
+**This is a joke / toy gem — for fun and local experiments, not for production use.**
+
+A local development server for a **venue meetup map**: one `GET /` page with optional query parameters `shape`, `x`, and `y` (same rules as a Rails `SpotsController`-style app and the iOS URL builder). Normalized coordinates `0.0`–`1.0` with the top-left of the white floor as origin; `shape` picks the room (e.g. `roomA` → `room_a` after normalization). The server listens on `127.0.0.1` and, on macOS, opens your default browser on startup.
+
+Example: `http://127.0.0.1:4567/?shape=roomA&x=0.3&y=0.4`
+
+## Installation
+
+With Bundler, add to your `Gemfile`:
+
+```bash
+bundle add sujiko
+```
+
+Without Bundler:
+
+```bash
+gem install sujiko
+```
+
+## Usage
+
+### CLI
+
+```bash
+sujiko                    # default port 4567
+sujiko 3000              # custom port
+```
+
+`--public-origin` / `-o` sets the **origin** (scheme, host, optional non-default port only—no path, query, or userinfo) for **copied** “meetup” URLs. If omitted, the page uses the browser’s current `location.origin`, same as before.
+
+From a cloned repository:
+
+```bash
+bundle exec sujiko
+```
+
+| Environment | Effect |
+|-------------|--------|
+| `SUJIKO_NO_BROWSER` | If set, the server does not open a browser on startup. |
+
+### `GET /` query parameters
+
+| Name | Meaning |
+|------|---------|
+| `shape` | Venue id (e.g. `roomA`); normalized server-side to internal ids like `room_a` / `room_b` / `room_c` / `room_main`. |
+| `x`, `y` | Normalized position on the white floor, each `0.0`–`1.0` (clamped; parse failures fall back to `0.5`). |
+
+The page reads these from the URL on load; use **Copy** in the UI to get a `?shape&x&y` link you can open in Safari or share. The copied URL’s **origin** follows `--public-origin` when the server was started with it; otherwise it matches the page you are viewing.
+
+### Programmatically
+
+```ruby
+require "sujiko"
+
+Sujiko::Server.start
+Sujiko::Server.start(port: 8080)
+```
+
+Press `Ctrl-C` to stop the server.
+
+## Development
+
+After checkout, run `bin/setup` to install dependencies. Use `bin/console` for an interactive session.
+
+`bundle exec rake install` installs the gem locally. To release, bump the version in `lib/sujiko/version.rb` and run `bundle exec rake release` (creates a git tag, pushes commits, uploads the `.gem` to [rubygems.org](https://rubygems.org)).
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub: https://github.com/tutuitakumi/sujiko
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+require "bundler/gem_tasks"
+task default: %i[]

data/exe/sujiko

@@ -0,0 +1,22 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+require "optparse"
+require "sujiko"
+
+options = { port: nil, public_origin: nil }
+parser = OptionParser.new do |opts|
+  opts.banner = "Usage: sujiko [options] [PORT]\n\n"
+  opts.on(
+    "-o", "--public-origin URL",
+    "Origin for copied URLs (scheme://host[:port]; default: current page's location.origin)"
+  ) { |v| options[:public_origin] = v }
+  opts.on("-h", "--help", "Show this help") do
+    puts opts
+    exit 0
+  end
+end
+parser.parse!
+options[:port] = ARGV[0] if ARGV[0]
+
+Sujiko::Server.start(port: options[:port], public_origin: options[:public_origin])

data/lib/sujiko/server.rb

@@ -0,0 +1,188 @@
+# frozen_string_literal: true
+
+require "erb"
+require "json"
+require "rbconfig"
+require "socket"
+require "uri"
+
+module Sujiko
+  class Server
+    DEFAULT_PORT = 4567
+    MAX_REQUEST_HEADER_SIZE = 16_384
+    TEMPLATE = File.expand_path("templates/index.html.erb", __dir__)
+
+    def self.start(port: DEFAULT_PORT, public_origin: nil, out: $stdout, err: $stderr)
+      port = DEFAULT_PORT if port.nil?
+      new(port, out, err, public_origin).start
+    end
+
+    def start
+      port = resolve_port
+      html = render_template(port:)
+      base_url = "http://127.0.0.1:#{port}"
+      body_utf8 = html.encode(Encoding::UTF_8)
+
+      server = nil
+      server = TCPServer.new("127.0.0.1", port)
+      trap("INT") { server&.close }
+      @out.puts "Sujiko: #{base_url} (Ctrl-C で停止)"
+      try_open_browser(base_url, @err)
+
+      loop do
+        socket = server.accept
+        begin
+          handle_socket(socket, body_utf8)
+        ensure
+          socket.close
+        end
+      end
+    rescue Errno::EBADF, Errno::EINVAL, IOError
+      # 終了: `accept` 中にソケットを閉じたあと
+    ensure
+      server&.close
+    end
+
+    private
+
+    def initialize(port, out, err, public_origin = nil)
+      @port_argument = port
+      @out = out
+      @err = err
+      @public_origin = validate_public_origin(public_origin)
+    end
+
+    def render_template(port:)
+      body = File.read(TEMPLATE, encoding: "UTF-8")
+      title = "Sujiko"
+      # text/ruby 内で `COPY_PUBLIC_ORIGIN = <%= copy_public_origin_ruby %>` として埋め込む（JSON の文字列リテラル = Ruby と互換のエスケープ）
+      copy_public_origin_ruby = @public_origin.nil? ? "nil" : JSON.generate(@public_origin)
+      ERB.new(body).result(binding)
+    end
+
+    def validate_public_origin(raw)
+      return nil if raw.nil?
+
+      s = raw.to_s.strip
+      return nil if s.empty?
+
+      u = URI.parse(s)
+      unless %w[http https].include?(u.scheme)
+        @err.puts "Sujiko: public_origin は http または https である必要があります。無視します: #{raw.inspect}"
+        return nil
+      end
+      unless u.host
+        @err.puts "Sujiko: public_origin にホストがありません。無視します: #{raw.inspect}"
+        return nil
+      end
+      if u.user || u.password
+        @err.puts "Sujiko: public_origin にユーザー情報は付けないでください。無視します: #{raw.inspect}"
+        return nil
+      end
+      if u.query || u.fragment
+        @err.puts "Sujiko: public_origin にクエリ・フラグメントは付けないでください。無視します: #{raw.inspect}"
+        return nil
+      end
+
+      pth = u.path
+      if pth && pth != "" && pth != "/"
+        @err.puts "Sujiko: public_origin にパスは付けないでください。無視します: #{raw.inspect}"
+        return nil
+      end
+
+      out = +"#{u.scheme}://#{u.host}"
+      out << ":#{u.port}" if u.port && !((u.scheme == "http" && u.port == 80) || (u.scheme == "https" && u.port == 443))
+      out
+    rescue URI::InvalidURIError
+      @err.puts "Sujiko: public_origin を解釈できません。無視します: #{raw.inspect}"
+      nil
+    end
+
+    def resolve_port
+      p = @port_argument
+      return DEFAULT_PORT if p.nil?
+
+      s = p.to_s
+      return DEFAULT_PORT if s.empty?
+
+      n = Integer(s, 10)
+      n.positive? ? n : DEFAULT_PORT
+    rescue ArgumentError, TypeError
+      DEFAULT_PORT
+    end
+
+    def try_open_browser(url, err)
+      return if ENV["SUJIKO_NO_BROWSER"]
+
+      if RbConfig::CONFIG["host_os"] =~ /darwin|mac os/
+        system("open", url)
+      elsif RbConfig::CONFIG["host_os"] =~ /mswin|mingw|cygwin|bccwin|wince/
+        system("start", "", url)
+      else
+        system("xdg-open", url) # XDG on Linux/Unix
+      end
+    rescue StandardError => e
+      err.puts "ブラウザを開けませんでした: #{e.message}"
+    end
+
+    def handle_socket(socket, body_utf8)
+      first_line = read_request_line(socket)
+      if first_line.nil? || first_line !~ %r{^[A-Z]+\s}
+        write_text_response(socket, 400, "Bad Request", "")
+        return
+      end
+
+      method = first_line.split(/\s+/, 2).first
+      case method
+      when "GET"
+        write_html_response(socket, body_utf8, head_only: false)
+      when "HEAD"
+        write_html_response(socket, body_utf8, head_only: true)
+      else
+        write_text_response(socket, 405, "Method Not Allowed", "")
+      end
+    end
+
+    def read_request_line(socket)
+      buf = +""
+      until request_headers_complete?(buf)
+        if buf.bytesize > MAX_REQUEST_HEADER_SIZE
+          return
+        end
+
+        data = socket.readpartial(8_192)
+        return if data.nil? || data.empty?
+
+        buf << data
+      end
+      buf.split("\r\n", 2).first
+    rescue EOFError, Errno::ECONNRESET, Errno::EPIPE, IOError
+      nil
+    end
+
+    def request_headers_complete?(buf)
+      buf.end_with?("\r\n\r\n") || buf.match?(%r{\r\n\r\n|\n\n})
+    end
+
+    def write_html_response(socket, body_utf8, head_only:)
+      payload = head_only ? +"" : body_utf8
+      header = "HTTP/1.1 200 OK\r\n" \
+        "Content-Type: text/html; charset=utf-8\r\n" \
+        "Content-Length: #{body_utf8.bytesize}\r\n" \
+        "Connection: close\r\n" \
+        "\r\n"
+      socket.write(header.b)
+      socket.write(payload.b) unless payload.empty?
+    end
+
+    def write_text_response(socket, status, message, _body = "")
+      text = "HTTP/1.1 #{status} #{message}\r\n" \
+        "Content-Length: 0\r\n" \
+        "Connection: close\r\n" \
+        "\r\n"
+      socket.write(text.b)
+    end
+
+    private_class_method :new
+  end
+end

data/lib/sujiko/templates/index.html.erb

@@ -0,0 +1,483 @@
+<!DOCTYPE html>
+<html lang="ja">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title><%= title %></title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Space+Mono:wght@400;700&family=Syne:wght@700;800&display=swap" rel="stylesheet" />
+    <style>
+      * { box-sizing: border-box; }
+      body { font-family: system-ui, sans-serif; margin: 2rem; color: #111; }
+      .server-meta { color: #666; font-size: 0.9rem; margin-top: 0.5rem; }
+      .title-bar {
+        max-width: 24rem; padding: 0.5rem 0.75rem; margin-bottom: 0.5rem;
+        border: 1px solid #e0e0e0; border-radius: 6px; background: #fafafa;
+        font-size: 1.1rem; font-weight: 600;
+      }
+      .venue-block { max-width: min(100vw - 2rem, 24rem); margin-top: 1rem; }
+      .mae {
+        text-align: center; font-size: 0.85rem; color: #333;
+        margin-bottom: 0.2rem; letter-spacing: 0.1em;
+      }
+      #venue-floor {
+        position: relative; aspect-ratio: 1 / 1; width: 100%;
+        border: 3px solid #000; background: #fff; cursor: crosshair;
+        touch-action: none;
+      }
+      .shape-row { margin: 0.75rem 0; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
+      .shape-row label { font-size: 0.9rem; }
+      .shape-row select { font: inherit; padding: 0.2rem 0.4rem; }
+      .pin-wrap {
+        position: absolute; left: 0; top: 0; display: flex; flex-direction: column; align-items: center;
+        transform: translate(-50%, -100%); margin-top: -0.3rem; pointer-events: none;
+        white-space: nowrap; visibility: hidden;
+      }
+      .pin-wrap.is-visible { visibility: visible; }
+      .label-kokohen { font-size: 0.75rem; color: #c00; font-weight: 600; }
+      .label-arrow { font-size: 0.85rem; line-height: 1; color: #c00; }
+      .meeting-point {
+        width: 12px; height: 12px; border-radius: 50%;
+        background: #c00; box-shadow: 0 0 0 1px #fff, 0 0 0 2px #c00; margin-top: 0.1rem; flex-shrink: 0;
+      }
+      .copy-row { margin: 0.75rem 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
+      .copy-row button {
+        font: inherit; padding: 0.35rem 0.75rem; cursor: pointer;
+        border: 1px solid #333; border-radius: 6px; background: #fff;
+      }
+      .copy-row button:hover { background: #f3f3f3; }
+      #copy-url-status { font-size: 0.85rem; color: #0a0; min-height: 1.2em; }
+      /* シネマティック（LP 断片風） */
+      #cinematic-root {
+        position: fixed; inset: 0; z-index: 100000; pointer-events: none;
+        display: flex; align-items: center; justify-content: center;
+        font-family: "Syne", "Inter", system-ui, sans-serif; color: #f2ece4;
+        visibility: hidden; opacity: 0; transition: opacity 0.35s ease, visibility 0.35s;
+      }
+      #cinematic-root.is-open { visibility: visible; opacity: 1; pointer-events: auto; }
+      .cinematic__dim {
+        position: absolute; inset: 0; background: #030303; opacity: 0; transition: opacity 0.45s ease;
+        box-shadow: inset 0 0 120px rgba(0,0,0,0.9);
+      }
+      .cinematic__dim.is-on { opacity: 1; }
+      .cinematic__stage {
+        position: relative; z-index: 1; width: 100%; max-width: 32rem; min-height: 60vh; padding: 2rem 1.5rem;
+        display: flex; flex-direction: column; align-items: stretch; justify-content: center;
+        overflow: hidden;
+      }
+      .cinematic__beat {
+        position: absolute; left: 1.5rem; right: 1.5rem; text-align: left;
+        font-weight: 800; line-height: 0.95; letter-spacing: -0.04em; opacity: 0; will-change: transform, opacity;
+      }
+      .cinematic__beat--title { font-size: clamp(2.2rem, 9vw, 3.5rem); top: 22%; }
+      .cinematic__beat--venue { font-size: clamp(1.6rem, 6vw, 2.4rem); top: 38%; }
+      @keyframes cine-in-left {
+        from { opacity: 0; transform: translate3d(-12%, 0, 0) skewX(-2deg); }
+        70% { opacity: 1; transform: translate3d(2%, 0, 0) skewX(0deg); }
+        to { opacity: 1; transform: translate3d(0, 0, 0); }
+      }
+      @keyframes cine-out-left {
+        to { opacity: 0; transform: translate3d(18%, 0, 0) skewX(3deg); }
+      }
+      @keyframes cine-in-right {
+        from { opacity: 0; transform: translate3d(14%, 0, 0) skewX(3deg); }
+        70% { opacity: 1; transform: translate3d(-1%, 0, 0); }
+        to { opacity: 1; transform: translate3d(0, 0, 0); }
+      }
+      @keyframes cine-out-right {
+        to { opacity: 0; transform: translate3d(-16%, 0, 0); }
+      }
+      .cinematic__beat.is-in--title   { animation: cine-in-left 0.75s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
+      .cinematic__beat.is-out--title  { animation: cine-out-left 0.45s ease-in forwards; }
+      .cinematic__beat.is-in--venue   { animation: cine-in-right 0.75s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
+      .cinematic__beat.is-out--venue  { animation: cine-out-right 0.45s ease-in forwards; }
+      .cinematic__dot {
+        position: absolute; left: 50%; top: 50%; width: min(32vmin, 10rem); height: min(32vmin, 10rem);
+        margin: calc(min(32vmin, 10rem) / -2) 0 0 calc(min(32vmin, 10rem) / -2);
+        border-radius: 50%; background: radial-gradient(circle at 40% 35%, #ff2a4a, #8a0000 62%, #1a0000 100%);
+        box-shadow: 0 0 0 1px #fff, 0 0 80px rgba(255,0,40,0.5), 0 0 140px rgba(255,0,60,0.25);
+        opacity: 0; pointer-events: none;
+      }
+      @keyframes cine-pulse {
+        0% { transform: scale(0.25); opacity: 0.4; }
+        40% { transform: scale(1.15); opacity: 1; }
+        100% { transform: scale(0.88); opacity: 0.92; }
+      }
+      .cinematic__dot.is-pulsing { animation: cine-pulse 0.52s ease-in-out 3; opacity: 1; }
+      .cinematic__final {
+        position: relative; z-index: 2; width: 100%;
+        border-left: 4px solid #e11; padding-left: 1.25rem; padding-top: 0.5rem; padding-bottom: 1rem;
+        opacity: 0; transform: translate3d(0, 1rem, 0) skewY(0.3deg);
+        transition: opacity 0.55s ease 0.1s, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.1s;
+      }
+      .cinematic__final.is-visible { opacity: 1; transform: translate3d(0, 0, 0) skewY(0); }
+      .cinematic__final kbd {
+        display: block; font-size: 0.65rem; font-family: "Space Mono", ui-monospace, monospace;
+        text-transform: uppercase; letter-spacing: 0.2em; color: #888; margin-bottom: 0.5rem;
+      }
+      .cinematic__row { margin: 0.6rem 0 1.1rem; }
+      .cinematic__row--venue .cinematic__final-venue { font-size: clamp(1.8rem, 6vw, 2.5rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; }
+      .cinematic__row-label { font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; color: #6a6a6a; margin-bottom: 0.15rem; }
+      .cinematic__row-body { font-size: 1rem; font-weight: 600; }
+      .cinematic__row-body--mono { font-family: "Space Mono", ui-monospace, monospace; font-size: 0.95rem; color: #c8beb4; }
+      .cinematic__back {
+        margin-top: 1.5rem; align-self: flex-start; cursor: pointer;
+        font: 600 0.8rem "Syne", sans-serif; letter-spacing: 0.2em; text-transform: uppercase;
+        padding: 0.65rem 1.2rem; background: transparent; color: #f2ece4;
+        border: 1px solid #444; border-radius: 0; transition: background 0.2s, color 0.2s, border-color 0.2s;
+      }
+      .cinematic__back:hover, .cinematic__back:focus-visible { background: #e11; border-color: #e11; color: #fff; outline: none; }
+      @media (prefers-reduced-motion: reduce) {
+        .cinematic__beat, .cinematic__dot { animation: none !important; }
+        .cinematic__beat--title, .cinematic__beat--venue { opacity: 1 !important; transform: none !important; }
+        .cinematic__dot { opacity: 0.9; transform: scale(0.5); }
+      }
+    </style>
+  </head>
+  <body>
+    <h1><%= title %></h1>
+    <div class="title-bar" id="page-venue-title">場所：えー</div>
+    <div class="shape-row">
+      <label for="venue-shape">会場 (shape)</label>
+      <select id="venue-shape" aria-label="会場">
+        <option value="room_a">roomA / えー</option>
+        <option value="room_b">roomB / びー</option>
+        <option value="room_c">roomC / しー</option>
+        <option value="room_main">roomMain / めいんありーな</option>
+      </select>
+    </div>
+    <div class="copy-row">
+      <button type="button" id="copy-url-button">待ち合わせURLをコピー</button>
+      <span id="copy-url-status" class="copy-url-status" aria-live="polite"></span>
+    </div>
+    <div class="venue-block">
+      <div class="mae">まえ</div>
+      <div id="venue-floor" role="img" aria-label="会場フロア。クリックで点を打ちます。">
+        <div id="pin-wrap" class="pin-wrap" aria-hidden="true">
+          <span class="label-kokohen">このへん</span>
+          <span class="label-arrow">↓</span>
+          <div class="meeting-point"></div>
+        </div>
+      </div>
+    </div>
+    <div id="cinematic-root" class="cinematic" aria-hidden="true" aria-modal="true" role="dialog" inert>
+      <div class="cinematic__dim" aria-hidden="true"></div>
+      <div class="cinematic__stage">
+        <h2 class="cinematic__beat cinematic__beat--title" id="cin-beat-title"></h2>
+        <p class="cinematic__beat cinematic__beat--venue" id="cin-beat-venue"></p>
+        <div class="cinematic__dot" id="cin-dot" role="presentation"></div>
+        <div class="cinematic__final" id="cin-final" aria-hidden="true">
+          <div class="cinematic__row">
+            <span class="cinematic__row-label">area</span>
+            <p class="cinematic__row-body" id="cin-area-body"></p>
+          </div>
+          <div class="cinematic__row">
+            <span class="cinematic__row-label">position</span>
+            <p class="cinematic__row-body cinematic__row-body--mono" id="cin-xy-body"></p>
+          </div>
+          <div class="cinematic__row cinematic__row--venue">
+            <span class="cinematic__row-label">会場</span>
+            <p class="cinematic__final-venue" id="cin-venue-body"></p>
+          </div>
+          <button type="button" class="cinematic__back" id="cin-back">戻る</button>
+        </div>
+      </div>
+    </div>
+    <script src="https://cdn.jsdelivr.net/npm/@ruby/4.0-wasm-wasi@latest/dist/browser.script.iife.js"></script>
+    <script>
+(function () {
+  var $ = function (id) { return document.getElementById(id); };
+  var root = function () { return $("cinematic-root"); };
+  var sleep = function (ms) { return new Promise(function (r) { setTimeout(r, ms); }); };
+  var escHandler = null;
+  function closeCinematic() {
+    if (escHandler) { document.removeEventListener("keydown", escHandler); escHandler = null; }
+    var el = root();
+    if (!el) return;
+    var dim = el.querySelector(".cinematic__dim");
+    var title = $("cin-beat-title");
+    var venue = $("cin-beat-venue");
+    var dot = $("cin-dot");
+    var final = $("cin-final");
+    if (final) { final.classList.remove("is-visible"); final.setAttribute("aria-hidden", "true"); }
+    if (title) { title.className = "cinematic__beat cinematic__beat--title"; title.textContent = ""; }
+    if (venue) { venue.className = "cinematic__beat cinematic__beat--venue"; venue.textContent = ""; }
+    if (dot) { dot.classList.remove("is-pulsing"); }
+    if (dim) dim.classList.remove("is-on");
+    el.classList.remove("is-open");
+    el.setAttribute("aria-hidden", "true");
+    el.setAttribute("inert", "");
+    document.body.style.overflow = "";
+  }
+  function fillFinal(p) {
+    var area = $("cin-area-body");
+    var xy = $("cin-xy-body");
+    var vn = $("cin-venue-body");
+    if (area) area.textContent = p.areaLabel != null ? p.areaLabel : "白フロア（会場図内）";
+    if (xy) {
+      var x = typeof p.x === "number" ? p.x : parseFloat(p.x) || 0.5;
+      var y = typeof p.y === "number" ? p.y : parseFloat(p.y) || 0.5;
+      xy.textContent = "x = " + x.toFixed(4) + "  ·  y = " + y.toFixed(4);
+    }
+    if (vn) vn.textContent = p.venueName != null ? p.venueName : "—";
+  }
+  function bindBack() {
+    var b = $("cin-back");
+    if (!b) return;
+    function h() { closeCinematic(); b.removeEventListener("click", h); }
+    b.addEventListener("click", h);
+  }
+  window.sujikoRunCinematic = async function sujikoRunCinematic(p) {
+    if (!p) return;
+    var el = root();
+    if (!el) return;
+    if (el.classList.contains("is-open")) return;
+    var dim = el.querySelector(".cinematic__dim");
+    var title = $("cin-beat-title");
+    var venueB = $("cin-beat-venue");
+    var dot = $("cin-dot");
+    var final = $("cin-final");
+    if (!title || !venueB || !dot || !final) return;
+    escHandler = function (e) {
+      if (e.key === "Escape") { e.preventDefault(); closeCinematic(); }
+    };
+    document.addEventListener("keydown", escHandler);
+    var titleText = p.title != null ? String(p.title) : "Sujiko";
+    var venueName = p.venueName != null ? String(p.venueName) : "—";
+    el.classList.add("is-open");
+    el.removeAttribute("inert");
+    el.setAttribute("aria-hidden", "false");
+    document.body.style.overflow = "hidden";
+    if (window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+      if (dim) dim.classList.add("is-on");
+      fillFinal(p);
+      final.classList.add("is-visible");
+      final.setAttribute("aria-hidden", "false");
+      var back = $("cin-back");
+      if (back) back.focus();
+      bindBack();
+      return;
+    }
+    if (dim) dim.classList.add("is-on");
+    await sleep(120);
+    title.textContent = titleText;
+    title.classList.add("is-in--title");
+    await sleep(800);
+    title.classList.remove("is-in--title");
+    title.classList.add("is-out--title");
+    await sleep(400);
+    title.classList.remove("is-out--title");
+    title.textContent = "";
+    title.className = "cinematic__beat cinematic__beat--title";
+    venueB.textContent = "場所：" + venueName;
+    venueB.classList.add("is-in--venue");
+    await sleep(820);
+    venueB.classList.remove("is-in--venue");
+    venueB.classList.add("is-out--venue");
+    await sleep(400);
+    venueB.classList.remove("is-out--venue");
+    venueB.textContent = "";
+    venueB.className = "cinematic__beat cinematic__beat--venue";
+    dot.classList.add("is-pulsing");
+    await sleep(1700);
+    dot.classList.remove("is-pulsing");
+    fillFinal(p);
+    final.classList.add("is-visible");
+    final.setAttribute("aria-hidden", "false");
+    await sleep(80);
+    var back2 = $("cin-back");
+    if (back2) back2.focus();
+    bindBack();
+  };
+})();
+    </script>
+    <script type="text/ruby">
+      require "js"
+      require "json"
+      APP_TITLE = <%= title.inspect %>
+      COPY_PUBLIC_ORIGIN = <%= copy_public_origin_ruby %>
+      # tmp/tmp.md: 正規化座標・URL・会場定義
+      VENUE_LABELS = {
+        "room_a" => "えー",
+        "room_b" => "びー",
+        "room_c" => "しー",
+        "room_main" => "めいんありーな"
+      }
+      def normalize_shape_key(raw)
+        s = raw.to_s.strip.downcase
+        s = s.delete("^a-z0-9")
+        case s
+        when "square", "rooma", "rubykaigia", ""
+          "room_a"
+        when "roomb", "rubykaigib"
+          "room_b"
+        when "roomc", "rubykaigic"
+          "room_c"
+        when "roommain", "mainarena"
+          "room_main"
+        when "room_a", "room_b", "room_c", "room_main"
+          s
+        else
+          "room_a"
+        end
+      end
+      def url_shape_value(key)
+        case key
+        when "room_a" then "roomA"
+        when "room_b" then "roomB"
+        when "room_c" then "roomC"
+        when "room_main" then "roomMain"
+        else "roomA"
+        end
+      end
+      def nfloat(v, default = 0.5)
+        f = Float(v)
+        f = f.nan? || f.infinite? ? default : f
+        [[f, 0.0].max, 1.0].min
+      rescue ArgumentError, TypeError
+        default
+      end
+      $window = JS.global
+      $doc = $window[:document]
+      def fnum(x)
+        return 0.0 if x.nil?
+        Float(String(x).to_s)
+      rescue ArgumentError, TypeError
+        0.0
+      end
+      def event_client_xy(e)
+        return [0.0, 0.0] if e.nil?
+        [fnum(e[:clientX]), fnum(e[:clientY])]
+      end
+      def rect_size(el)
+        r = el.getBoundingClientRect
+        { l: fnum(r[:left]), t: fnum(r[:top]), w: fnum(r[:width]), h: fnum(r[:height]) }
+      end
+      def read_query
+        s = String($window[:location][:search] || "")
+        s = s[1, s.size] if s[0] == "?"
+        h = {}
+        s.split("&").each do |pair|
+          k, v = pair.split("=", 2)
+          next if k.to_s.empty?
+          h[k] = (v or "")
+        end
+        h
+      end
+      def copy_url_origin
+        w = $window
+        if !COPY_PUBLIC_ORIGIN.nil? && !String(COPY_PUBLIC_ORIGIN).strip.empty?
+          return String(COPY_PUBLIC_ORIGIN).strip
+        end
+        String(w[:location][:origin])
+      end
+      def build_full_share_url(shape_key, x, y)
+        qx = format("%.4f", nfloat(x, 0.5))
+        qy = format("%.4f", nfloat(y, 0.5))
+        sv = url_shape_value(shape_key)
+        origin = copy_url_origin
+        path = String($window[:location][:pathname] || "/")
+        origin + path + "?" + "shape=" + sv + "&x=" + qx + "&y=" + qy
+      end
+      def copy_to_clipboard(text)
+        t = $doc.createElement("textarea")
+        t[:value] = text
+        st = t[:style]
+        st[:position] = "fixed"
+        st[:left] = "0"
+        st[:top] = "0"
+        st[:opacity] = "0"
+        b = $doc[:body]
+        b.appendChild(t)
+        t[:focus] rescue t.call(:focus) rescue nil
+        t.call(:select) rescue t.select
+        r = $doc.call(:execCommand, "copy")
+        b.removeChild(t)
+        r
+      end
+      def set_copy_status(status_el, message)
+        return unless status_el
+        status_el[:textContent] = message
+        w = $window
+        t = 2200
+        JS.global.setTimeout(-> { status_el[:textContent] = "" }, t) if message != ""
+        nil
+      end
+      def update_venue_title(el, shape_key)
+        name = VENUE_LABELS[shape_key] || "えー"
+        el[:textContent] = "場所：" + name
+      end
+      def set_pin(wrap, xN, yN, show)
+        st = wrap[:style]
+        st[:left] = (xN * 100.0).to_s + "%"
+        st[:top] = (yN * 100.0).to_s + "%"
+        if show
+          wrap.setAttribute("class", "pin-wrap is-visible")
+          wrap.setAttribute("aria-hidden", "false")
+        else
+          wrap.setAttribute("class", "pin-wrap")
+          wrap.setAttribute("aria-hidden", "true")
+        end
+        nil
+      end
+      def on_floor_click(floor_el, wrap, sel, title_el, e)
+        x, y = event_client_xy(e)
+        z = rect_size(floor_el)
+        rw = [z[:w], 0.0001].max
+        rh = [z[:h], 0.0001].max
+        xN = nfloat((x - z[:l]) / rw, 0.5)
+        yN = nfloat((y - z[:t]) / rh, 0.5)
+        key = String(sel[:value])
+        set_pin(wrap, xN, yN, true)
+        update_venue_title(title_el, key)
+        $share_x = xN
+        $share_y = yN
+      end
+      def on_copy_url(sel, status_el)
+        key = String(sel[:value])
+        x = nfloat($share_x, 0.5) rescue 0.5
+        y = nfloat($share_y, 0.5) rescue 0.5
+        url = build_full_share_url(key, x, y)
+        ok = copy_to_clipboard(url)
+        set_copy_status(status_el, ok ? "コピーしました" : "コピーに失敗しました")
+        if ok
+          vn = VENUE_LABELS[key] || "えー"
+          pl = { "title" => APP_TITLE, "venueName" => vn, "x" => x, "y" => y, "areaLabel" => "白フロア（会場図の黒枠内）" }
+          $window.call(:eval, "sujikoRunCinematic(#{JSON.generate(pl)})")
+        end
+        nil
+      end
+      $share_x = 0.5
+      $share_y = 0.5
+      fl = $doc.getElementById("venue-floor")
+      w = $doc.getElementById("pin-wrap")
+      sel = $doc.getElementById("venue-shape")
+      title_el = $doc.getElementById("page-venue-title")
+      copy_btn = $doc.getElementById("copy-url-button")
+      status_el = $doc.getElementById("copy-url-status")
+      if fl && w && sel && title_el && copy_btn && status_el
+        q = read_query
+        k = normalize_shape_key(q["shape"] || "roomA")
+        sel[:value] = k
+        update_venue_title(title_el, k)
+        x0 = nfloat(q["x"] || 0.5, 0.5)
+        y0 = nfloat(q["y"] || 0.5, 0.5)
+        if q["x"] && q["y"] && !q["x"].to_s.empty? && !q["y"].to_s.empty?
+          $share_x = x0
+          $share_y = y0
+          set_pin(w, x0, y0, true)
+        end
+        fl.addEventListener("click", proc { |e| on_floor_click(fl, w, sel, title_el, e) })
+        sel.addEventListener("change", proc {
+          k2 = String(sel[:value])
+          update_venue_title(title_el, k2)
+        })
+        copy_btn.addEventListener("click", proc { on_copy_url(sel, status_el) })
+        puts "ruby.wasm: #{RUBY_VERSION} (会場＋点 → コピーで ?shape&x&y 付きURL)"
+      else
+        warn "必須要素が足りません (venue-floor / pin-wrap / venue-shape / page-venue-title / copy 周り)"
+      end
+    </script>
+  </body>
+</html>

data/lib/sujiko/version.rb

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+module Sujiko
+  VERSION = "0.1.0"
+end

data/lib/sujiko.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+require_relative "sujiko/version"
+require_relative "sujiko/server"
+
+module Sujiko
+  class Error < StandardError; end
+end

data/sig/sujiko.rbs

@@ -0,0 +1,4 @@
+module Sujiko
+  VERSION: String
+  # See the writing guide of rbs: https://github.com/ruby/rbs#guides
+end

metadata

@@ -0,0 +1,65 @@
+--- !ruby/object:Gem::Specification
+name: sujiko
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- tutuitakumi
+autorequire:
+bindir: exe
+cert_chain: []
+date: 2026-04-23 00:00:00.000000000 Z
+dependencies: []
+description: |-
+  Sujiko is a joke / toy Ruby gem: a small TCP server for local development, not for serious or
+  production use. It serves one page: a venue floor plan where
+  a meetup point is shown. Open GET / with optional query parameters shape, x, and y—the same
+  contract as a Rails Spots-style app and iOS: shape selects the room (e.g. roomA, with
+  normalization to internal ids like room_a); x and y are normalized coordinates from 0.0 to 1.0
+  (top-left of the white floor, independent of device pixels). Use it to preview map UI and to
+  build or verify share URLs (Safari, copy, etc.) before deploying.
+email:
+- takumi.github@gmail.com
+executables:
+- sujiko
+extensions: []
+extra_rdoc_files: []
+files:
+- LICENSE.txt
+- README.md
+- Rakefile
+- exe/sujiko
+- lib/sujiko.rb
+- lib/sujiko/server.rb
+- lib/sujiko/templates/index.html.erb
+- lib/sujiko/version.rb
+- sig/sujiko.rbs
+homepage: https://github.com/tutuitakumi/sujiko
+licenses:
+- MIT
+metadata:
+  allowed_push_host: https://rubygems.org
+  homepage_uri: https://github.com/tutuitakumi/sujiko
+  source_code_uri: https://github.com/tutuitakumi/sujiko
+  changelog_uri: https://github.com/tutuitakumi/sujiko
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: 3.1.0
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.3.7
+signing_key:
+specification_version: 4
+summary: 'Joke/toy gem: local dev server for a venue meetup map (GET /?shape&x&y).
+  Not for production.'
+test_files: []