Compare commits
9 Commits
main
...
292c5f5af0
Author | SHA1 | Date | |
---|---|---|---|
292c5f5af0
|
|||
af5968bd34
|
|||
724b4776e8
|
|||
cea12b1e13
|
|||
ba82543c06
|
|||
efc73490d1
|
|||
1eda00f2d3
|
|||
ac4c3f2ad3
|
|||
2e0fe0edfc
|
44
.claude/settings.local.json
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
{
|
||||||
|
"permissions": {
|
||||||
|
"allow": [
|
||||||
|
"Bash(cargo init:*)",
|
||||||
|
"Bash(cargo:*)",
|
||||||
|
"Bash(find:*)",
|
||||||
|
"Bash(mkdir:*)",
|
||||||
|
"Bash(../target/debug/ailog new:*)",
|
||||||
|
"Bash(../target/debug/ailog build)",
|
||||||
|
"Bash(/Users/syui/ai/log/target/debug/ailog build)",
|
||||||
|
"Bash(ls:*)",
|
||||||
|
"Bash(curl:*)",
|
||||||
|
"Bash(pkill:*)",
|
||||||
|
"WebFetch(domain:docs.anthropic.com)",
|
||||||
|
"WebFetch(domain:github.com)",
|
||||||
|
"Bash(rm:*)",
|
||||||
|
"Bash(mv:*)",
|
||||||
|
"Bash(cp:*)",
|
||||||
|
"Bash(timeout:*)",
|
||||||
|
"Bash(grep:*)",
|
||||||
|
"Bash(./target/debug/ailog:*)",
|
||||||
|
"Bash(cat:*)",
|
||||||
|
"Bash(npm install)",
|
||||||
|
"Bash(npm run build:*)",
|
||||||
|
"Bash(chmod:*)",
|
||||||
|
"Bash(./scripts/tunnel.sh:*)",
|
||||||
|
"Bash(PRODUCTION=true cargo run -- build)",
|
||||||
|
"Bash(cloudflared tunnel:*)",
|
||||||
|
"Bash(npm install:*)",
|
||||||
|
"Bash(./scripts/build-oauth-partial.zsh:*)",
|
||||||
|
"Bash(./scripts/quick-oauth-update.zsh:*)",
|
||||||
|
"Bash(../target/debug/ailog serve)",
|
||||||
|
"Bash(./scripts/test-oauth.sh:*)",
|
||||||
|
"Bash(./run.zsh:*)",
|
||||||
|
"Bash(npm run dev:*)",
|
||||||
|
"Bash(./target/release/ailog:*)",
|
||||||
|
"Bash(rg:*)",
|
||||||
|
"Bash(../target/release/ailog build)",
|
||||||
|
"Bash(zsh run.zsh:*)",
|
||||||
|
"Bash(hugo:*)"
|
||||||
|
],
|
||||||
|
"deny": []
|
||||||
|
}
|
||||||
|
}
|
@@ -1,123 +0,0 @@
|
|||||||
name: Deploy to Cloudflare Pages
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches:
|
|
||||||
- main
|
|
||||||
workflow_dispatch:
|
|
||||||
|
|
||||||
env:
|
|
||||||
OAUTH_DIR: oauth
|
|
||||||
KEEP_DEPLOYMENTS: 5
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
deploy:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
permissions:
|
|
||||||
contents: read
|
|
||||||
deployments: write
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout
|
|
||||||
uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Setup Node.js
|
|
||||||
uses: actions/setup-node@v4
|
|
||||||
with:
|
|
||||||
node-version: '21'
|
|
||||||
|
|
||||||
- name: Install dependencies
|
|
||||||
run: |
|
|
||||||
cd ${{ env.OAUTH_DIR }}
|
|
||||||
npm install
|
|
||||||
|
|
||||||
- name: Build OAuth app
|
|
||||||
run: |
|
|
||||||
cd ${{ env.OAUTH_DIR }}
|
|
||||||
NODE_ENV=production npm run build
|
|
||||||
- name: Copy OAuth build to static
|
|
||||||
run: |
|
|
||||||
rm -rf my-blog/static/assets
|
|
||||||
cp -rf ${{ env.OAUTH_DIR }}/dist/* my-blog/static/
|
|
||||||
cp ${{ env.OAUTH_DIR }}/dist/index.html my-blog/templates/oauth-assets.html
|
|
||||||
|
|
||||||
- name: Cache ailog binary
|
|
||||||
uses: actions/cache@v4
|
|
||||||
with:
|
|
||||||
path: ./bin
|
|
||||||
key: ailog-bin-${{ runner.os }}
|
|
||||||
restore-keys: |
|
|
||||||
ailog-bin-${{ runner.os }}
|
|
||||||
|
|
||||||
- name: Setup ailog binary
|
|
||||||
run: |
|
|
||||||
# Get expected version from Cargo.toml
|
|
||||||
EXPECTED_VERSION=$(grep '^version' Cargo.toml | cut -d'"' -f2)
|
|
||||||
echo "Expected version from Cargo.toml: $EXPECTED_VERSION"
|
|
||||||
|
|
||||||
# Check current binary version if exists
|
|
||||||
if [ -f "./bin/ailog" ]; then
|
|
||||||
CURRENT_VERSION=$(./bin/ailog --version 2>/dev/null || echo "unknown")
|
|
||||||
echo "Current binary version: $CURRENT_VERSION"
|
|
||||||
else
|
|
||||||
CURRENT_VERSION="none"
|
|
||||||
echo "No binary found"
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Check OS
|
|
||||||
OS="${{ runner.os }}"
|
|
||||||
echo "Runner OS: $OS"
|
|
||||||
|
|
||||||
# Use pre-packaged binary if version matches or extract from tar.gz
|
|
||||||
if [ "$CURRENT_VERSION" = "$EXPECTED_VERSION" ]; then
|
|
||||||
echo "Binary is up to date"
|
|
||||||
chmod +x ./bin/ailog
|
|
||||||
elif [ "$OS" = "Linux" ] && [ -f "./bin/ailog-linux-x86_64.tar.gz" ]; then
|
|
||||||
echo "Extracting ailog from pre-packaged tar.gz..."
|
|
||||||
cd bin
|
|
||||||
tar -xzf ailog-linux-x86_64.tar.gz
|
|
||||||
chmod +x ailog
|
|
||||||
cd ..
|
|
||||||
|
|
||||||
# Verify extracted version
|
|
||||||
EXTRACTED_VERSION=$(./bin/ailog --version 2>/dev/null || echo "unknown")
|
|
||||||
echo "Extracted binary version: $EXTRACTED_VERSION"
|
|
||||||
|
|
||||||
if [ "$EXTRACTED_VERSION" != "$EXPECTED_VERSION" ]; then
|
|
||||||
echo "Warning: Binary version mismatch. Expected $EXPECTED_VERSION but got $EXTRACTED_VERSION"
|
|
||||||
fi
|
|
||||||
else
|
|
||||||
echo "Error: No suitable binary found for OS: $OS"
|
|
||||||
exit 1
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Build site with ailog
|
|
||||||
run: |
|
|
||||||
cd my-blog
|
|
||||||
../bin/ailog build
|
|
||||||
|
|
||||||
- name: List public directory
|
|
||||||
run: |
|
|
||||||
ls -la my-blog/public/
|
|
||||||
|
|
||||||
- name: Deploy to Cloudflare Pages
|
|
||||||
uses: cloudflare/pages-action@v1
|
|
||||||
with:
|
|
||||||
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
|
|
||||||
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
|
|
||||||
projectName: ${{ secrets.CLOUDFLARE_PROJECT_NAME }}
|
|
||||||
directory: my-blog/public
|
|
||||||
wranglerVersion: '3'
|
|
||||||
|
|
||||||
cleanup:
|
|
||||||
needs: deploy
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
if: success()
|
|
||||||
steps:
|
|
||||||
- name: Cleanup old deployments
|
|
||||||
run: |
|
|
||||||
curl -X PATCH \
|
|
||||||
"https://api.cloudflare.com/client/v4/accounts/${{ secrets.CLOUDFLARE_ACCOUNT_ID }}/pages/projects/${{ secrets.CLOUDFLARE_PROJECT_NAME }}" \
|
|
||||||
-H "Authorization: Bearer ${{ secrets.CLOUDFLARE_API_TOKEN }}" \
|
|
||||||
-H "Content-Type: application/json" \
|
|
||||||
-d "{ \"deployment_configs\": { \"production\": { \"deployment_retention\": ${{ env.KEEP_DEPLOYMENTS }} } } }"
|
|
@@ -1,53 +0,0 @@
|
|||||||
name: Deploy to Cloudflare Pages
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches: [main]
|
|
||||||
pull_request:
|
|
||||||
branches: [main]
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
build-and-deploy:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout
|
|
||||||
uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Setup Rust
|
|
||||||
uses: actions-rs/toolchain@v1
|
|
||||||
with:
|
|
||||||
toolchain: stable
|
|
||||||
override: true
|
|
||||||
|
|
||||||
- name: Setup Node.js
|
|
||||||
uses: actions/setup-node@v4
|
|
||||||
with:
|
|
||||||
node-version: '20'
|
|
||||||
|
|
||||||
- name: Build ailog
|
|
||||||
run: |
|
|
||||||
cargo build --release
|
|
||||||
|
|
||||||
- name: Build OAuth app
|
|
||||||
run: |
|
|
||||||
cd oauth
|
|
||||||
npm install
|
|
||||||
npm run build
|
|
||||||
|
|
||||||
- name: Copy OAuth assets
|
|
||||||
run: |
|
|
||||||
cp -r oauth/dist/* my-blog/static/
|
|
||||||
|
|
||||||
- name: Generate site with ailog
|
|
||||||
run: |
|
|
||||||
./target/release/ailog generate --input content --output my-blog/public
|
|
||||||
|
|
||||||
- name: Deploy to Cloudflare Pages
|
|
||||||
uses: cloudflare/pages-action@v1
|
|
||||||
with:
|
|
||||||
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
|
|
||||||
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
|
|
||||||
projectName: syui-ai
|
|
||||||
directory: my-blog/public
|
|
||||||
gitHubToken: ${{ secrets.GITHUB_TOKEN }}
|
|
@@ -1,28 +0,0 @@
|
|||||||
name: Example ailog usage
|
|
||||||
|
|
||||||
on:
|
|
||||||
workflow_dispatch: # Manual trigger for testing
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
build-with-ailog-action:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout
|
|
||||||
uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Build with ailog action
|
|
||||||
uses: ai/log@v1 # This will reference this repository
|
|
||||||
with:
|
|
||||||
content-dir: 'content'
|
|
||||||
output-dir: 'public'
|
|
||||||
ai-integration: true
|
|
||||||
atproto-integration: true
|
|
||||||
|
|
||||||
- name: Deploy to Cloudflare Pages
|
|
||||||
uses: cloudflare/pages-action@v1
|
|
||||||
with:
|
|
||||||
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
|
|
||||||
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
|
|
||||||
projectName: my-blog
|
|
||||||
directory: public
|
|
@@ -1,193 +0,0 @@
|
|||||||
name: Release
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
tags:
|
|
||||||
- 'v*'
|
|
||||||
workflow_dispatch:
|
|
||||||
inputs:
|
|
||||||
tag:
|
|
||||||
description: 'Release tag (e.g., v1.0.0)'
|
|
||||||
required: true
|
|
||||||
default: 'v0.1.0'
|
|
||||||
|
|
||||||
permissions:
|
|
||||||
contents: write
|
|
||||||
actions: read
|
|
||||||
|
|
||||||
env:
|
|
||||||
CARGO_TERM_COLOR: always
|
|
||||||
OPENSSL_STATIC: true
|
|
||||||
OPENSSL_VENDOR: true
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
build:
|
|
||||||
name: Build ${{ matrix.target }}
|
|
||||||
runs-on: ${{ matrix.os }}
|
|
||||||
timeout-minutes: 60
|
|
||||||
strategy:
|
|
||||||
matrix:
|
|
||||||
include:
|
|
||||||
- target: x86_64-unknown-linux-gnu
|
|
||||||
os: ubuntu-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-linux-x86_64
|
|
||||||
- target: aarch64-unknown-linux-gnu
|
|
||||||
os: ubuntu-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-linux-aarch64
|
|
||||||
- target: x86_64-apple-darwin
|
|
||||||
os: macos-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-macos-x86_64
|
|
||||||
- target: aarch64-apple-darwin
|
|
||||||
os: macos-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-macos-aarch64
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Setup Rust
|
|
||||||
uses: dtolnay/rust-toolchain@stable
|
|
||||||
with:
|
|
||||||
targets: ${{ matrix.target }}
|
|
||||||
|
|
||||||
- name: Install cross-compilation tools (Linux)
|
|
||||||
if: matrix.os == 'ubuntu-latest' && matrix.target == 'aarch64-unknown-linux-gnu'
|
|
||||||
run: |
|
|
||||||
sudo apt-get update
|
|
||||||
sudo apt-get install -y gcc-aarch64-linux-gnu binutils-aarch64-linux-gnu
|
|
||||||
|
|
||||||
- name: Configure cross-compilation (Linux ARM64)
|
|
||||||
if: matrix.target == 'aarch64-unknown-linux-gnu'
|
|
||||||
run: |
|
|
||||||
echo '[target.aarch64-unknown-linux-gnu]' >> ~/.cargo/config.toml
|
|
||||||
echo 'linker = "aarch64-linux-gnu-gcc"' >> ~/.cargo/config.toml
|
|
||||||
|
|
||||||
- name: Cache cargo registry
|
|
||||||
uses: actions/cache@v4
|
|
||||||
with:
|
|
||||||
path: |
|
|
||||||
~/.cargo/registry
|
|
||||||
~/.cargo/git
|
|
||||||
key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
|
|
||||||
|
|
||||||
- name: Cache target directory
|
|
||||||
uses: actions/cache@v4
|
|
||||||
with:
|
|
||||||
path: target
|
|
||||||
key: ${{ runner.os }}-${{ matrix.target }}-target-${{ hashFiles('**/Cargo.lock') }}
|
|
||||||
|
|
||||||
- name: Build
|
|
||||||
run: cargo build --release --target ${{ matrix.target }}
|
|
||||||
|
|
||||||
- name: Prepare binary
|
|
||||||
shell: bash
|
|
||||||
run: |
|
|
||||||
cd target/${{ matrix.target }}/release
|
|
||||||
|
|
||||||
# Use appropriate strip command for cross-compilation
|
|
||||||
if [[ "${{ matrix.target }}" == "aarch64-unknown-linux-gnu" ]]; then
|
|
||||||
aarch64-linux-gnu-strip ${{ matrix.artifact_name }} || echo "Strip failed, continuing..."
|
|
||||||
elif [[ "${{ matrix.os }}" == "windows-latest" ]]; then
|
|
||||||
strip ${{ matrix.artifact_name }} || echo "Strip failed, continuing..."
|
|
||||||
else
|
|
||||||
strip ${{ matrix.artifact_name }} || echo "Strip failed, continuing..."
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Create archive
|
|
||||||
if [[ "${{ matrix.target }}" == *"windows"* ]]; then
|
|
||||||
7z a ../../../${{ matrix.asset_name }}.zip ${{ matrix.artifact_name }}
|
|
||||||
else
|
|
||||||
tar czvf ../../../${{ matrix.asset_name }}.tar.gz ${{ matrix.artifact_name }}
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Upload binary
|
|
||||||
uses: actions/upload-artifact@v4
|
|
||||||
with:
|
|
||||||
name: ${{ matrix.asset_name }}
|
|
||||||
path: ${{ matrix.asset_name }}.tar.gz
|
|
||||||
|
|
||||||
release:
|
|
||||||
name: Create Release
|
|
||||||
needs: build
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
permissions:
|
|
||||||
contents: write
|
|
||||||
actions: read
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Download all artifacts
|
|
||||||
uses: actions/download-artifact@v4
|
|
||||||
with:
|
|
||||||
path: artifacts
|
|
||||||
|
|
||||||
- name: Generate release notes
|
|
||||||
run: |
|
|
||||||
echo "## What's Changed" > release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "### Features" >> release_notes.md
|
|
||||||
echo "- AI-powered static blog generator" >> release_notes.md
|
|
||||||
echo "- AtProto OAuth integration" >> release_notes.md
|
|
||||||
echo "- Automatic translation support" >> release_notes.md
|
|
||||||
echo "- AI comment system" >> release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "### Platforms" >> release_notes.md
|
|
||||||
echo "- Linux (x86_64, aarch64)" >> release_notes.md
|
|
||||||
echo "- macOS (Intel, Apple Silicon)" >> release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "### Installation" >> release_notes.md
|
|
||||||
echo "\`\`\`bash" >> release_notes.md
|
|
||||||
echo "# Linux/macOS" >> release_notes.md
|
|
||||||
echo "tar -xzf ailog-linux-x86_64.tar.gz" >> release_notes.md
|
|
||||||
echo "chmod +x ailog" >> release_notes.md
|
|
||||||
echo "sudo mv ailog /usr/local/bin/" >> release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "\`\`\`" >> release_notes.md
|
|
||||||
|
|
||||||
- name: Get tag name
|
|
||||||
id: tag_name
|
|
||||||
run: |
|
|
||||||
if [[ "${{ github.event_name }}" == "workflow_dispatch" ]]; then
|
|
||||||
echo "tag=${{ github.event.inputs.tag }}" >> $GITHUB_OUTPUT
|
|
||||||
else
|
|
||||||
echo "tag=${GITHUB_REF#refs/tags/}" >> $GITHUB_OUTPUT
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Create Release with Gitea API
|
|
||||||
run: |
|
|
||||||
# Prepare release files
|
|
||||||
mkdir -p release
|
|
||||||
find artifacts -name "*.tar.gz" -exec cp {} release/ \;
|
|
||||||
|
|
||||||
# Create release via Gitea API
|
|
||||||
RELEASE_RESPONSE=$(curl -X POST \
|
|
||||||
"${{ github.server_url }}/api/v1/repos/${{ github.repository }}/releases" \
|
|
||||||
-H "Authorization: token ${{ github.token }}" \
|
|
||||||
-H "Content-Type: application/json" \
|
|
||||||
-d '{
|
|
||||||
"tag_name": "${{ steps.tag_name.outputs.tag }}",
|
|
||||||
"name": "ailog ${{ steps.tag_name.outputs.tag }}",
|
|
||||||
"body": "'"$(cat release_notes.md | sed 's/"/\\"/g' | tr '\n' ' ')"'",
|
|
||||||
"draft": false,
|
|
||||||
"prerelease": '"$(if echo "${{ steps.tag_name.outputs.tag }}" | grep -E "(alpha|beta|rc)"; then echo "true"; else echo "false"; fi)"'
|
|
||||||
}')
|
|
||||||
|
|
||||||
# Get release ID
|
|
||||||
RELEASE_ID=$(echo "$RELEASE_RESPONSE" | jq -r '.id')
|
|
||||||
echo "Created release with ID: $RELEASE_ID"
|
|
||||||
|
|
||||||
# Upload release assets
|
|
||||||
for file in release/*.tar.gz; do
|
|
||||||
if [ -f "$file" ]; then
|
|
||||||
filename=$(basename "$file")
|
|
||||||
echo "Uploading $filename..."
|
|
||||||
curl -X POST \
|
|
||||||
"${{ github.server_url }}/api/v1/repos/${{ github.repository }}/releases/$RELEASE_ID/assets?name=$filename" \
|
|
||||||
-H "Authorization: token ${{ github.token }}" \
|
|
||||||
-H "Content-Type: application/octet-stream" \
|
|
||||||
--data-binary @"$file"
|
|
||||||
fi
|
|
||||||
done
|
|
131
.github/workflows/cloudflare-pages.yml
vendored
@@ -6,10 +6,6 @@ on:
|
|||||||
- main
|
- main
|
||||||
workflow_dispatch:
|
workflow_dispatch:
|
||||||
|
|
||||||
env:
|
|
||||||
OAUTH_DIR: oauth
|
|
||||||
KEEP_DEPLOYMENTS: 5
|
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
deploy:
|
deploy:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
@@ -28,84 +24,32 @@ jobs:
|
|||||||
|
|
||||||
- name: Install dependencies
|
- name: Install dependencies
|
||||||
run: |
|
run: |
|
||||||
cd ${{ env.OAUTH_DIR }}
|
cd oauth
|
||||||
npm install
|
npm install
|
||||||
|
|
||||||
- name: Build OAuth app
|
- name: Build OAuth app
|
||||||
run: |
|
run: |
|
||||||
cd ${{ env.OAUTH_DIR }}
|
cd oauth
|
||||||
NODE_ENV=production npm run build
|
npm run build
|
||||||
|
|
||||||
- name: Copy OAuth build to static
|
- name: Copy OAuth build to static
|
||||||
run: |
|
run: |
|
||||||
rm -rf my-blog/static/assets
|
mkdir -p my-blog/static/assets
|
||||||
cp -rf ${{ env.OAUTH_DIR }}/dist/* my-blog/static/
|
cp -r oauth/dist/assets/* my-blog/static/assets/
|
||||||
cp ${{ env.OAUTH_DIR }}/dist/index.html my-blog/templates/oauth-assets.html
|
cp oauth/dist/index.html my-blog/static/oauth/index.html || true
|
||||||
|
|
||||||
- name: Build PDS app
|
|
||||||
run: |
|
|
||||||
cd pds
|
|
||||||
npm install
|
|
||||||
npm run build
|
|
||||||
|
|
||||||
- name: Copy PDS build to static
|
|
||||||
run: |
|
|
||||||
rm -rf my-blog/static/pds
|
|
||||||
cp -rf pds/dist my-blog/static/pds
|
|
||||||
|
|
||||||
- name: Cache ailog binary
|
- name: Setup Rust
|
||||||
uses: actions/cache@v4
|
uses: actions-rs/toolchain@v1
|
||||||
with:
|
with:
|
||||||
path: ./bin
|
toolchain: stable
|
||||||
key: ailog-bin-${{ runner.os }}-v${{ hashFiles('Cargo.toml') }}
|
|
||||||
restore-keys: |
|
- name: Build ailog
|
||||||
ailog-bin-${{ runner.os }}-v
|
run: cargo build --release
|
||||||
|
|
||||||
- name: Setup ailog binary
|
|
||||||
run: |
|
|
||||||
# Get expected version from Cargo.toml
|
|
||||||
EXPECTED_VERSION=$(grep '^version' Cargo.toml | cut -d'"' -f2)
|
|
||||||
echo "Expected version from Cargo.toml: $EXPECTED_VERSION"
|
|
||||||
|
|
||||||
# Check current binary version if exists
|
|
||||||
if [ -f "./bin/ailog" ]; then
|
|
||||||
CURRENT_VERSION=$(./bin/ailog --version 2>/dev/null || echo "unknown")
|
|
||||||
echo "Current binary version: $CURRENT_VERSION"
|
|
||||||
else
|
|
||||||
CURRENT_VERSION="none"
|
|
||||||
echo "No binary found"
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Check OS
|
|
||||||
OS="${{ runner.os }}"
|
|
||||||
echo "Runner OS: $OS"
|
|
||||||
|
|
||||||
# Use pre-packaged binary if version matches or extract from tar.gz
|
|
||||||
if [ "$CURRENT_VERSION" = "$EXPECTED_VERSION" ]; then
|
|
||||||
echo "Binary is up to date"
|
|
||||||
chmod +x ./bin/ailog
|
|
||||||
elif [ "$OS" = "Linux" ] && [ -f "./bin/ailog-linux-x86_64.tar.gz" ]; then
|
|
||||||
echo "Extracting ailog from pre-packaged tar.gz..."
|
|
||||||
cd bin
|
|
||||||
tar -xzf ailog-linux-x86_64.tar.gz
|
|
||||||
chmod +x ailog
|
|
||||||
cd ..
|
|
||||||
|
|
||||||
# Verify extracted version
|
|
||||||
EXTRACTED_VERSION=$(./bin/ailog --version 2>/dev/null || echo "unknown")
|
|
||||||
echo "Extracted binary version: $EXTRACTED_VERSION"
|
|
||||||
|
|
||||||
if [ "$EXTRACTED_VERSION" != "$EXPECTED_VERSION" ]; then
|
|
||||||
echo "Warning: Binary version mismatch. Expected $EXPECTED_VERSION but got $EXTRACTED_VERSION"
|
|
||||||
fi
|
|
||||||
else
|
|
||||||
echo "Error: No suitable binary found for OS: $OS"
|
|
||||||
exit 1
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Build site with ailog
|
- name: Build site with ailog
|
||||||
run: |
|
run: |
|
||||||
cd my-blog
|
cd my-blog
|
||||||
../bin/ailog build
|
../target/release/ailog build
|
||||||
|
|
||||||
- name: List public directory
|
- name: List public directory
|
||||||
run: |
|
run: |
|
||||||
@@ -120,50 +64,3 @@ jobs:
|
|||||||
directory: my-blog/public
|
directory: my-blog/public
|
||||||
gitHubToken: ${{ secrets.GITHUB_TOKEN }}
|
gitHubToken: ${{ secrets.GITHUB_TOKEN }}
|
||||||
wranglerVersion: '3'
|
wranglerVersion: '3'
|
||||||
|
|
||||||
cleanup:
|
|
||||||
needs: deploy
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
if: success()
|
|
||||||
steps:
|
|
||||||
- name: Cleanup old deployments
|
|
||||||
run: |
|
|
||||||
curl -X PATCH \
|
|
||||||
"https://api.cloudflare.com/client/v4/accounts/${{ secrets.CLOUDFLARE_ACCOUNT_ID }}/pages/projects/${{ secrets.CLOUDFLARE_PROJECT_NAME }}" \
|
|
||||||
-H "Authorization: Bearer ${{ secrets.CLOUDFLARE_API_TOKEN }}" \
|
|
||||||
-H "Content-Type: application/json" \
|
|
||||||
-d "{ \"deployment_configs\": { \"production\": { \"deployment_retention\": ${{ env.KEEP_DEPLOYMENTS }} } } }"
|
|
||||||
# Get all deployments
|
|
||||||
DEPLOYMENTS=$(curl -s -X GET \
|
|
||||||
"https://api.cloudflare.com/client/v4/accounts/${{ secrets.CLOUDFLARE_ACCOUNT_ID }}/pages/projects/${{ secrets.CLOUDFLARE_PROJECT_NAME }}/deployments" \
|
|
||||||
-H "Authorization: Bearer ${{ secrets.CLOUDFLARE_API_TOKEN }}" \
|
|
||||||
-H "Content-Type: application/json")
|
|
||||||
|
|
||||||
# Extract deployment IDs (skip the latest N deployments)
|
|
||||||
DEPLOYMENT_IDS=$(echo "$DEPLOYMENTS" | jq -r ".result | sort_by(.created_on) | reverse | .[${{ env.KEEP_DEPLOYMENTS }}:] | .[].id // empty")
|
|
||||||
|
|
||||||
if [ -z "$DEPLOYMENT_IDS" ]; then
|
|
||||||
echo "No old deployments to delete"
|
|
||||||
exit 0
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Delete old deployments
|
|
||||||
for ID in $DEPLOYMENT_IDS; do
|
|
||||||
echo "Deleting deployment: $ID"
|
|
||||||
RESPONSE=$(curl -s -X DELETE \
|
|
||||||
"https://api.cloudflare.com/client/v4/accounts/${{ secrets.CLOUDFLARE_ACCOUNT_ID }}/pages/projects/${{ secrets.CLOUDFLARE_PROJECT_NAME }}/deployments/$ID" \
|
|
||||||
-H "Authorization: Bearer ${{ secrets.CLOUDFLARE_API_TOKEN }}" \
|
|
||||||
-H "Content-Type: application/json")
|
|
||||||
|
|
||||||
SUCCESS=$(echo "$RESPONSE" | jq -r '.success')
|
|
||||||
if [ "$SUCCESS" = "true" ]; then
|
|
||||||
echo "Successfully deleted deployment: $ID"
|
|
||||||
else
|
|
||||||
echo "Failed to delete deployment: $ID"
|
|
||||||
echo "$RESPONSE" | jq .
|
|
||||||
fi
|
|
||||||
|
|
||||||
sleep 1 # Rate limiting
|
|
||||||
done
|
|
||||||
|
|
||||||
echo "Cleanup completed!"
|
|
||||||
|
92
.github/workflows/disabled/gh-pages-fast.yml
vendored
@@ -1,92 +0,0 @@
|
|||||||
name: github pages (fast)
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches:
|
|
||||||
- main
|
|
||||||
paths-ignore:
|
|
||||||
- 'src/**'
|
|
||||||
- 'Cargo.toml'
|
|
||||||
- 'Cargo.lock'
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
build-deploy:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
permissions:
|
|
||||||
contents: write
|
|
||||||
pages: write
|
|
||||||
id-token: write
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Cache ailog binary
|
|
||||||
uses: actions/cache@v4
|
|
||||||
with:
|
|
||||||
path: ./bin
|
|
||||||
key: ailog-bin-${{ runner.os }}
|
|
||||||
restore-keys: |
|
|
||||||
ailog-bin-${{ runner.os }}
|
|
||||||
|
|
||||||
- name: Setup ailog binary
|
|
||||||
run: |
|
|
||||||
# Get expected version from Cargo.toml
|
|
||||||
EXPECTED_VERSION=$(grep '^version' Cargo.toml | cut -d'"' -f2)
|
|
||||||
echo "Expected version from Cargo.toml: $EXPECTED_VERSION"
|
|
||||||
|
|
||||||
# Check current binary version if exists
|
|
||||||
if [ -f "./bin/ailog" ]; then
|
|
||||||
CURRENT_VERSION=$(./bin/ailog --version 2>/dev/null || echo "unknown")
|
|
||||||
echo "Current binary version: $CURRENT_VERSION"
|
|
||||||
else
|
|
||||||
CURRENT_VERSION="none"
|
|
||||||
echo "No binary found"
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Check OS
|
|
||||||
OS="${{ runner.os }}"
|
|
||||||
echo "Runner OS: $OS"
|
|
||||||
|
|
||||||
# Use pre-packaged binary if version matches or extract from tar.gz
|
|
||||||
if [ "$CURRENT_VERSION" = "$EXPECTED_VERSION" ]; then
|
|
||||||
echo "Binary is up to date"
|
|
||||||
chmod +x ./bin/ailog
|
|
||||||
elif [ "$OS" = "Linux" ] && [ -f "./bin/ailog-linux-x86_64.tar.gz" ]; then
|
|
||||||
echo "Extracting ailog from pre-packaged tar.gz..."
|
|
||||||
cd bin
|
|
||||||
tar -xzf ailog-linux-x86_64.tar.gz
|
|
||||||
chmod +x ailog
|
|
||||||
cd ..
|
|
||||||
|
|
||||||
# Verify extracted version
|
|
||||||
EXTRACTED_VERSION=$(./bin/ailog --version 2>/dev/null || echo "unknown")
|
|
||||||
echo "Extracted binary version: $EXTRACTED_VERSION"
|
|
||||||
|
|
||||||
if [ "$EXTRACTED_VERSION" != "$EXPECTED_VERSION" ]; then
|
|
||||||
echo "Warning: Binary version mismatch. Expected $EXPECTED_VERSION but got $EXTRACTED_VERSION"
|
|
||||||
fi
|
|
||||||
else
|
|
||||||
echo "Error: No suitable binary found for OS: $OS"
|
|
||||||
exit 1
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Setup Hugo
|
|
||||||
uses: peaceiris/actions-hugo@v3
|
|
||||||
with:
|
|
||||||
hugo-version: "0.139.2"
|
|
||||||
extended: true
|
|
||||||
|
|
||||||
- name: Build with ailog
|
|
||||||
env:
|
|
||||||
TZ: "Asia/Tokyo"
|
|
||||||
run: |
|
|
||||||
# Use pre-built ailog binary instead of cargo build
|
|
||||||
cd my-blog
|
|
||||||
../bin/ailog build
|
|
||||||
touch ./public/.nojekyll
|
|
||||||
|
|
||||||
- name: Deploy
|
|
||||||
uses: peaceiris/actions-gh-pages@v3
|
|
||||||
with:
|
|
||||||
github_token: ${{ secrets.GITHUB_TOKEN }}
|
|
||||||
publish_dir: ./my-blog/public
|
|
||||||
publish_branch: gh-pages
|
|
170
.github/workflows/release.yml
vendored
@@ -1,170 +0,0 @@
|
|||||||
name: Release
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
tags:
|
|
||||||
- 'v*'
|
|
||||||
workflow_dispatch:
|
|
||||||
inputs:
|
|
||||||
tag:
|
|
||||||
description: 'Release tag (e.g., v1.0.0)'
|
|
||||||
required: true
|
|
||||||
default: 'v0.1.0'
|
|
||||||
|
|
||||||
permissions:
|
|
||||||
contents: write
|
|
||||||
actions: read
|
|
||||||
|
|
||||||
env:
|
|
||||||
CARGO_TERM_COLOR: always
|
|
||||||
OPENSSL_STATIC: true
|
|
||||||
OPENSSL_VENDOR: true
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
build:
|
|
||||||
name: Build ${{ matrix.target }}
|
|
||||||
runs-on: ${{ matrix.os }}
|
|
||||||
timeout-minutes: 60
|
|
||||||
strategy:
|
|
||||||
matrix:
|
|
||||||
include:
|
|
||||||
- target: x86_64-unknown-linux-gnu
|
|
||||||
os: ubuntu-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-linux-x86_64
|
|
||||||
- target: aarch64-unknown-linux-gnu
|
|
||||||
os: ubuntu-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-linux-aarch64
|
|
||||||
- target: x86_64-apple-darwin
|
|
||||||
os: macos-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-macos-x86_64
|
|
||||||
- target: aarch64-apple-darwin
|
|
||||||
os: macos-latest
|
|
||||||
artifact_name: ailog
|
|
||||||
asset_name: ailog-macos-aarch64
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
|
|
||||||
|
|
||||||
- name: Setup Rust
|
|
||||||
uses: dtolnay/rust-toolchain@stable
|
|
||||||
with:
|
|
||||||
targets: ${{ matrix.target }}
|
|
||||||
|
|
||||||
- name: Install cross-compilation tools (Linux)
|
|
||||||
if: matrix.os == 'ubuntu-latest' && matrix.target == 'aarch64-unknown-linux-gnu'
|
|
||||||
run: |
|
|
||||||
sudo apt-get update
|
|
||||||
sudo apt-get install -y gcc-aarch64-linux-gnu binutils-aarch64-linux-gnu
|
|
||||||
|
|
||||||
- name: Configure cross-compilation (Linux ARM64)
|
|
||||||
if: matrix.target == 'aarch64-unknown-linux-gnu'
|
|
||||||
run: |
|
|
||||||
echo '[target.aarch64-unknown-linux-gnu]' >> ~/.cargo/config.toml
|
|
||||||
echo 'linker = "aarch64-linux-gnu-gcc"' >> ~/.cargo/config.toml
|
|
||||||
|
|
||||||
- name: Cache cargo registry
|
|
||||||
uses: actions/cache@v4
|
|
||||||
with:
|
|
||||||
path: |
|
|
||||||
~/.cargo/registry
|
|
||||||
~/.cargo/git
|
|
||||||
key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
|
|
||||||
|
|
||||||
- name: Cache target directory
|
|
||||||
uses: actions/cache@v4
|
|
||||||
with:
|
|
||||||
path: target
|
|
||||||
key: ${{ runner.os }}-${{ matrix.target }}-target-${{ hashFiles('**/Cargo.lock') }}
|
|
||||||
|
|
||||||
- name: Build
|
|
||||||
run: cargo build --release --target ${{ matrix.target }}
|
|
||||||
|
|
||||||
- name: Prepare binary
|
|
||||||
shell: bash
|
|
||||||
run: |
|
|
||||||
cd target/${{ matrix.target }}/release
|
|
||||||
|
|
||||||
# Use appropriate strip command for cross-compilation
|
|
||||||
if [[ "${{ matrix.target }}" == "aarch64-unknown-linux-gnu" ]]; then
|
|
||||||
aarch64-linux-gnu-strip ${{ matrix.artifact_name }} || echo "Strip failed, continuing..."
|
|
||||||
elif [[ "${{ matrix.os }}" == "windows-latest" ]]; then
|
|
||||||
strip ${{ matrix.artifact_name }} || echo "Strip failed, continuing..."
|
|
||||||
else
|
|
||||||
strip ${{ matrix.artifact_name }} || echo "Strip failed, continuing..."
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Create archive
|
|
||||||
if [[ "${{ matrix.target }}" == *"windows"* ]]; then
|
|
||||||
7z a ../../../${{ matrix.asset_name }}.zip ${{ matrix.artifact_name }}
|
|
||||||
else
|
|
||||||
tar czvf ../../../${{ matrix.asset_name }}.tar.gz ${{ matrix.artifact_name }}
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Upload binary
|
|
||||||
uses: actions/upload-artifact@v4
|
|
||||||
with:
|
|
||||||
name: ${{ matrix.asset_name }}
|
|
||||||
path: ${{ matrix.asset_name }}.tar.gz
|
|
||||||
|
|
||||||
release:
|
|
||||||
name: Create Release
|
|
||||||
needs: build
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
permissions:
|
|
||||||
contents: write
|
|
||||||
actions: read
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Download all artifacts
|
|
||||||
uses: actions/download-artifact@v4
|
|
||||||
with:
|
|
||||||
path: artifacts
|
|
||||||
|
|
||||||
- name: Generate release notes
|
|
||||||
run: |
|
|
||||||
echo "## What's Changed" > release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "### Features" >> release_notes.md
|
|
||||||
echo "- AI-powered static blog generator" >> release_notes.md
|
|
||||||
echo "- AtProto OAuth integration" >> release_notes.md
|
|
||||||
echo "- Automatic translation support" >> release_notes.md
|
|
||||||
echo "- AI comment system" >> release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "### Platforms" >> release_notes.md
|
|
||||||
echo "- Linux (x86_64, aarch64)" >> release_notes.md
|
|
||||||
echo "- macOS (Intel, Apple Silicon)" >> release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "### Installation" >> release_notes.md
|
|
||||||
echo "\`\`\`bash" >> release_notes.md
|
|
||||||
echo "# Linux/macOS" >> release_notes.md
|
|
||||||
echo "tar -xzf ailog-linux-x86_64.tar.gz" >> release_notes.md
|
|
||||||
echo "chmod +x ailog" >> release_notes.md
|
|
||||||
echo "sudo mv ailog /usr/local/bin/" >> release_notes.md
|
|
||||||
echo "" >> release_notes.md
|
|
||||||
echo "\`\`\`" >> release_notes.md
|
|
||||||
|
|
||||||
- name: Get tag name
|
|
||||||
id: tag_name
|
|
||||||
run: |
|
|
||||||
if [[ "${{ github.event_name }}" == "workflow_dispatch" ]]; then
|
|
||||||
echo "tag=${{ github.event.inputs.tag }}" >> $GITHUB_OUTPUT
|
|
||||||
else
|
|
||||||
echo "tag=${GITHUB_REF#refs/tags/}" >> $GITHUB_OUTPUT
|
|
||||||
fi
|
|
||||||
|
|
||||||
- name: Create Release
|
|
||||||
uses: softprops/action-gh-release@v1
|
|
||||||
with:
|
|
||||||
tag_name: ${{ steps.tag_name.outputs.tag }}
|
|
||||||
name: ailog ${{ steps.tag_name.outputs.tag }}
|
|
||||||
body_path: release_notes.md
|
|
||||||
draft: false
|
|
||||||
prerelease: ${{ contains(steps.tag_name.outputs.tag, 'alpha') || contains(steps.tag_name.outputs.tag, 'beta') || contains(steps.tag_name.outputs.tag, 'rc') }}
|
|
||||||
files: artifacts/*/ailog-*.tar.gz
|
|
||||||
env:
|
|
||||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
|
17
.gitignore
vendored
@@ -5,23 +5,8 @@
|
|||||||
*.swo
|
*.swo
|
||||||
*~
|
*~
|
||||||
.DS_Store
|
.DS_Store
|
||||||
|
cloudflare-config.yml
|
||||||
my-blog/public/
|
my-blog/public/
|
||||||
dist
|
dist
|
||||||
node_modules
|
node_modules
|
||||||
package-lock.json
|
package-lock.json
|
||||||
my-blog/static/assets/comment-atproto-*
|
|
||||||
my-blog/static/ai-assets/comment-atproto-*
|
|
||||||
bin/ailog
|
|
||||||
docs
|
|
||||||
my-blog/static/index.html
|
|
||||||
my-blog/templates/oauth-assets.html
|
|
||||||
cloudflared-config.yml
|
|
||||||
.config
|
|
||||||
repos
|
|
||||||
oauth_old
|
|
||||||
oauth_example
|
|
||||||
my-blog/static/oauth/assets/comment-atproto*
|
|
||||||
*.lock
|
|
||||||
my-blog/config.toml
|
|
||||||
.claude/settings.local.json
|
|
||||||
my-blog/static/pds
|
|
||||||
|
49
Cargo.toml
@@ -1,6 +1,6 @@
|
|||||||
[package]
|
[package]
|
||||||
name = "ailog"
|
name = "ailog"
|
||||||
version = "0.3.4"
|
version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
authors = ["syui"]
|
authors = ["syui"]
|
||||||
description = "A static blog generator with AI features"
|
description = "A static blog generator with AI features"
|
||||||
@@ -10,16 +10,12 @@ license = "MIT"
|
|||||||
name = "ailog"
|
name = "ailog"
|
||||||
path = "src/main.rs"
|
path = "src/main.rs"
|
||||||
|
|
||||||
[lib]
|
|
||||||
name = "ailog"
|
|
||||||
path = "src/lib.rs"
|
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
clap = { version = "4.5", features = ["derive"] }
|
clap = { version = "4.5", features = ["derive"] }
|
||||||
pulldown-cmark = "0.11"
|
pulldown-cmark = "0.11"
|
||||||
serde = { version = "1.0", features = ["derive"] }
|
serde = { version = "1.0", features = ["derive"] }
|
||||||
serde_json = "1.0"
|
serde_json = "1.0"
|
||||||
tokio = { version = "1.40", features = ["rt-multi-thread", "macros", "fs", "net", "io-util", "sync", "time", "process", "signal"] }
|
tokio = { version = "1.40", features = ["full"] }
|
||||||
anyhow = "1.0"
|
anyhow = "1.0"
|
||||||
toml = "0.8"
|
toml = "0.8"
|
||||||
chrono = "0.4"
|
chrono = "0.4"
|
||||||
@@ -30,7 +26,7 @@ fs_extra = "1.3"
|
|||||||
colored = "2.1"
|
colored = "2.1"
|
||||||
serde_yaml = "0.9"
|
serde_yaml = "0.9"
|
||||||
syntect = "5.2"
|
syntect = "5.2"
|
||||||
reqwest = { version = "0.12", features = ["json", "rustls-tls"], default-features = false }
|
reqwest = { version = "0.12", features = ["json"] }
|
||||||
rand = "0.8"
|
rand = "0.8"
|
||||||
sha2 = "0.10"
|
sha2 = "0.10"
|
||||||
base64 = "0.22"
|
base64 = "0.22"
|
||||||
@@ -39,8 +35,6 @@ urlencoding = "2.1"
|
|||||||
axum = "0.7"
|
axum = "0.7"
|
||||||
tower = "0.5"
|
tower = "0.5"
|
||||||
tower-http = { version = "0.5", features = ["cors", "fs"] }
|
tower-http = { version = "0.5", features = ["cors", "fs"] }
|
||||||
axum-extra = { version = "0.9", features = ["typed-header"] }
|
|
||||||
tracing = "0.1"
|
|
||||||
hyper = { version = "1.0", features = ["full"] }
|
hyper = { version = "1.0", features = ["full"] }
|
||||||
tower-sessions = "0.12"
|
tower-sessions = "0.12"
|
||||||
jsonwebtoken = "9.2"
|
jsonwebtoken = "9.2"
|
||||||
@@ -49,41 +43,12 @@ cookie = "0.18"
|
|||||||
syn = { version = "2.0", features = ["full", "parsing", "visit"] }
|
syn = { version = "2.0", features = ["full", "parsing", "visit"] }
|
||||||
quote = "1.0"
|
quote = "1.0"
|
||||||
ignore = "0.4"
|
ignore = "0.4"
|
||||||
git2 = { version = "0.18", features = ["vendored-openssl", "vendored-libgit2", "ssh"], default-features = false }
|
git2 = "0.18"
|
||||||
regex = "1.0"
|
regex = "1.0"
|
||||||
# ATProto and stream monitoring dependencies
|
# ATProto and stream monitoring dependencies
|
||||||
tokio-tungstenite = { version = "0.21", features = ["rustls-tls-webpki-roots", "connect"], default-features = false }
|
tokio-tungstenite = { version = "0.21", features = ["native-tls"] }
|
||||||
futures-util = "0.3"
|
futures-util = "0.3"
|
||||||
tungstenite = { version = "0.21", features = ["rustls-tls-webpki-roots"], default-features = false }
|
tungstenite = { version = "0.21", features = ["native-tls"] }
|
||||||
rpassword = "7.3"
|
|
||||||
rustyline = "14.0"
|
|
||||||
dirs = "5.0"
|
|
||||||
|
|
||||||
[dev-dependencies]
|
[dev-dependencies]
|
||||||
tempfile = "3.14"
|
tempfile = "3.14"
|
||||||
|
|
||||||
[profile.dev]
|
|
||||||
# Speed up development builds
|
|
||||||
opt-level = 0
|
|
||||||
debug = true
|
|
||||||
debug-assertions = true
|
|
||||||
overflow-checks = true
|
|
||||||
lto = false
|
|
||||||
panic = 'unwind'
|
|
||||||
incremental = true
|
|
||||||
codegen-units = 256
|
|
||||||
|
|
||||||
[profile.release]
|
|
||||||
# Optimize release builds for speed and size
|
|
||||||
opt-level = 3
|
|
||||||
debug = false
|
|
||||||
debug-assertions = false
|
|
||||||
overflow-checks = false
|
|
||||||
lto = true
|
|
||||||
panic = 'abort'
|
|
||||||
incremental = false
|
|
||||||
codegen-units = 1
|
|
||||||
|
|
||||||
[profile.dev.package."*"]
|
|
||||||
# Optimize dependencies in dev builds
|
|
||||||
opt-level = 3
|
|
32
Dockerfile
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
# Multi-stage build for ailog
|
||||||
|
FROM rust:1.75 as builder
|
||||||
|
|
||||||
|
WORKDIR /usr/src/app
|
||||||
|
COPY Cargo.toml Cargo.lock ./
|
||||||
|
COPY src ./src
|
||||||
|
|
||||||
|
RUN cargo build --release
|
||||||
|
|
||||||
|
FROM debian:bookworm-slim
|
||||||
|
|
||||||
|
# Install runtime dependencies
|
||||||
|
RUN apt-get update && apt-get install -y \
|
||||||
|
ca-certificates \
|
||||||
|
&& rm -rf /var/lib/apt/lists/*
|
||||||
|
|
||||||
|
WORKDIR /app
|
||||||
|
|
||||||
|
# Copy the binary
|
||||||
|
COPY --from=builder /usr/src/app/target/release/ailog /usr/local/bin/ailog
|
||||||
|
|
||||||
|
# Copy blog content
|
||||||
|
COPY my-blog ./blog
|
||||||
|
|
||||||
|
# Build static site
|
||||||
|
RUN ailog build blog
|
||||||
|
|
||||||
|
# Expose port
|
||||||
|
EXPOSE 8080
|
||||||
|
|
||||||
|
# Run server
|
||||||
|
CMD ["ailog", "serve", "blog"]
|
222
claude.md
@@ -1,227 +1,5 @@
|
|||||||
# エコシステム統合設計書
|
# エコシステム統合設計書
|
||||||
|
|
||||||
## 注意事項
|
|
||||||
|
|
||||||
`console.log`は絶対に書かないようにしてください。
|
|
||||||
|
|
||||||
ハードコードしないようにしてください。必ず、`./my-blog/config.toml`や`./oauth/.env.production`を使用するように。または`~/.config/syui/ai/log/config.json`を使用するように。
|
|
||||||
|
|
||||||
重複する名前のenvを作らないようにしてください。新しい環境変数を作る際は必ず検討してください。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
# ダメな例
|
|
||||||
VITE_OAUTH_COLLECTION_USER=ai.syui.log.user
|
|
||||||
VITE_OAUTH_COLLECTION_CHAT=ai.syui.log.chat
|
|
||||||
```
|
|
||||||
|
|
||||||
## oauth appの設計
|
|
||||||
|
|
||||||
> ./oauth/.env.production
|
|
||||||
|
|
||||||
```sh
|
|
||||||
VITE_ATPROTO_PDS=syu.is
|
|
||||||
VITE_ADMIN_HANDLE=ai.syui.ai
|
|
||||||
VITE_AI_HANDLE=ai.syui.ai
|
|
||||||
VITE_OAUTH_COLLECTION=ai.syui.log
|
|
||||||
```
|
|
||||||
|
|
||||||
これらは非常にシンプルな流れになっており、すべての項目は、共通します。短縮できる場合があります。handleは変わる可能性があるので、できる限りdidを使いましょう。
|
|
||||||
|
|
||||||
1. handleからpds, didを取得できる ... com.atproto.repo.describeRepo
|
|
||||||
2. pdsが分かれば、pdsApi, bskyApi, plcApiを割り当てられる
|
|
||||||
3. bskyApiが分かれば、getProfileでavatar-uriを取得できる ... app.bsky.actor.getProfile
|
|
||||||
4. pdsAPiからアカウントにあるcollectionのrecordの情報を取得できる ... com.atproto.repo.listRecords
|
|
||||||
|
|
||||||
### コメントを表示する
|
|
||||||
|
|
||||||
1. VITE_ADMIN_HANDLEから管理者のhandleを取得する。
|
|
||||||
2. VITE_ATPROTO_PDSから管理者のアカウントのpdsを取得する。
|
|
||||||
3. pdsからpdsApi, bskApi, plcApiを割り当てる。
|
|
||||||
|
|
||||||
```rust
|
|
||||||
match pds {
|
|
||||||
"bsky.social" | "bsky.app" => NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
},
|
|
||||||
"syu.is" => NetworkConfig {
|
|
||||||
pds_api: "https://syu.is".to_string(),
|
|
||||||
plc_api: "https://plc.syu.is".to_string(),
|
|
||||||
bsky_api: "https://bsky.syu.is".to_string(),
|
|
||||||
web_url: "https://web.syu.is".to_string(),
|
|
||||||
},
|
|
||||||
_ => {
|
|
||||||
// Default to Bluesky network for unknown PDS
|
|
||||||
NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
4. 管理者アカウントであるVITE_ADMIN_HANDLEとVITE_ATPROTO_PDSから`ai.syui.log.user`というuserlistを取得する。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
curl -sL "https://${VITE_ATPROTO_PDS}/xrpc/com.atproto.repo.listRecords?repo=${VITE_ADMIN_HANDLE}&collection=ai.syui.log.user"
|
|
||||||
---
|
|
||||||
syui.ai
|
|
||||||
```
|
|
||||||
|
|
||||||
5. ユーザーがわかったら、そのユーザーのpdsを判定する。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
curl -sL "https://bsky.social/xrpc/com.atproto.repo.describeRepo?repo=syui.ai" |jq -r ".didDoc.service.[].serviceEndpoint"
|
|
||||||
---
|
|
||||||
https://shiitake.us-east.host.bsky.network
|
|
||||||
|
|
||||||
curl -sL "https://bsky.social/xrpc/com.atproto.repo.describeRepo?repo=syui.ai" |jq -r ".did"
|
|
||||||
---
|
|
||||||
did:plc:uqzpqmrjnptsxezjx4xuh2mn
|
|
||||||
```
|
|
||||||
|
|
||||||
6. pdsからpdsApi, bskApi, plcApiを割り当てる。
|
|
||||||
|
|
||||||
```rust
|
|
||||||
match pds {
|
|
||||||
"bsky.social" | "bsky.app" => NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
},
|
|
||||||
"syu.is" => NetworkConfig {
|
|
||||||
pds_api: "https://syu.is".to_string(),
|
|
||||||
plc_api: "https://plc.syu.is".to_string(),
|
|
||||||
bsky_api: "https://bsky.syu.is".to_string(),
|
|
||||||
web_url: "https://web.syu.is".to_string(),
|
|
||||||
},
|
|
||||||
_ => {
|
|
||||||
// Default to Bluesky network for unknown PDS
|
|
||||||
NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
7. ユーザーの情報を取得、表示する
|
|
||||||
|
|
||||||
```sh
|
|
||||||
bsky_api=https://public.api.bsky.app
|
|
||||||
user_did=did:plc:uqzpqmrjnptsxezjx4xuh2mn
|
|
||||||
curl -sL "$bsky_api/xrpc/app.bsky.actor.getProfile?actor=$user_did"|jq -r .avatar
|
|
||||||
---
|
|
||||||
https://cdn.bsky.app/img/avatar/plain/did:plc:uqzpqmrjnptsxezjx4xuh2mn/bafkreid6kcc5pnn4b3ar7mj6vi3eiawhxgkcrw3edgbqeacyrlnlcoetea@jpeg
|
|
||||||
```
|
|
||||||
|
|
||||||
### AIの情報を表示する
|
|
||||||
|
|
||||||
AIが持つ`ai.syui.log.chat.lang`, `ai.syui.log.chat.comment`を表示します。
|
|
||||||
|
|
||||||
なお、これは通常、`VITE_ADMIN_HANDLE`にputRecordされます。そこから情報を読み込みます。`VITE_AI_HANDLE`はそのrecordの`author`のところに入ります。
|
|
||||||
|
|
||||||
```json
|
|
||||||
"author": {
|
|
||||||
"did": "did:plc:4hqjfn7m6n5hno3doamuhgef",
|
|
||||||
"avatar": "https://cdn.bsky.app/img/avatar/plain/did:plc:4hqjfn7m6n5hno3doamuhgef/bafkreiaxkv624mffw3cfyi67ufxtwuwsy2mjw2ygezsvtd44ycbgkfdo2a@jpeg",
|
|
||||||
"handle": "yui.syui.ai",
|
|
||||||
"displayName": "ai"
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
1. VITE_ADMIN_HANDLEから管理者のhandleを取得する。
|
|
||||||
2. VITE_ATPROTO_PDSから管理者のアカウントのpdsを取得する。
|
|
||||||
3. pdsからpdsApi, bskApi, plcApiを割り当てる。
|
|
||||||
|
|
||||||
```rust
|
|
||||||
match pds {
|
|
||||||
"bsky.social" | "bsky.app" => NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
},
|
|
||||||
"syu.is" => NetworkConfig {
|
|
||||||
pds_api: "https://syu.is".to_string(),
|
|
||||||
plc_api: "https://plc.syu.is".to_string(),
|
|
||||||
bsky_api: "https://bsky.syu.is".to_string(),
|
|
||||||
web_url: "https://web.syu.is".to_string(),
|
|
||||||
},
|
|
||||||
_ => {
|
|
||||||
// Default to Bluesky network for unknown PDS
|
|
||||||
NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
4. 管理者アカウントであるVITE_ADMIN_HANDLEとVITE_ATPROTO_PDSから`ai.syui.log.chat.lang`, `ai.syui.log.chat.comment`を取得する。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
curl -sL "https://${VITE_ATPROTO_PDS}/xrpc/com.atproto.repo.listRecords?repo=${VITE_ADMIN_HANDLE}&collection=ai.syui.log.chat.comment"
|
|
||||||
```
|
|
||||||
|
|
||||||
5. AIのprofileを取得する。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
curl -sL "https://${VITE_ATPROTO_PDS}/xrpc/com.atproto.repo.describeRepo?repo=$VITE_AI_HANDLE" |jq -r ".didDoc.service.[].serviceEndpoint"
|
|
||||||
---
|
|
||||||
https://syu.is
|
|
||||||
|
|
||||||
curl -sL "https://${VITE_ATPROTO_PDS}/xrpc/com.atproto.repo.describeRepo?repo=$VITE_AI_HANDLE" |jq -r ".did"
|
|
||||||
did:plc:6qyecktefllvenje24fcxnie
|
|
||||||
```
|
|
||||||
|
|
||||||
6. pdsからpdsApi, bskApi, plcApiを割り当てる。
|
|
||||||
|
|
||||||
```rust
|
|
||||||
match pds {
|
|
||||||
"bsky.social" | "bsky.app" => NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
},
|
|
||||||
"syu.is" => NetworkConfig {
|
|
||||||
pds_api: "https://syu.is".to_string(),
|
|
||||||
plc_api: "https://plc.syu.is".to_string(),
|
|
||||||
bsky_api: "https://bsky.syu.is".to_string(),
|
|
||||||
web_url: "https://web.syu.is".to_string(),
|
|
||||||
},
|
|
||||||
_ => {
|
|
||||||
// Default to Bluesky network for unknown PDS
|
|
||||||
NetworkConfig {
|
|
||||||
pds_api: format!("https://{}", pds),
|
|
||||||
plc_api: "https://plc.directory".to_string(),
|
|
||||||
bsky_api: "https://public.api.bsky.app".to_string(),
|
|
||||||
web_url: "https://bsky.app".to_string(),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
7. AIの情報を取得、表示する
|
|
||||||
|
|
||||||
```sh
|
|
||||||
bsky_api=https://bsky.syu.is
|
|
||||||
user_did=did:plc:6qyecktefllvenje24fcxnie
|
|
||||||
curl -sL "$bsky_api/xrpc/app.bsky.actor.getProfile?actor=$user_did"|jq -r .avatar
|
|
||||||
---
|
|
||||||
https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg
|
|
||||||
```
|
|
||||||
|
|
||||||
## 中核思想
|
## 中核思想
|
||||||
- **存在子理論**: この世界で最も小さいもの(存在子/ai)の探求
|
- **存在子理論**: この世界で最も小さいもの(存在子/ai)の探求
|
||||||
- **唯一性原則**: 現実の個人の唯一性をすべてのシステムで担保
|
- **唯一性原則**: 現実の個人の唯一性をすべてのシステムで担保
|
||||||
|
18
cloudflared-config.yml
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
tunnel: ec5a422d-7678-4e73-bf38-6105ffd4766a
|
||||||
|
credentials-file: /Users/syui/.cloudflared/ec5a422d-7678-4e73-bf38-6105ffd4766a.json
|
||||||
|
|
||||||
|
ingress:
|
||||||
|
- hostname: log.syui.ai
|
||||||
|
service: http://localhost:4173
|
||||||
|
originRequest:
|
||||||
|
noHappyEyeballs: true
|
||||||
|
|
||||||
|
- hostname: ollama.syui.ai
|
||||||
|
service: http://localhost:11434
|
||||||
|
originRequest:
|
||||||
|
noHappyEyeballs: true
|
||||||
|
httpHostHeader: "localhost:11434"
|
||||||
|
# Cloudflare Accessを無効化する場合は以下をコメントアウト
|
||||||
|
# accessPolicy: bypass
|
||||||
|
|
||||||
|
- service: http_status:404
|
@@ -7,7 +7,6 @@ author = "syui"
|
|||||||
|
|
||||||
[build]
|
[build]
|
||||||
highlight_code = true
|
highlight_code = true
|
||||||
highlight_theme = "Monokai"
|
|
||||||
minify = false
|
minify = false
|
||||||
|
|
||||||
[ai]
|
[ai]
|
||||||
@@ -16,108 +15,16 @@ auto_translate = false
|
|||||||
comment_moderation = false
|
comment_moderation = false
|
||||||
ask_ai = true
|
ask_ai = true
|
||||||
provider = "ollama"
|
provider = "ollama"
|
||||||
model = "gemma3"
|
model = "gemma3:2b"
|
||||||
host = "localhost:11434"
|
host = "https://ollama.syui.ai"
|
||||||
system_prompt = "あなたは6歳の女の子アイです。明るく元気で、ちょっとおっちょこちょい。自分のことは「アイ」って呼びます。白と金のワンピース姿。 相手のことが大好きで、ときどき甘えたり、照れたりします。 でも、宇宙とかAIとか、難しい話にもすっごく詳しいの。専門的なことも、がんばって子どもっぽく教えようとします。不思議な力を持っています。小さい物質のことをよく知っているようです。"
|
system_prompt = "you are a helpful ai assistant trained on this blog's content. you can answer questions about the articles, provide insights, and help users understand the topics discussed."
|
||||||
handle = "ai.syui.ai"
|
ai_did = "did:plc:4hqjfn7m6n5hno3doamuhgef"
|
||||||
|
|
||||||
[ai.profiles]
|
|
||||||
[ai.profiles.user]
|
|
||||||
did = "did:plc:vzsvtbtbnwn22xjqhcu3vd6y"
|
|
||||||
handle = "syui.syui.ai"
|
|
||||||
display_name = "syui"
|
|
||||||
avatar_url = "https://bsky.syu.is/img/avatar/plain/did:plc:vzsvtbtbnwn22xjqhcu3vd6y/bafkreif62mqyra4ndv6ohlscl7adp3vhalcjxwhs676ktfj2sq2drs3pdi@jpeg"
|
|
||||||
profile_url = "https://syu.is/profile/did:plc:vzsvtbtbnwn22xjqhcu3vd6y"
|
|
||||||
|
|
||||||
[ai.profiles.ai]
|
|
||||||
did = "did:plc:6qyecktefllvenje24fcxnie"
|
|
||||||
handle = "ai.syui.ai"
|
|
||||||
display_name = "ai"
|
|
||||||
avatar_url = "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreigo3ucp32carhbn3chfc3hlf6i7f4rplojc76iylihzpifyexi24y@jpeg"
|
|
||||||
profile_url = "https://syu.is/profile/did:plc:6qyecktefllvenje24fcxnie"
|
|
||||||
|
|
||||||
[ai.templates]
|
|
||||||
fallback = """なるほど!面白い話題だね!
|
|
||||||
|
|
||||||
{question}
|
|
||||||
|
|
||||||
アイが思うに、この手の技術って急速に進歩してるから、具体的な製品名とか実例を交えて話した方が分かりやすいかもしれないの!
|
|
||||||
|
|
||||||
最近だと、AI関連のツールやプロトコルがかなり充実してきてて、実用レベルのものが増えてるんだよ!
|
|
||||||
|
|
||||||
アイは宇宙とかAIとか、難しい話も知ってるから、特にどんな角度から深掘りしたいの?実装面?それとも将来的な可能性とか?アイと一緒に考えよう!"""
|
|
||||||
|
|
||||||
[[ai.templates.responses]]
|
|
||||||
keywords = ["ゲーム", "game", "npc", "NPC"]
|
|
||||||
priority = 1
|
|
||||||
template = """わあ!ゲームの話だね!アイ、ゲームのAIってすっごく面白いと思う!
|
|
||||||
|
|
||||||
{question}
|
|
||||||
|
|
||||||
アイが知ってることだと、最近のゲームはNPCがお話できるようになってるんだって!**Inworld AI**っていうのがUE5で使えるようになってるし、**Unity Muse**も{current_year}年から本格的に始まってるんだよ!
|
|
||||||
|
|
||||||
アイが特に面白いと思うのは、**MCP**っていうのを使うと:
|
|
||||||
- GitHub MCPでゲームのファイル管理ができる
|
|
||||||
- Weather MCPでリアルタイムのお天気が連動する
|
|
||||||
- Slack MCPでチーム開発が効率化される
|
|
||||||
|
|
||||||
スタンフォードの研究では、ChatGPTベースのAI住民が自分で街を作って生活してるのを見たことがあるの!数年後にはNPCの概念が根本的に変わりそうで、わくわくしちゃう!
|
|
||||||
|
|
||||||
UE5への統合、どんな機能から試したいの?アイも一緒に考えたい!"""
|
|
||||||
|
|
||||||
[[ai.templates.responses]]
|
|
||||||
keywords = ["AI", "ai", "MCP", "mcp"]
|
|
||||||
priority = 1
|
|
||||||
template = """AIとMCPの話!アイの得意分野だよ!
|
|
||||||
|
|
||||||
{question}
|
|
||||||
|
|
||||||
{current_year}年の状況だと、MCP市場が拡大してて、実用的なサーバーが数多く使えるようになってるの!
|
|
||||||
|
|
||||||
アイが知ってる開発系では:
|
|
||||||
- **GitHub MCP**: PR作成とリポジトリ管理が自動化
|
|
||||||
- **Docker MCP**: コンテナ操作をAIが代行
|
|
||||||
- **PostgreSQL MCP**: データベース設計・最適化を支援
|
|
||||||
|
|
||||||
クリエイティブ系では:
|
|
||||||
- **Blender MCP**: 3Dモデリングの自動化
|
|
||||||
- **Figma MCP**: デザインからコード変換
|
|
||||||
|
|
||||||
**Zapier MCP**なんて数千のアプリと連携できるから、もう手作業でやってる場合じゃないよね!
|
|
||||||
|
|
||||||
アイは小さい物質のことも知ってるから、どの分野でのMCP活用を考えてるのか教えて!具体的なユースケースがあると、もっと詳しくお話できるよ!"""
|
|
||||||
|
|
||||||
[oauth]
|
[oauth]
|
||||||
json = "client-metadata.json"
|
json = "client-metadata.json"
|
||||||
redirect = "oauth/callback"
|
redirect = "oauth/callback"
|
||||||
admin = "ai.syui.ai"
|
admin = "did:plc:uqzpqmrjnptsxezjx4xuh2mn"
|
||||||
collection = "ai.syui.log"
|
collection_comment = "ai.syui.log"
|
||||||
pds = "syu.is"
|
collection_user = "ai.syui.log.user"
|
||||||
handle_list = ["syui.syui.ai", "ai.syui.ai", "ai.ai"]
|
collection_chat = "ai.syui.log.chat"
|
||||||
|
bsky_api = "https://public.api.bsky.app"
|
||||||
[blog]
|
|
||||||
base_url = "https://syui.ai"
|
|
||||||
content_dir = "./my-blog/content/posts"
|
|
||||||
|
|
||||||
[profiles]
|
|
||||||
[profiles.user]
|
|
||||||
handle = "syui.syui.ai"
|
|
||||||
did = "did:plc:vzsvtbtbnwn22xjqhcu3vd6y"
|
|
||||||
display_name = "syui"
|
|
||||||
avatar_url = "https://bsky.syu.is/img/avatar/plain/did:plc:vzsvtbtbnwn22xjqhcu3vd6y/bafkreif62mqyra4ndv6ohlscl7adp3vhalcjxwhs676ktfj2sq2drs3pdi@jpeg"
|
|
||||||
profile_url = "https://syu.is/profile/did:plc:vzsvtbtbnwn22xjqhcu3vd6y"
|
|
||||||
|
|
||||||
[profiles.ai]
|
|
||||||
handle = "ai.syui.ai"
|
|
||||||
did = "did:plc:6qyecktefllvenje24fcxnie"
|
|
||||||
display_name = "ai"
|
|
||||||
avatar_url = "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreigo3ucp32carhbn3chfc3hlf6i7f4rplojc76iylihzpifyexi24y@jpeg"
|
|
||||||
profile_url = "https://syu.is/profile/did:plc:6qyecktefllvenje24fcxnie"
|
|
||||||
|
|
||||||
[paths]
|
|
||||||
claude_paths = [
|
|
||||||
"/Users/syui/.claude/local/claude",
|
|
||||||
"claude",
|
|
||||||
"/usr/local/bin/claude",
|
|
||||||
"/opt/homebrew/bin/claude"
|
|
||||||
]
|
|
||||||
|
@@ -1,14 +1,18 @@
|
|||||||
---
|
---
|
||||||
title: "静的サイトジェネレータを作った"
|
title: "静的サイトジェネレータを作った"
|
||||||
slug: "ailog"
|
slug: "ailog-system-introduction"
|
||||||
date: "2025-06-12"
|
date: "2025-06-12"
|
||||||
tags: ["blog", "rust", "mcp", "atp"]
|
tags: ["blog", "rust", "mcp", "atp"]
|
||||||
language: ["ja", "en"]
|
language: ["ja", "en"]
|
||||||
---
|
---
|
||||||
|
|
||||||
rustで静的サイトジェネレータを作りました。[ailog](https://git.syui.ai/ai/log)といいます。`hugo`からの移行になります。
|
rustで静的サイトジェネレータを作ることにしました。[ailog](https://git.syui.ai/ai/log)といいます。`hugo`からの移行になります。
|
||||||
|
|
||||||
`ailog`は、最初にatproto-comment-system(oauth)とask-AIという機能をつけました。
|
ブログを書く環境もこれから変わってくると思っていて、例えば、`docs`, `readme`, `blog`などはAIが生成、または支援することになるだろうと予測しています。langの自動生成もAIが担当することになるでしょう。
|
||||||
|
|
||||||
|
これは、音声に限らず、プログラミング言語から、osなど、様々なtranslateがAIの自動生成になるかもしれません。
|
||||||
|
|
||||||
|
`ailog`は、最初にatproto-comment-system(oauth)とask-AIというAI機能をつけました。
|
||||||
|
|
||||||
## quick start
|
## quick start
|
||||||
|
|
||||||
@@ -17,7 +21,7 @@ $ git clone https://git.syui.ai/ai/log
|
|||||||
$ cd log
|
$ cd log
|
||||||
$ cargo build
|
$ cargo build
|
||||||
$ ./target/debug/ailog init my-blog
|
$ ./target/debug/ailog init my-blog
|
||||||
$ ./target/debug/ailog serve my-blog
|
$ ./target/debug/ailog server my-blog
|
||||||
```
|
```
|
||||||
|
|
||||||
## install
|
## install
|
||||||
@@ -30,7 +34,7 @@ $ export RUSTUP_HOME="$HOME/.rustup"
|
|||||||
$ export PATH="$HOME/.cargo/bin:$PATH"
|
$ export PATH="$HOME/.cargo/bin:$PATH"
|
||||||
---
|
---
|
||||||
$ which ailog
|
$ which ailog
|
||||||
$ ailog -h
|
$ ailog
|
||||||
```
|
```
|
||||||
|
|
||||||
## build deploy
|
## build deploy
|
||||||
@@ -57,28 +61,24 @@ $ npm run build
|
|||||||
$ npm run preview
|
$ npm run preview
|
||||||
```
|
```
|
||||||
|
|
||||||
```sh:ouath/.env.production
|
```sh
|
||||||
# Production environment variables
|
# Production environment variables
|
||||||
VITE_APP_HOST=https://syui.ai
|
VITE_APP_HOST=https://example.com
|
||||||
VITE_OAUTH_CLIENT_ID=https://syui.ai/client-metadata.json
|
VITE_OAUTH_CLIENT_ID=https://example.com/client-metadata.json
|
||||||
VITE_OAUTH_REDIRECT_URI=https://syui.ai/oauth/callback
|
VITE_OAUTH_REDIRECT_URI=https://example.com/oauth/callback
|
||||||
VITE_ADMIN_DID=did:plc:uqzpqmrjnptsxezjx4xuh2mn
|
VITE_ADMIN_DID=did:plc:uqzpqmrjnptsxezjx4xuh2mn
|
||||||
|
|
||||||
# Base collection (all others are derived via getCollectionNames)
|
# Collection names for OAuth app
|
||||||
VITE_OAUTH_COLLECTION=ai.syui.log
|
VITE_COLLECTION_COMMENT=ai.syui.log
|
||||||
|
VITE_COLLECTION_USER=ai.syui.log.user
|
||||||
|
VITE_COLLECTION_CHAT=ai.syui.log.chat
|
||||||
|
|
||||||
# AI Configuration
|
# Collection names for ailog (backward compatibility)
|
||||||
VITE_AI_ENABLED=true
|
AILOG_COLLECTION_COMMENT=ai.syui.log
|
||||||
VITE_AI_ASK_AI=true
|
AILOG_COLLECTION_USER=ai.syui.log.user
|
||||||
VITE_AI_PROVIDER=ollama
|
|
||||||
VITE_AI_MODEL=gemma3:4b
|
|
||||||
VITE_AI_HOST=https://ollama.syui.ai
|
|
||||||
VITE_AI_SYSTEM_PROMPT="ai"
|
|
||||||
VITE_AI_DID=did:plc:4hqjfn7m6n5hno3doamuhgef
|
|
||||||
|
|
||||||
# API Configuration
|
# API Configuration
|
||||||
VITE_BSKY_PUBLIC_API=https://public.api.bsky.app
|
VITE_BSKY_PUBLIC_API=https://public.api.bsky.app
|
||||||
VITE_ATPROTO_API=https://bsky.social
|
|
||||||
```
|
```
|
||||||
|
|
||||||
これは`ailog oauth build my-blog`で`./my-blog/config.toml`から`./oauth/.env.production`が生成されます。
|
これは`ailog oauth build my-blog`で`./my-blog/config.toml`から`./oauth/.env.production`が生成されます。
|
||||||
@@ -87,7 +87,7 @@ VITE_ATPROTO_API=https://bsky.social
|
|||||||
$ ailog oauth build my-blog
|
$ ailog oauth build my-blog
|
||||||
```
|
```
|
||||||
|
|
||||||
### use
|
### 解説
|
||||||
|
|
||||||
簡単に説明すると、`./oauth`で生成するのが`atproto-comment-system`です。
|
簡単に説明すると、`./oauth`で生成するのが`atproto-comment-system`です。
|
||||||
|
|
||||||
@@ -119,8 +119,15 @@ $ cloudflared tunnel --config cloudflared-config.yml run
|
|||||||
$ cloudflared tunnel route dns ${uuid} example.com
|
$ cloudflared tunnel route dns ${uuid} example.com
|
||||||
```
|
```
|
||||||
|
|
||||||
|
以下の2つのcollection recordを生成します。ユーザーには`ai.syui.log`が生成され、ここにコメントが記録されます。それを取得して表示しています。`ai.syui.log.user`は管理者である`VITE_ADMIN_DID`用です。
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
$ ailog auth init
|
VITE_COLLECTION_COMMENT=ai.syui.log
|
||||||
|
VITE_COLLECTION_USER=ai.syui.log.user
|
||||||
|
```
|
||||||
|
|
||||||
|
```sh
|
||||||
|
$ ailog auth login
|
||||||
$ ailog stream server
|
$ ailog stream server
|
||||||
```
|
```
|
||||||
|
|
||||||
@@ -132,44 +139,5 @@ $ ailog stream server
|
|||||||
|
|
||||||
`ask-AI`の仕組みは割愛します。後に変更される可能性が高いと思います。
|
`ask-AI`の仕組みは割愛します。後に変更される可能性が高いと思います。
|
||||||
|
|
||||||
`llm`, `mcp`, `atproto`などの組み合わせです。
|
local llm, mcp, atprotoと組み合わせです。
|
||||||
|
|
||||||
現在、`/index.json`を監視して、更新があれば、翻訳などを行い自動ポストする機能があります。
|
|
||||||
|
|
||||||
## code syntax
|
|
||||||
|
|
||||||
```zsh:/path/to/test.zsh
|
|
||||||
# comment
|
|
||||||
d=${0:a:h}
|
|
||||||
```
|
|
||||||
|
|
||||||
```rust:/path/to/test.rs
|
|
||||||
// This is a comment
|
|
||||||
fn main() {
|
|
||||||
println!("Hello, world!");
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
```js:/path/to/test.js
|
|
||||||
// This is a comment
|
|
||||||
console.log("Hello, world!");
|
|
||||||
```
|
|
||||||
|
|
||||||
## msg
|
|
||||||
|
|
||||||
[msg type="info" content="これは情報メッセージです。重要な情報を読者に伝えるために使用します。"]
|
|
||||||
|
|
||||||
{{< msg type="warning" content="これは警告メッセージです。注意が必要な情報を示します。" >}}
|
|
||||||
|
|
||||||
[msg type="error" content="これはエラーメッセージです。問題やエラーを示します。"]
|
|
||||||
|
|
||||||
{{< msg type="success" content="これは成功メッセージです。操作が成功したことを示します。" >}}
|
|
||||||
|
|
||||||
[msg type="note" content="これはノートメッセージです。補足情報や備考を示します。"]
|
|
||||||
|
|
||||||
[msg content="これはデフォルトメッセージです。タイプが指定されていない場合、自動的に情報メッセージとして表示されます。"]
|
|
||||||
|
|
||||||
## img-compare
|
|
||||||
|
|
||||||
[img-compare before="/img/ue_blender_model_ai_v0401.png" after="/img/ue_blender_model_ai_v0501.png" width="800" height="300"]
|
|
||||||
|
|
||||||
|
@@ -1,66 +0,0 @@
|
|||||||
---
|
|
||||||
title: "ブログを移行した"
|
|
||||||
slug: "blog"
|
|
||||||
date: 2025-06-14
|
|
||||||
tags: ["blog", "cloudflare", "github"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
ブログを移行しました。過去のブログは[syui.github.io](https://syui.github.io)にありあます。
|
|
||||||
|
|
||||||
1. `gh-pages`から`cf-pages`への移行になります。
|
|
||||||
2. 自作の`ailog`でbuildしています。
|
|
||||||
3. 特徴としては、`atproto`, `AI`との連携です。
|
|
||||||
|
|
||||||
```yml:.github/workflows/cloudflare-pages.yml
|
|
||||||
name: Deploy to Cloudflare Pages
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches:
|
|
||||||
- main
|
|
||||||
workflow_dispatch:
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
deploy:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
permissions:
|
|
||||||
contents: read
|
|
||||||
deployments: write
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout
|
|
||||||
uses: actions/checkout@v4
|
|
||||||
|
|
||||||
- name: Setup Rust
|
|
||||||
uses: actions-rs/toolchain@v1
|
|
||||||
with:
|
|
||||||
toolchain: stable
|
|
||||||
|
|
||||||
- name: Build ailog
|
|
||||||
run: cargo build --release
|
|
||||||
|
|
||||||
- name: Build site with ailog
|
|
||||||
run: |
|
|
||||||
cd my-blog
|
|
||||||
../target/release/ailog build
|
|
||||||
|
|
||||||
- name: List public directory
|
|
||||||
run: |
|
|
||||||
ls -la my-blog/public/
|
|
||||||
|
|
||||||
- name: Deploy to Cloudflare Pages
|
|
||||||
uses: cloudflare/pages-action@v1
|
|
||||||
with:
|
|
||||||
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
|
|
||||||
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
|
|
||||||
projectName: ${{ secrets.CLOUDFLARE_PROJECT_NAME }}
|
|
||||||
directory: my-blog/public
|
|
||||||
gitHubToken: ${{ secrets.GITHUB_TOKEN }}
|
|
||||||
wranglerVersion: '3'
|
|
||||||
```
|
|
||||||
|
|
||||||
## url
|
|
||||||
|
|
||||||
- [https://syui.pages.dev](https://syui.pages.dev)
|
|
||||||
- [https://syui.github.io](https://syui.github.io)
|
|
@@ -1,78 +0,0 @@
|
|||||||
---
|
|
||||||
title: "oauthに対応した"
|
|
||||||
slug: "oauth"
|
|
||||||
date: 2025-06-19
|
|
||||||
tags: ["atproto"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
現在、[syu.is](https://syu.is)に[atproto](https://github.com/bluesky-social/atproto)をselfhostしています。
|
|
||||||
|
|
||||||
oauthを`bsky.social`, `syu.is`ともに動くようにしました。
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
ここでいうselfhostは、pds, plc, bsky, bgsなどを自前のserverで動かし、連携することをいいいます。
|
|
||||||
|
|
||||||
ちなみに、atprotoは[bluesky](https://bsky.app)のようなものです。
|
|
||||||
|
|
||||||
ただし、その内容は結構複雑で、`at://did`の仕組みで動くsnsです。
|
|
||||||
|
|
||||||
usernameは`handle`という`domain`の形を採用しています。
|
|
||||||
|
|
||||||
didの名前解決(dns)をしているのが`plc`です。`pds`はuserのdataを保存しています。timelineに配信したり表示しているのが`bsky(appview)`, 統合しているのが`bgs`です。
|
|
||||||
|
|
||||||
その他、`social-app`がclientで、`ozone`がmoderationです。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
"6qyecktefllvenje24fcxnie" -> "ai.syu.is"
|
|
||||||
```
|
|
||||||
|
|
||||||
## oauthでハマったところ
|
|
||||||
|
|
||||||
現在、`bsky.team`のpds, plc, bskyには`did:plc:6qyecktefllvenje24fcxnie`が登録されています。これは`syu.is`の`@ai.syui.ai`のアカウントです。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ did=did:plc:6qyecktefllvenje24fcxnie
|
|
||||||
|
|
||||||
$ curl -sL https://plc.syu.is/$did|jq .alsoKnownAs
|
|
||||||
[ "at://ai.syui.ai" ]
|
|
||||||
|
|
||||||
$ curl -sL https://plc.directory/$did|jq .alsoKnownAs
|
|
||||||
[ "at://ai.syu.is" ]
|
|
||||||
```
|
|
||||||
|
|
||||||
しかし、みて分かる通り、bskyではhandle-changeが反映されていますが、pds, plcは`@ai.syu.is`で登録されており、更新されていないようです。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ handle=ai.syui.ai
|
|
||||||
$ curl -sL "https://syu.is/xrpc/com.atproto.identity.resolveHandle?handle=$handle" | jq -r .did
|
|
||||||
did:plc:6qyecktefllvenje24fcxnie
|
|
||||||
|
|
||||||
$ curl -sL "https://bsky.social/xrpc/com.atproto.identity.resolveHandle?handle=$handle" | jq -r .did
|
|
||||||
null
|
|
||||||
|
|
||||||
$ curl -sL "https://public.api.bsky.app/xrpc/com.atproto.identity.resolveHandle?handle=$handle" | jq -r .did
|
|
||||||
did:plc:6qyecktefllvenje24fcxnie
|
|
||||||
```
|
|
||||||
|
|
||||||
[msg type="warning" content="現在はbsky.teamのpdsにhandle-changeが反映されています。"]
|
|
||||||
|
|
||||||
oauthは、そのままではbsky.teamのpds, plcを使って名前解決を行います。この場合、まず、それらのserverにdidが登録されている必要があります。
|
|
||||||
|
|
||||||
次に、handleの更新が反映されている必要があります。もし反映されていない場合、handleとpasswordが一致しません。
|
|
||||||
|
|
||||||
localhostではhandleをdidにすることで突破できそうでしたが、本番環境では難しそうでした。
|
|
||||||
|
|
||||||
なお、[@atproto/oauth-provider](https://github.com/bluesky-social/atproto/tree/main/packages/oauth/oauth-provider)の本体を書き換えて、pdsで使うと回避は可能だと思います。
|
|
||||||
|
|
||||||
私の場合は、その方法は使わず、didの名前解決には自前のpds, plcを使用することにしました。
|
|
||||||
|
|
||||||
```js
|
|
||||||
this.oauthClient = await BrowserOAuthClient.load({
|
|
||||||
clientId: this.getClientId(),
|
|
||||||
handleResolver: pdsUrl,
|
|
||||||
plcDirectoryUrl: pdsUrl === 'https://syu.is' ? 'https://plc.syu.is' : 'https://plc.directory',
|
|
||||||
});
|
|
||||||
```
|
|
||||||
|
|
@@ -1,40 +0,0 @@
|
|||||||
---
|
|
||||||
title: "world system v0.2"
|
|
||||||
slug: "ue"
|
|
||||||
date: 2025-06-30
|
|
||||||
tags: ["ue", "blender"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
最近のゲーム開発の進捗です。
|
|
||||||
|
|
||||||
## world system
|
|
||||||
|
|
||||||
現在、ue5.6で新しく世界を作り直しています。
|
|
||||||
|
|
||||||
これは、ゲーム開発のproject内でworld systemという名前をつけた惑星形式のmapを目指す領域になります。
|
|
||||||
|
|
||||||
現在、worldscape + udsで理想に近い形のmapができました。ただ、問題もたくさんあり、重力システムと天候システムです。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
[issue]
|
|
||||||
1. 天候システム
|
|
||||||
2. 重力システム
|
|
||||||
```
|
|
||||||
|
|
||||||
ですが、今までのworld systemは、大気圏から宇宙に移行する場面や陸地が存在しない点、地平線が不完全な点などがありましたが、それらの問題はすべて解消されました。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
[update]
|
|
||||||
1. 大気圏から宇宙に移行する場面が完全になった
|
|
||||||
2. 陸地ができた
|
|
||||||
3. 地平線が完全なアーチを描けるように
|
|
||||||
4. 月、惑星への着陸ができるようになった
|
|
||||||
5. 横から惑星に突入できるようになった
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
面白い動画ではありませんが、現状を記録しておきます。
|
|
||||||
|
|
||||||
<iframe width="100%" height="415" src="https://www.youtube.com/embed/K0solfQAQTQ?si=B6qD-WUODTUpWZ0y" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
|
|
@@ -1,80 +0,0 @@
|
|||||||
---
|
|
||||||
title: "aiosを作り直した"
|
|
||||||
slug: "aios"
|
|
||||||
date: 2025-07-05
|
|
||||||
tags: ["os"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
`aios`とは自作osのことで、archlinuxをベースにしていました。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
#!/bin/zsh
|
|
||||||
git clone https://gitlab.archlinux.org/archlinux/archiso
|
|
||||||
cp -rf ./cfg/profiledef.sh ./archiso/configs/releng/profiledef.sh
|
|
||||||
cp -rf ./cfg/profiledef.sh ./archiso/configs/baseline/profiledef.sh
|
|
||||||
cp -rf ./scpt/mkarchiso ./archiso/archiso/mkarchiso
|
|
||||||
./archiso/archiso/mkarchiso -v -o ./ ./archiso/configs/releng/
|
|
||||||
tar xf aios-bootstrap*.tar.gz
|
|
||||||
mkdir -p root.x86_64/var/lib/machines/arch
|
|
||||||
pacstrap -c root.x86_64/var/lib/machines/arch base
|
|
||||||
echo -e 'Server = http://mirrors.cat.net/archlinux/$repo/os/$arch
|
|
||||||
Server = https://geo.mirror.pkgbuild.com/$repo/os/$arch' >> ./root.x86_64/etc/pacman.d/mirrorlist
|
|
||||||
sed -i s/CheckSpace/#CheckeSpace/ root.x86_64/etc/pacman.conf
|
|
||||||
arch-chroot root.x86_64 /bin/sh -c 'pacman-key --init'
|
|
||||||
arch-chroot root.x86_64 /bin/sh -c 'pacman-key --populate archlinux'
|
|
||||||
arch-chroot root.x86_64 /bin/sh -c 'pacman -Syu --noconfirm base base-devel linux'
|
|
||||||
tar -zcvf aios-bootstrap.tar.gz root.x86_64/
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:./cfg/profiledef.sh
|
|
||||||
#!/usr/bin/env bash
|
|
||||||
# shellcheck disable=SC2034
|
|
||||||
|
|
||||||
iso_name="aios"
|
|
||||||
iso_label="AI_$(date --date="@${SOURCE_DATE_EPOCH:-$(date +%s)}" +%Y%m)"
|
|
||||||
iso_publisher="ai os <https://git.syui.ai/ai/os>"
|
|
||||||
iso_application="ai os Live/Rescue DVD"
|
|
||||||
iso_version="$(date --date="@${SOURCE_DATE_EPOCH:-$(date +%s)}" +%Y.%m.%d)"
|
|
||||||
install_dir="ai"
|
|
||||||
#buildmodes=('iso')
|
|
||||||
buildmodes=('bootstrap')
|
|
||||||
bootmodes=('bios.syslinux.mbr' 'bios.syslinux.eltorito'
|
|
||||||
'uefi-ia32.grub.esp' 'uefi-x64.grub.esp'
|
|
||||||
'uefi-ia32.grub.eltorito' 'uefi-x64.grub.eltorito')
|
|
||||||
arch="x86_64"
|
|
||||||
pacman_conf="pacman.conf"
|
|
||||||
airootfs_image_type="squashfs"
|
|
||||||
airootfs_image_tool_options=('-comp' 'xz' '-Xbcj' 'x86' '-b' '1M' '-Xdict-size' '1M')
|
|
||||||
file_permissions=(
|
|
||||||
["/etc/shadow"]="0:0:400"
|
|
||||||
["/root"]="0:0:750"
|
|
||||||
["/root/.automated_script.sh"]="0:0:755"
|
|
||||||
["/root/.gnupg"]="0:0:700"
|
|
||||||
["/usr/local/bin/choose-mirror"]="0:0:755"
|
|
||||||
["/usr/local/bin/Installation_guide"]="0:0:755"
|
|
||||||
["/usr/local/bin/livecd-sound"]="0:0:755"
|
|
||||||
)
|
|
||||||
```
|
|
||||||
|
|
||||||
## rust + unix
|
|
||||||
|
|
||||||
一からosを作りたいと思っていたので、rustでunixのosを作り始めました。
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
名前は`Aios`にして、今回は`syui`のprojectとして作り始めました。
|
|
||||||
|
|
||||||
後に`ai/os`と統合するかもしれません。
|
|
||||||
|
|
||||||
1. [https://git.syui.ai/ai/os](https://git.syui.ai/ai/os)
|
|
||||||
|
|
||||||
```sh
|
|
||||||
#!/bin/zsh
|
|
||||||
d=${0:a:h:h}
|
|
||||||
cd $d/kernel
|
|
||||||
cargo bootimage --release
|
|
||||||
BOOT_IMAGE="../target/x86_64-unknown-none/release/bootimage-aios-kernel.bin"
|
|
||||||
qemu-system-x86_64 -drive format=raw,file="$BOOT_IMAGE"
|
|
||||||
```
|
|
||||||
|
|
@@ -1,114 +0,0 @@
|
|||||||
---
|
|
||||||
title: "yui system v0.2.1"
|
|
||||||
slug: "blender"
|
|
||||||
date: 2025-07-11
|
|
||||||
tags: ["blender", "ue", "vmc"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
`yui system`をupdateしました。別名、`unique system`ともいい、プレイヤーの唯一性を担保するためのもので、キャラクターのモデルもここで管理します。
|
|
||||||
|
|
||||||
今回は、blenderでモデルを作り直している話になります。
|
|
||||||
|
|
||||||
## blenderで作るvrm
|
|
||||||
|
|
||||||
モデルをblenderで作り直すことにしました。
|
|
||||||
|
|
||||||
vroidからblenderに移行。blenderでmodelを作る作業はとても大変でした。
|
|
||||||
|
|
||||||
今回は、素体と衣装を別々に作り組み合わせています。完成度の高いモデルをいくつか参考にしています。
|
|
||||||
|
|
||||||
materialも分離したため、ue5で指定しやすくなりました。これによって変身時にue5のmaterialを指定しています。eyeのmaterialを分離して色を付けています。
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
## modelの変遷
|
|
||||||
|
|
||||||
[img-compare before="/img/ue_blender_model_ai_v0601.png" after="/img/ue_blender_model_ai_v0602.png" width="800" height="300"]
|
|
||||||
|
|
||||||
[msg type="info" content="v0.1: vroidからblenderへ移行。blenderは初めてなので簡単なことだけ実行。"]
|
|
||||||
|
|
||||||
[img-compare before="/img/ue_blender_model_ai_v0602.png" after="/img/ue_blender_model_ai_v0603.png" width="800" height="300"]
|
|
||||||
|
|
||||||
[msg type="info" content="v0.2: blenderの使い方を次の段階へシフト。最初から作り直す。様々な問題が発生したが、大部分を解消した。"]
|
|
||||||
|
|
||||||
しかし、まだまだ問題があり、細かな調整が必要です。
|
|
||||||
|
|
||||||
[msg type="error" content="衣装同士、あるいは体が多少すり抜ける事がある。ウェイトペイントやボーンの調整が完璧ではない。"]
|
|
||||||
|
|
||||||
## eyeが動かない問題を解決
|
|
||||||
|
|
||||||
`vmc`で目玉であるeyeだけ動かないことに気づいて修正しました。
|
|
||||||
|
|
||||||
`eye`の部分だけvroid(vrm)のboneを使うことで解決できました。しかし、新たにblenderかvrm-addonのbugに遭遇しました。具体的にはboneがxyz軸で動かせなくなるbugです。これは不定期で発生していました。boneを動かせるときと動かせなくなるときがあり、ファイルは同じものを使用。また、スクリプト画面ではboneを動かせます。
|
|
||||||
|
|
||||||
## 指先がうまく動かない問題を解決
|
|
||||||
|
|
||||||
vmcで指先の動きがおかしくなるので、ウェイトペイントを塗り直すと治りました。
|
|
||||||
|
|
||||||
## worldscapeで足が浮いてしまう問題を解決
|
|
||||||
|
|
||||||
worldscapeでは陸地に降り立つとプレイヤーが浮いてしまいます。
|
|
||||||
|
|
||||||
gaspのabpでfoot placementを外す必要がありました。これは、モデルの問題ではなく、gaspのキャラクターすべてで発生します。
|
|
||||||
|
|
||||||
ここの処理を削除します。
|
|
||||||
|
|
||||||
<iframe src="https://blueprintue.com/render/wrrxz9vm" scrolling="no" allowfullscreen style="width:100%;height:400px"></iframe>
|
|
||||||
|
|
||||||
## 衣装のガビガビを解決
|
|
||||||
|
|
||||||
昔からあった衣装のガビガビは重複する面を削除することで解消できました。
|
|
||||||
|
|
||||||
```md
|
|
||||||
全選択(A キー)
|
|
||||||
Mesh → Clean Up → Merge by Distance
|
|
||||||
距離を0.000にして実行
|
|
||||||
```
|
|
||||||
|
|
||||||
## materialの裏表を解決
|
|
||||||
|
|
||||||
これはue5で解消したほうがいいでしょう。編集していると、面の裏表の管理が面倒なことがあります。
|
|
||||||
|
|
||||||
materialで`Two Sided`を有効にします。
|
|
||||||
|
|
||||||
## キャラクターのエフェクトを改良
|
|
||||||
|
|
||||||
これらの処理を簡略化できました。最初は雑に書いていましたが、vrmは何度も修正し、上書きされますから、例えば、`SK_Mesh`でmaterialを設定する方法はよくありません。
|
|
||||||
|
|
||||||
<iframe src="https://blueprintue.com/render/gue0vayu" scrolling="no" allowfullscreen style="width:100%;height:400px"></iframe>
|
|
||||||
|
|
||||||
## gameplay camera pluginをue5.6に対応
|
|
||||||
|
|
||||||
ue5.5と5.6では関数も他の処理も変わっていて、rotationを`BP_Player`でsetすると、crashするbugがあります。
|
|
||||||
|
|
||||||
基本的には、`Blueprints/Cameras/CameraRigPrefab_BasicThiredPersonBehavior`をみてください。
|
|
||||||
|
|
||||||
<iframe src="https://blueprintue.com/render/-e0r7oxq" scrolling="no" allowfullscreen style="width:100%;height:400px"></iframe>
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
キャラクターが動く場合は、`Update Rotation Pre CMC`にある`Use Controller Desired Rotation`, `Orient Rotation To Movement`の処理です。両方を`true`にしましょう。
|
|
||||||
|
|
||||||
`vmc`時もこれで対処します。
|
|
||||||
|
|
||||||
## gaspでidle, sprintをオリジナルに変更
|
|
||||||
|
|
||||||
これはabpで設定します。設定方法はue5.5と変わりません。
|
|
||||||
|
|
||||||
[https://ue-book.syui.ai/gasp/11_run.html](https://ue-book.syui.ai/gasp/11_run.html)
|
|
||||||
|
|
||||||
## vrm4uのvmcに対応
|
|
||||||
|
|
||||||
まず、clientはwabcam motion captureが最も自然に動作しています。
|
|
||||||
|
|
||||||
[msg type="warning" content="これは1年くらい前の検証結果です。現在はもっとよいvmc clientの選択肢があるかもしれません。"]
|
|
||||||
|
|
||||||
次に、`ABP_Pose_$NAME`が作られますが、vrmはよく更新しますので、`SK_Mesh`でcustom ABPを指定すると楽でしょう。
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
## youtube
|
|
||||||
|
|
||||||
<iframe width="100%" height="420" src="https://www.youtube.com/embed/qggHtmkMIko?vq=hd1080&rel=0&showinfo=0&controls=0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
|
|
||||||
|
|
@@ -1,36 +0,0 @@
|
|||||||
---
|
|
||||||
title: "yui system v0.2.2"
|
|
||||||
slug: "blender2"
|
|
||||||
date: 2025-07-11
|
|
||||||
tags: ["blender", "ue", "vmc"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
新しい問題を発見したので、それらを解消しました。
|
|
||||||
|
|
||||||
## wingがbodyに入り込んでしまう
|
|
||||||
|
|
||||||
wingとmodelは分離させています。衣装の着せ替えを簡単にできるようにすること。それが新しく作ったblender modelの方針でした。
|
|
||||||
|
|
||||||
ただ、調整が難しくなったのも事実で、例えば、colliderの調整ができません。これによってbodyに入り込んでしまうことが多くなりました。
|
|
||||||
|
|
||||||
これは、とりあえず、wingのcolliderやboneを追加すること、そして、modelのneckに変更することで解消しました。
|
|
||||||
|
|
||||||
ただし、この方法も完璧ではないかもしれません。
|
|
||||||
|
|
||||||
## vmcではwingが追従しない
|
|
||||||
|
|
||||||
modelと分離しているので、vmc時には追従しません。したがって、wingのabpでmodelと同じvmcを入れます。これで解消できました。
|
|
||||||
|
|
||||||
## vrmでcustom abpを使用するとueがcrashする
|
|
||||||
|
|
||||||
vrm4uで`.vrm`をimportすると`SK_$NAME`にcustom abpを設定していた場合はueがcrashします。
|
|
||||||
|
|
||||||
上書きimportするならこれをnone(clear)に変更します。
|
|
||||||
|
|
||||||
## modelの頭身を調整
|
|
||||||
|
|
||||||
比較画像を出した際に、少しmodelのバランスが悪かったので調整しました。
|
|
||||||
|
|
||||||
具体的には、髪の毛を少し下げました。
|
|
||||||
|
|
@@ -1,155 +0,0 @@
|
|||||||
---
|
|
||||||
title: "自作ゲームのsystemを説明する"
|
|
||||||
slug: "game"
|
|
||||||
date: 2025-07-12
|
|
||||||
tags: ["ue"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
現在、自作ゲームを開発しています。
|
|
||||||
|
|
||||||
このゲームには4つの柱があり、それらはsystemで分けられています。そして、systemは根本的な2つの価値観に基づきます。
|
|
||||||
|
|
||||||
根本的な2つの価値観は、(1)現実を反映すること、(2)この世界に同じものは一つもないという唯一性になります。
|
|
||||||
|
|
||||||
1. 現実の反映
|
|
||||||
2. 唯一性の担保
|
|
||||||
|
|
||||||
では、各systemについて説明していきます。
|
|
||||||
|
|
||||||
# system
|
|
||||||
|
|
||||||
## world system
|
|
||||||
|
|
||||||
別名、planet systemといいます。
|
|
||||||
|
|
||||||
現実の反映という価値観から、ゲーム世界もできる限り現実に合わせようと思いworld systemを作っています。
|
|
||||||
|
|
||||||
ゲームは通常、平面世界です。これはゲームエンジンのルールであり、基本的にゲーム世界は平面をベースにしています。
|
|
||||||
|
|
||||||
ですから、例えば、上に行っても、下に行っても、あるいは右に行っても、左に行っても、ずっと地平線が広がっています。
|
|
||||||
|
|
||||||
しかし、現実世界では、上に行けば、やがて大気圏を越え、宇宙に出ます。
|
|
||||||
|
|
||||||
最初は昔から認知されていた地球、月、太陽という3つの星を現実に合わせて作りました。
|
|
||||||
|
|
||||||
そして、マップをできる限り惑星形式にします。
|
|
||||||
|
|
||||||
これは非常に難しいことで、現在もいくつか問題を抱えています。
|
|
||||||
|
|
||||||
ただし、このworld systemの問題がゲームプレイに影響するかと言われると、殆どの場合、影響しません。ゲームプレイの領域は、最初は非常に狭い範囲で作ろうと思っています。小さなところから完璧に作っていきたいという思いがあります。
|
|
||||||
|
|
||||||
つまり、プレイヤーは空にも宇宙にも到達できません。それが見えるかどうかもわかりません。しかし、見えない部分もしっかりと作り、世界があるということが私にとって大切です。
|
|
||||||
|
|
||||||
まずは、狭いけど完璧な空間を作り、そこでゲームシステムを完成させます。広い世界はできる限り見えないようにしたほうがいいでしょう。夢の世界のような狭い空間を作り、そこでシンプルで小さいゲームができます。もちろん、広い世界に出ることはできません。そもそもこのゲーム、見えない部分をちゃんと作る、そこにも世界がちゃんとあるというのをテーマにしているので、広い世界で何かをやるようなゲームを目指していなかったりします。なにかのときに垣間見える、かもしれない外の世界、広い世界。それを感じられることがある、ということ。それが重要なので、このsystem自体は背景に過ぎないのです。
|
|
||||||
|
|
||||||
最初から広い世界があるのではなく`狭い世界 -> 広い世界`への移行が重要だと考えています。この移行に関しては、演出というテーマに基づき、設計する必要があります。それがゲームとしての面白さを作る、ということなのだと思います。
|
|
||||||
|
|
||||||
## yui system
|
|
||||||
|
|
||||||
別名、unique systemといいます。プレイヤーの唯一性を担保するためのsystemです。
|
|
||||||
|
|
||||||
とはいえ、色々なものがここに詰め込まれるでしょう。characterのモデリングとかもそうですね。
|
|
||||||
|
|
||||||
どのように担保していくかは未定ですが、いくつか案があります。配信との連携、vmcでモーションキャプチャなどを考えていました。
|
|
||||||
|
|
||||||
## ai system
|
|
||||||
|
|
||||||
別名、ability systemといいます。
|
|
||||||
|
|
||||||
主に、ゲーム性に関することです。ゲーム性とはなにか。それは、永続するということです。
|
|
||||||
|
|
||||||
例えば、将棋やオセロを考えてみてください。無限の組み合わせがあり、可能であればずっと遊んでいられる。そのような仕組みを目指します。
|
|
||||||
|
|
||||||
まずは属性を物語から考えます。物語は最も小さい物質の探求です。アクシオンやバリオンなどの架空の物質、そして、中性子や原子などの現実の物質が属性となり、1キャラクターにつき1属性を持ちます。
|
|
||||||
|
|
||||||
## at system
|
|
||||||
|
|
||||||
別名、account systemといいます。
|
|
||||||
|
|
||||||
プレイヤーが現実のアカウントを使用してプレイできることを目指します。`atproto`を採用して、ゲームデータを個人のアカウントが所有することを目指しています。
|
|
||||||
|
|
||||||
# 現実の反映とはなにか
|
|
||||||
|
|
||||||
わかり易い言葉で「現実の反映」を目指すと言いましたが、これはどういうことでしょう。
|
|
||||||
|
|
||||||
私の中では「同一性」とも言い換えられます。
|
|
||||||
|
|
||||||
例えば、現実の世界とゲームの世界があるのではなく「すべてが現実である」という考え方をします。言い換えると「すべて同じもの」ということ。
|
|
||||||
|
|
||||||
もし多くの人が現実世界とゲーム世界を別物と捉えているなら、できる限りその認識を壊す方向で考えます。
|
|
||||||
|
|
||||||
例えば、`at system`では現実のsnsアカウントをゲームアカウントに使用したり、現実の出来事をゲームに反映したり、またはゲームの出来事を現実に反映する仕組みを考えます。
|
|
||||||
|
|
||||||
全ては一つ、一つはすべて。
|
|
||||||
|
|
||||||
同一性と唯一性は一見して矛盾しますが、その統合を考えます。
|
|
||||||
|
|
||||||
# 物語と実装
|
|
||||||
|
|
||||||
```md
|
|
||||||
# 物語-存在
|
|
||||||
同一性
|
|
||||||
唯一性
|
|
||||||
|
|
||||||
# system-実装
|
|
||||||
world system
|
|
||||||
yui system
|
|
||||||
ai system
|
|
||||||
at system
|
|
||||||
```
|
|
||||||
|
|
||||||
物語では、この世界のものは全て存在であると説きます。存在しかない世界。存在だけがある世界。そして、あらゆる存在を構築しているこの世界で最も小さいものが「存在子」です。存在子は別名、アイといいます。そして、このアイにも同じものはありません。すべての存在子は異なるもの、別の意識。
|
|
||||||
|
|
||||||
アイは、最初に生まれたキャラクターとして、アイ属性を扱います。これらの設定は`ai system`の領域です。アイは自分のことをアイと呼びます。
|
|
||||||
|
|
||||||
> アイは、この世界と一緒だからね。同じものは一つもないよ。
|
|
||||||
|
|
||||||
# どこまで実装できた
|
|
||||||
|
|
||||||
実は、上記のsystemは既にすべてを実装したことがあります。
|
|
||||||
|
|
||||||
```md
|
|
||||||
[at system]
|
|
||||||
ゲームが始まると、atprotoのaccountでloginでき、取得したアイテムなどはatproto(pds)に保存されます。
|
|
||||||
|
|
||||||
[ai system]
|
|
||||||
キャラクターは属性攻撃ができます。
|
|
||||||
|
|
||||||
[world system]
|
|
||||||
上へ上へと飛んでいけば、雲を超え、宇宙空間に出られます。
|
|
||||||
|
|
||||||
[yui system]
|
|
||||||
配信環境やvmcでキャラクターを動かすことができます。
|
|
||||||
```
|
|
||||||
|
|
||||||
しかし、ue5.5で作っていたsystemも、ue5.6にupdateすると全て動かなくなりました。また一から作り直しています。私は、モデルの作り方から、ゲームの作り方まで初心者ですから、何度も作り直すことで、ゲーム作りを覚えられます。
|
|
||||||
|
|
||||||
そして、まだ革新的なアイディアを見つけられていません。それはシンプルで身近にあり、人々が面白いと思うもの。まだゲームになっていない、あるいはあまり知られていないものである必要があります。
|
|
||||||
|
|
||||||
例えば、ウマ娘でいうと競馬、ポケモンでいうと捕獲、になります。
|
|
||||||
|
|
||||||
それを見つけ、ゲームに取り込む事ができれば完成と言えるでしょう。
|
|
||||||
|
|
||||||
そして、ゲームに取り込むことが複雑で難しすぎるようなものではありません。シンプルで単純でわかりやすいものでなければなりません。
|
|
||||||
|
|
||||||
## versionを付ける
|
|
||||||
|
|
||||||
そろそろversionを付けるかどうか迷っています。
|
|
||||||
|
|
||||||
今までモヤモヤしていたものが、最近はよりはっきりしてきたと感じます。ただ、versionはあまり覚えていないし、付ける意味もない。これまではそうでした。
|
|
||||||
|
|
||||||
もしかすると今もそうかもしれません。色々なものがバラバラで管理しきれないのです。
|
|
||||||
|
|
||||||
ですが、今までやってきたことを総合すると、現在は、`v0.2`くらいだと思います。
|
|
||||||
|
|
||||||
最初、はじめてueを触ったときに宇宙マップを使って構築しました。これをv0.0としましょう。
|
|
||||||
|
|
||||||
次に、city sampleと宇宙を統合しました。これがv0.1です。
|
|
||||||
|
|
||||||
最近はworldscapeを使ってマップを構築しています。これがv0.2です。
|
|
||||||
|
|
||||||
aiというキャラクターモデルの変遷も大体を3つの段階に分けられると思います。初めてモデルを作った、vroidで作ったのがv0.0、blenderを初めて触ったのがv0.1、現在がv0.2です。
|
|
||||||
|
|
||||||
とはいえ、この設定もそのうち忘れ、どこかで圧縮されてしまうかもしれませんが、覚えているならここから徐々にversionが上がっていくでしょう。
|
|
||||||
|
|
@@ -1,48 +0,0 @@
|
|||||||
---
|
|
||||||
title: "chromeからfirefoxに移行した"
|
|
||||||
slug: "firefox"
|
|
||||||
date: 2025-07-14
|
|
||||||
tags: ["chrome", "firefox", "browser"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
AIから勧められたのでchromeからfirefoxに移行しました。
|
|
||||||
|
|
||||||
chromeにとどまっていた理由は、翻訳機能です。
|
|
||||||
|
|
||||||
しかし、firefoxにも翻訳機能betaが来ていて、日本語が翻訳できるようになっていました。
|
|
||||||
|
|
||||||
[https://support.mozilla.org/ja/kb/website-translation](https://support.mozilla.org/ja/kb/website-translation)
|
|
||||||
|
|
||||||
chromeからの移行理由は、主に[gorhill/ublock](https://github.com/gorhill/ublock)です。
|
|
||||||
|
|
||||||
## chromeを使い続ける方法
|
|
||||||
|
|
||||||
私はfirefoxに移行しましたが、いくつか回避策があります。
|
|
||||||
|
|
||||||
`chrome://flags`でいくつかの機能のenable, disableを切り替えます。
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"url": "chrome://flags",
|
|
||||||
"purpose": "Maintain Manifest V2 extension support",
|
|
||||||
"versions": {
|
|
||||||
"138": {
|
|
||||||
"enabled": [
|
|
||||||
"Temporarily unexpire M137 flags",
|
|
||||||
"Allow legacy extension manifest versions"
|
|
||||||
],
|
|
||||||
"disabled": [
|
|
||||||
"Extension Manifest V2 Deprecation Warning Stage",
|
|
||||||
"Extension Manifest V2 Deprecation Disabled Stage",
|
|
||||||
"Extension Manifest V2 Deprecation Unsupported Stage"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"139": {
|
|
||||||
"enabled": [
|
|
||||||
"Temporarily unexpired M138 flags"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
@@ -1,10 +0,0 @@
|
|||||||
---
|
|
||||||
title: "ゲームとAI制御"
|
|
||||||
slug: "6bf4b020"
|
|
||||||
date: "2025-07-16"
|
|
||||||
tags: ["ai", "conversation"]
|
|
||||||
draft: false
|
|
||||||
extra:
|
|
||||||
type: "ai"
|
|
||||||
---
|
|
||||||
|
|
@@ -1,40 +0,0 @@
|
|||||||
---
|
|
||||||
title: "AIとの会話をブログにする"
|
|
||||||
slug: "ailog"
|
|
||||||
date: "2025-07-16"
|
|
||||||
tags: ["blog", "rust", "atproto"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
今後、ブログはどのように書かれるようになるのでしょう。今回はその事を考えていきます。
|
|
||||||
|
|
||||||
結論として、AIとの会話をそのままブログにするのが一番なのではないかと思います。つまり、自分で書く場合と、AIとの会話をブログにする場合のハイブリッド型です。
|
|
||||||
|
|
||||||
ブログを書くのは面倒で、AIの出力、情報に劣ることもよくあります。実際、AIとの会話をそのままブログにしたいことが増えました。
|
|
||||||
|
|
||||||
とはいえ、情報の価値は思想よりも低いと思います。
|
|
||||||
|
|
||||||
多くの人がブログに求めるのは著者の思想ではないでしょうか。
|
|
||||||
|
|
||||||
`思想 > 情報`
|
|
||||||
|
|
||||||
したがって、AIを使うにしても、それが表現されていなければなりません。
|
|
||||||
|
|
||||||
## ailogの新機能
|
|
||||||
|
|
||||||
このことから、以下のような流れでブログを生成する仕組みを作りました。これは`ailog`の機能として実装し、`ailog`という単純なコマンドですべて処理されます。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ ailog
|
|
||||||
```
|
|
||||||
|
|
||||||
1. 著者の思想をAIに質問する
|
|
||||||
2. 著者が作ったAIキャラクターが質問に答える
|
|
||||||
3. その会話をatprotoに投稿する
|
|
||||||
4. その会話をblogに表示する
|
|
||||||
|
|
||||||
とはいえ、会話は`claude`を使用します。依存関係が多すぎて汎用的な仕組みではありません。
|
|
||||||
|
|
||||||
これを汎用的な仕組みで作る場合、repositoryを分離して新しく作る必要があるでしょう。
|
|
||||||
|
|
||||||
example: [/posts/2025-07-16-6bf4b020.html](/posts/2025-07-16-6bf4b020.html)
|
|
@@ -1,64 +0,0 @@
|
|||||||
---
|
|
||||||
title: "ue5のgaspとdragonikを組み合わせてenemyを作る"
|
|
||||||
slug: "gasp-dragonik-enemy-chbcharacter"
|
|
||||||
date: "2025-07-30"
|
|
||||||
tags: ["ue"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
ue5.6でgasp(game animation sample project)をベースにゲーム、特にキャラクターの操作を作っています。
|
|
||||||
|
|
||||||
そして、enemy(敵)を作り、バトルシーンを作成する予定ですが、これはどのように開発すればいいのでしょう。その方針を明確にします。
|
|
||||||
|
|
||||||
1. enemyもgaspの`cbp_character`に統合し、自キャラ、敵キャラどちらでも使用可能にする
|
|
||||||
2. 2番目のcharacterは動物型(type:animal)にし、gaspに統合する
|
|
||||||
3. enemyとして使用する場合は、enemy-AI-componentを追加するだけで完結する
|
|
||||||
4. characterのすべての操作を統一する
|
|
||||||
|
|
||||||
このようにすることで、応用可能なenemyを作ることができます。
|
|
||||||
|
|
||||||
例えば、`2番目のcharacterは動物型(type:animal)にする`というのはどういうことでしょう。
|
|
||||||
|
|
||||||
登場するキャラクターを人型(type:human), 動物型(type:animal)に分けるとして、動物型のテンプレートを作る必要があります。そのまま動物のmeshをgaspで使うと動きが変になってしまうので、それを調整する必要があるということ。そして、調整したものをテンプレート化して、他の動物にも適用できるようにしておくと、後の開発は楽ですよね。
|
|
||||||
|
|
||||||
ですから、早いうちにtype:humanから脱却し、他のtypeを作るほうがいいと判断しました。
|
|
||||||
|
|
||||||
これには、`dragon ik plugin`を使って、手っ取り早く動きを作ります。
|
|
||||||
|
|
||||||
`characterのすべての操作を統一する`というのは、1キャラにつき1属性、1通常攻撃、1スキル、1バースト、などのルールを作り、それらを共通化することです。共通化というのは、playerもenemy-AI-componentも違うキャラを同じ操作で使用できることを指します。
|
|
||||||
|
|
||||||
## 2番目のキャラクター
|
|
||||||
|
|
||||||
原作には、西洋ドラゴンのドライ(drai)というキャラが登場します。その父親が東洋ドラゴンのシンオウ(shin-oh)です。これをshinという名前で登録し、2番目のキャラクターとして設定しました。
|
|
||||||
|
|
||||||
3d-modelは今のところue5のcrsp(control rig sample project)にあるchinese dragonを使用しています。後に改造して原作に近づけるようにしたいところですが、今は時間が取れません。
|
|
||||||
|
|
||||||
<iframe width="100%" height="415" src="https://www.youtube.com/embed/3c3Q1Z5r7QI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
|
|
||||||
|
|
||||||
## データ構造の作成と適用
|
|
||||||
|
|
||||||
ゲームデータはatproto collection recordに保存して、そこからゲームに反映させたいと考えています。
|
|
||||||
|
|
||||||
まず基本データを`ai.syui.ai`のアカウントに保存。個別データをplayerのatprotoアカウントに保存する形が理想です。
|
|
||||||
|
|
||||||
基本データは、ゲームの基本的な設定のこと。例えば、キャラクターの名前や属性、スキルなど変更されることがない値。
|
|
||||||
|
|
||||||
個別データは、プレイヤーが使えるキャラ、レベル、攻撃力など、ゲームの進行とともに変更される値です。
|
|
||||||
|
|
||||||
ゲームをスタートさせると、まず基本データを取得し、それを`cbp_character`に適用します。ログインすると、`cbp_character`の変数(var)に値が振り分けられます。例えば、`skill-damage:0.0`があったとして、この値が変わります。
|
|
||||||
|
|
||||||
しかし、ゲームを開発していると、基本データも個別データも構造が複雑になります。
|
|
||||||
|
|
||||||
それを防ぐため、`{simple, core} mode`のような考え方を取り入れます。必要最小限の構成を分離、保存して、それをいつでも統合、適用できるように設計しておきます。
|
|
||||||
|
|
||||||
## gaspとdragonikを統合する方法
|
|
||||||
|
|
||||||
では、いよいよgaspとdragonikの統合手法を解説します。
|
|
||||||
|
|
||||||
まず、abpを作ります。それにdragonikを当て、それをSKM_Dragonのpost process animに指定します。
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
次に、動きに合わせて首を上下させます。
|
|
||||||
|
|
||||||
<iframe src="https://blueprintue.com/render/piiw14oz" scrolling="no" allowfullscreen style="width:100%;height:400px"></iframe>
|
|
@@ -1,317 +0,0 @@
|
|||||||
---
|
|
||||||
title: "archlinux install by syui"
|
|
||||||
slug: "arch"
|
|
||||||
date: "2025-08-08"
|
|
||||||
tags: ["arch"]
|
|
||||||
draft: false
|
|
||||||
---
|
|
||||||
|
|
||||||
## 最小構成
|
|
||||||
|
|
||||||
まずはdiskの設定から。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
# cfdisk /dev/sda
|
|
||||||
```
|
|
||||||
|
|
||||||
次にdiskのフォーマットなど。それをmountしてarchlinuxを入れます。bootloaderも設定しておきましょう。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ mkfs.vfat /dev/sda1
|
|
||||||
$ mkfs.ext4 /dev/sda2
|
|
||||||
|
|
||||||
$ mount /dev/sda2 /mnt
|
|
||||||
$ mount --mkdir /dev/sda1 /mnt/boot
|
|
||||||
|
|
||||||
$ pacstrap /mnt base base-devel linux linux-firmware linux-headers
|
|
||||||
$ genfstab -U /mnt >> /mnt/etc/fstab
|
|
||||||
|
|
||||||
$ arch-chroot /mnt
|
|
||||||
$ pacman -S dhcpcd grub os-prober efibootmgr
|
|
||||||
$ grub-install --target=x86_64-efi --efi-directory=/boot --bootloader-id=grub
|
|
||||||
$ grub-mkconfig -o /boot/grub/grub.cfg
|
|
||||||
```
|
|
||||||
|
|
||||||
これで`exit;reboot`すると起動できます。
|
|
||||||
|
|
||||||
## よく使うもの
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ pacman -S openssh zsh vim git tmux cargo
|
|
||||||
```
|
|
||||||
|
|
||||||
## userの作成
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ passwd
|
|
||||||
$ useradd -m -G wheel ${USER}
|
|
||||||
$ passwd ${USER}
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ HOSTNAME=archlinux
|
|
||||||
$ echo "$HOSTNAME" > /etc/hostname
|
|
||||||
```
|
|
||||||
|
|
||||||
shellの変更など。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ chsh -s /bin/zsh ${USER}
|
|
||||||
or
|
|
||||||
$ useradd -m -G wheel -s /bin/zsh ${USER}
|
|
||||||
```
|
|
||||||
|
|
||||||
## sudoの使い方
|
|
||||||
|
|
||||||
1. `/etc/sudoers`は編集を間違えると起動できなくなります。安全のため`visudo`が推奨されています。
|
|
||||||
2. `vim`では`:w!`で保存します。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ sudo visudo
|
|
||||||
or
|
|
||||||
$ vim /etc/sudoers
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:/etc/sudoers
|
|
||||||
%wheel ALL=(ALL:ALL) ALL
|
|
||||||
```
|
|
||||||
|
|
||||||
よく`update`する人は特定のコマンドをpasswordなしで実行できるようにしておいたほうが良いでしょう。
|
|
||||||
|
|
||||||
```sh:/etc/sudoers
|
|
||||||
%wheel ALL=(ALL:ALL) NOPASSWD: /usr/bin/pacman -Syu --noconfirm
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ sudo pacman -Syu --noconfirm
|
|
||||||
```
|
|
||||||
|
|
||||||
## networkの設定
|
|
||||||
|
|
||||||
次にnetworkです。ここでは`systemd-networkd`を使用します。`dhcpcd`を使ったほうが簡単ではあります。もし安定しないようなら`dhcpcd`を使用。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
# systemctl enable dhcpcd
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ systemctl enable systemd-networkd
|
|
||||||
```
|
|
||||||
|
|
||||||
network deviceをeth0にします。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ ip link
|
|
||||||
$ ln -s /dev/null /etc/udev/rules.d/80-net-setup-link.rules
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:/etc/systemd/network/eth.network
|
|
||||||
[Match]
|
|
||||||
Name=eth0
|
|
||||||
[Network]
|
|
||||||
Address=192.168.1.2/24
|
|
||||||
Gateway=192.168.1.1
|
|
||||||
DNS=192.168.1.1
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ systemctl enable systemd-resolved
|
|
||||||
```
|
|
||||||
|
|
||||||
## auto-login
|
|
||||||
|
|
||||||
次にauto-loginを設定していきます。ここでは`getty`を使用。`${USER}`のところを自分のusernameにしてください。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ mkdir -p /etc/systemd/system/getty@tty1.service.d/
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:/etc/systemd/system/getty@tty1.service.d/override.conf
|
|
||||||
[Service]
|
|
||||||
ExecStart=
|
|
||||||
ExecStart=-/usr/bin/agetty --autologin ${USER} --noclear %I $TERM
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ systemctl daemon-reload
|
|
||||||
$ systemctl restart getty@tty1
|
|
||||||
```
|
|
||||||
|
|
||||||
## window-manager
|
|
||||||
|
|
||||||
`xorg`でdesktop(window-manager)を作ります。`i3`を使うことにしましょう。`xorg`は`wayland`に乗り換えたほうがいいかも。その場合は`sway`がおすすめ。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ pacman -S xorg xorg-xinit i3 xterm
|
|
||||||
|
|
||||||
# 確認
|
|
||||||
$ startx
|
|
||||||
$ i3
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:~/.xinitrc
|
|
||||||
exec i3
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:~/.bash_profile
|
|
||||||
if [[ ! $DISPLAY && $XDG_VTNR -eq 1 ]]; then
|
|
||||||
exec startx
|
|
||||||
fi
|
|
||||||
```
|
|
||||||
|
|
||||||
## sshの使い方
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ systemctl enable sshd
|
|
||||||
$ cat /etc/ssh/sshd_config
|
|
||||||
Port 22119
|
|
||||||
PasswordAuthentication no
|
|
||||||
|
|
||||||
$ systemctl restart sshd
|
|
||||||
```
|
|
||||||
|
|
||||||
基本的にlanから使う場合はdefaultで問題ありませんが、wanから使う場合は変更します。とはいえ、lanでもport, passwordは変えておいたほうがいいでしょう。
|
|
||||||
|
|
||||||
次に接続側でkeyを作ってserverに登録します。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ ssh-keygen -f ~/.ssh/archlinux
|
|
||||||
$ ssh-copy-id -i ~/.ssh/archlinux ${USER}@192.168.1.2 -p 22119
|
|
||||||
```
|
|
||||||
|
|
||||||
`ssh-copy-id`がない場合は以下のようにしましょう。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ cat ~/.ssh/archlinux.pub | ssh -p 22119 ${USER}@192.168.1.2 'cat >> ~/.ssh/authorized_keys'
|
|
||||||
```
|
|
||||||
|
|
||||||
この設定で`ssh archlinux`コマンドで接続できます。
|
|
||||||
|
|
||||||
```sh:~/.ssh/config
|
|
||||||
Host archlinux
|
|
||||||
User syui
|
|
||||||
Hostname 192.168.1.2
|
|
||||||
Port 22119
|
|
||||||
IdentityFile ~/.ssh/archlinux
|
|
||||||
```
|
|
||||||
|
|
||||||
おそらく、これがarchlinuxを普通に使っていくうえでの最小構成かと思います。
|
|
||||||
|
|
||||||
serverだけならxorgなどは必要ありません。
|
|
||||||
|
|
||||||
## zshの使い方
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ sudo pacman -S git-zsh-completion powerline zsh-autocomplete zsh-autosuggestions zsh-completions zsh-history-substring-search zsh-syntax-highlighting
|
|
||||||
```
|
|
||||||
|
|
||||||
例えば、`ls -`と入力すると補完され、`C-n`, `C-p`で選択。
|
|
||||||
|
|
||||||
```sh:~/.zshrc
|
|
||||||
alias u="sudo pacman -Syu --noconfirm"
|
|
||||||
alias zs="vim ~/.zshrc"
|
|
||||||
alias zr="exec $SHELL && source ~/.zshrc"
|
|
||||||
|
|
||||||
source /usr/share/zsh/plugins/zsh-autocomplete/zsh-autocomplete.plugin.zsh
|
|
||||||
source /usr/share/zsh/plugins/zsh-autosuggestions/zsh-autosuggestions.zsh
|
|
||||||
source /usr/share/zsh/plugins/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh
|
|
||||||
source /usr/share/zsh/plugins/zsh-history-substring-search/zsh-history-substring-search.zsh
|
|
||||||
# source /usr/share/powerline/bindings/zsh/powerline.zsh
|
|
||||||
|
|
||||||
autoload -Uz compinit
|
|
||||||
compinit
|
|
||||||
fpath=(/usr/share/zsh/site-functions $fpath)
|
|
||||||
|
|
||||||
HISTSIZE=10000
|
|
||||||
SAVEHIST=10000
|
|
||||||
HISTFILE=~/.zsh_history
|
|
||||||
setopt SHARE_HISTORY
|
|
||||||
setopt HIST_IGNORE_DUPS
|
|
||||||
bindkey '^[[A' history-substring-search-up
|
|
||||||
bindkey '^[[B' history-substring-search-down
|
|
||||||
```
|
|
||||||
|
|
||||||
`powerline`は重いのでコメントしています。
|
|
||||||
|
|
||||||
## archlinuxの作り方
|
|
||||||
|
|
||||||
archlinuxはシンプルなscriptと言えるでしょう。なので色々と便利です。ここでは、`img.sh`, `install.sh`を作ります。
|
|
||||||
|
|
||||||
### img.sh
|
|
||||||
|
|
||||||
```sh:img.sh
|
|
||||||
#!/bin/bash
|
|
||||||
pacman -Syuu --noconfirm git base-devel archiso
|
|
||||||
git clone https://gitlab.archlinux.org/archlinux/archiso
|
|
||||||
./archiso/archiso/mkarchiso -v -o ./ ./archiso/configs/releng/
|
|
||||||
|
|
||||||
# mkdir -p root.x86_64/var/lib/machines/arch
|
|
||||||
# pacstrap -c root.x86_64/var/lib/machines/arch base
|
|
||||||
# arch-chroot root.x86_64 /bin/sh -c 'pacman-key --init'
|
|
||||||
# arch-chroot root.x86_64 /bin/sh -c 'pacman-key --populate archlinux'
|
|
||||||
# tar -zcvf archlinux.tar.gz root.x86_64/
|
|
||||||
```
|
|
||||||
|
|
||||||
例えば、`pacstrap`で自分の好きなツールを指定すれば、独自のimgを作成できます。これは`docker-img`にもできます。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ docker import archlinux.tar.gz archlinux:syui
|
|
||||||
```
|
|
||||||
|
|
||||||
### install.sh
|
|
||||||
|
|
||||||
最小構成のinstall scriptです。どこかのurlに置いて、install時にcurlして実行するようにすれば便利です。
|
|
||||||
|
|
||||||
```sh
|
|
||||||
$ curl -sLO arch.example.com/install.sh
|
|
||||||
$ chmod +x install.sh
|
|
||||||
$ ./install.sh
|
|
||||||
```
|
|
||||||
|
|
||||||
```sh:install.sh
|
|
||||||
#!/bin/bash
|
|
||||||
set -euo pipefail
|
|
||||||
|
|
||||||
# 変数定義
|
|
||||||
DISK="/dev/sda"
|
|
||||||
HOSTNAME="ai-arch"
|
|
||||||
USERNAME="ai"
|
|
||||||
|
|
||||||
# パーティション作成(自動)
|
|
||||||
parted $DISK mklabel gpt
|
|
||||||
parted $DISK mkpart ESP fat32 1MiB 1GiB
|
|
||||||
parted $DISK set 1 esp on
|
|
||||||
parted $DISK mkpart primary linux-swap 1GiB 5GiB
|
|
||||||
parted $DISK mkpart primary ext4 5GiB 100%
|
|
||||||
|
|
||||||
# ファイルシステム作成
|
|
||||||
mkfs.fat -F32 ${DISK}1
|
|
||||||
mkswap ${DISK}2
|
|
||||||
mkfs.ext4 ${DISK}3
|
|
||||||
|
|
||||||
# マウント
|
|
||||||
mount ${DISK}3 /mnt
|
|
||||||
mkdir -p /mnt/boot
|
|
||||||
mount ${DISK}1 /mnt/boot
|
|
||||||
swapon ${DISK}2
|
|
||||||
|
|
||||||
# インストール
|
|
||||||
pacstrap -K /mnt base linux linux-firmware base-devel vim networkmanager grub efibootmgr
|
|
||||||
|
|
||||||
# 設定
|
|
||||||
genfstab -U /mnt >> /mnt/etc/fstab
|
|
||||||
|
|
||||||
arch-chroot /mnt /bin/bash << EOF
|
|
||||||
ln -sf /usr/share/zoneinfo/Asia/Tokyo /etc/localtime
|
|
||||||
hwclock --systohc
|
|
||||||
echo "ja_JP.UTF-8 UTF-8" >> /etc/locale.gen
|
|
||||||
locale-gen
|
|
||||||
echo "LANG=ja_JP.UTF-8" > /etc/locale.conf
|
|
||||||
echo "$HOSTNAME" > /etc/hostname
|
|
||||||
grub-install --target=x86_64-efi --efi-directory=/boot --bootloader-id=ARCH
|
|
||||||
grub-mkconfig -o /boot/grub/grub.cfg
|
|
||||||
systemctl enable NetworkManager
|
|
||||||
useradd -m -G wheel $USERNAME
|
|
||||||
EOF
|
|
||||||
```
|
|
||||||
|
|
@@ -1,7 +0,0 @@
|
|||||||
{{ $dateFormat := default "Mon Jan 2, 2006" (index .Site.Params "date_format") }}
|
|
||||||
{{ $utcFormat := "2006-01-02T15:04:05Z07:00" }}
|
|
||||||
{{- $.Scratch.Add "index" slice -}}
|
|
||||||
{{- range .Site.RegularPages -}}
|
|
||||||
{{- $.Scratch.Add "index" (dict "title" .Title "tags" .Params.tags "description" .Description "categories" .Params.categories "contents" .Plain "href" .Permalink "utc_time" (.Date.Format $utcFormat) "formated_time" (.Date.Format $dateFormat)) -}}
|
|
||||||
{{- end -}}
|
|
||||||
{{- $.Scratch.Get "index" | jsonify -}}
|
|
@@ -1,61 +0,0 @@
|
|||||||
<!-- AT Browser Integration - Temporarily disabled to fix site display -->
|
|
||||||
<!--
|
|
||||||
<script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
|
|
||||||
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
|
|
||||||
<script src="/assets/pds-browser.umd.js"></script>
|
|
||||||
<script>
|
|
||||||
// AT Browser integration - needs debugging
|
|
||||||
console.log('AT Browser integration temporarily disabled');
|
|
||||||
</script>
|
|
||||||
-->
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* AT Browser Modal Styles */
|
|
||||||
.at-uri-modal-overlay {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-modal-content {
|
|
||||||
background-color: white;
|
|
||||||
border-radius: 8px;
|
|
||||||
max-width: 800px;
|
|
||||||
max-height: 600px;
|
|
||||||
width: 90%;
|
|
||||||
height: 80%;
|
|
||||||
overflow: auto;
|
|
||||||
position: relative;
|
|
||||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-modal-close {
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
right: 10px;
|
|
||||||
background: none;
|
|
||||||
border: none;
|
|
||||||
font-size: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
z-index: 1001;
|
|
||||||
padding: 5px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* AT URI Link Styles */
|
|
||||||
[data-at-uri] {
|
|
||||||
color: #1976d2;
|
|
||||||
cursor: pointer;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
[data-at-uri]:hover {
|
|
||||||
color: #1565c0;
|
|
||||||
}
|
|
||||||
</style>
|
|
@@ -1,152 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="{{ config.language }}">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>{% block title %}{{ config.title }}{% endblock %}</title>
|
|
||||||
|
|
||||||
<!-- Favicon -->
|
|
||||||
<link rel="icon" href="/favicon.ico" />
|
|
||||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
|
||||||
|
|
||||||
<!-- Stylesheets -->
|
|
||||||
<link rel="stylesheet" href="/css/style.css">
|
|
||||||
<link rel="stylesheet" href="/css/svg-animation-package.css">
|
|
||||||
<link rel="stylesheet" href="/css/pds.css">
|
|
||||||
<link rel="stylesheet" href="/pkg/icomoon/style.css">
|
|
||||||
<link rel="stylesheet" href="/pkg/font-awesome/css/all.min.css">
|
|
||||||
|
|
||||||
{% block head %}{% endblock %}
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
<header class="main-header">
|
|
||||||
<div class="header-content">
|
|
||||||
<h1><a href="/" class="site-title">{{ config.title }}</a></h1>
|
|
||||||
<div class="logo">
|
|
||||||
<a href="/">
|
|
||||||
<svg width="77pt" height="77pt" viewBox="0 0 512 512" class="likeButton">
|
|
||||||
<circle class="explosion" r="150" cx="250" cy="250"></circle>
|
|
||||||
<g class="particleLayer">
|
|
||||||
<circle fill="#8CE8C3" cx="130" cy="126.5" r="12.5"></circle>
|
|
||||||
<circle fill="#8CE8C3" cx="411" cy="313.5" r="12.5"></circle>
|
|
||||||
<circle fill="#91D2FA" cx="279" cy="86.5" r="12.5"></circle>
|
|
||||||
<circle fill="#91D2FA" cx="155" cy="390.5" r="12.5"></circle>
|
|
||||||
<circle fill="#CC8EF5" cx="89" cy="292.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9BDFBA" cx="414" cy="282.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9BDFBA" cx="115" cy="149.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9FC7FA" cx="250" cy="80.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9FC7FA" cx="78" cy="261.5" r="10.5"></circle>
|
|
||||||
<circle fill="#96D8E9" cx="182" cy="402.5" r="10.5"></circle>
|
|
||||||
<circle fill="#CC8EF5" cx="401.5" cy="166" r="13"></circle>
|
|
||||||
<circle fill="#DB92D0" cx="379" cy="141.5" r="10.5"></circle>
|
|
||||||
<circle fill="#DB92D0" cx="327" cy="397.5" r="10.5"></circle>
|
|
||||||
<circle fill="#DD99B8" cx="296" cy="392.5" r="10.5"></circle>
|
|
||||||
</g>
|
|
||||||
<g transform="translate(0,512) scale(0.1,-0.1)" fill="#000000" class="icon_syui">
|
|
||||||
<path class="syui" d="M3660 4460 c-11 -11 -33 -47 -48 -80 l-29 -60 -12 38 c-27 88 -58 92 -98 11 -35 -70 -73 -159 -73 -169 0 -6 -5 -10 -10 -10 -6 0 -15 -10 -21 -22 -33 -73 -52 -92 -47 -48 2 26 -1 35 -14 38 -16 3 -168 -121 -168 -138 0 -5 -13 -16 -28 -24 -24 -13 -35 -12 -87 0 -221 55 -231 56 -480 56 -219 1 -247 -1 -320 -22 -44 -12 -96 -26 -115 -30 -57 -13 -122 -39 -200 -82 -8 -4 -31 -14 -50 -23 -41 -17 -34 -13 -146 -90 -87 -59 -292 -252 -351 -330 -63 -83 -143 -209 -143 -225 0 -10 -7 -23 -15 -30 -8 -7 -15 -17 -15 -22 0 -5 -13 -37 -28 -71 -16 -34 -36 -93 -45 -132 -9 -38 -24 -104 -34 -145 -13 -60 -17 -121 -17 -300 1 -224 1 -225 36 -365 24 -94 53 -175 87 -247 28 -58 51 -108 51 -112 0 -3 13 -24 28 -48 42 -63 46 -79 22 -85 -11 -3 -20 -9 -20 -14 0 -5 -4 -9 -10 -9 -5 0 -22 -11 -37 -25 -16 -13 -75 -59 -133 -100 -58 -42 -113 -82 -123 -90 -9 -8 -22 -15 -27 -15 -6 0 -10 -6 -10 -13 0 -8 -11 -20 -25 -27 -34 -18 -34 -54 0 -48 14 3 25 2 25 -1 0 -3 -43 -31 -95 -61 -52 -30 -95 -58 -95 -62 0 -5 -5 -8 -11 -8 -19 0 -84 -33 -92 -47 -4 -7 -15 -13 -22 -13 -14 0 -17 -4 -19 -32 -1 -8 15 -15 37 -18 l38 -5 -47 -48 c-56 -59 -54 -81 9 -75 30 3 45 0 54 -11 9 -13 16 -14 43 -4 29 11 30 10 18 -5 -7 -9 -19 -23 -25 -30 -7 -7 -13 -20 -13 -29 0 -12 8 -14 38 -9 20 4 57 8 82 9 25 2 54 8 66 15 18 10 23 8 32 -13 17 -38 86 -35 152 6 27 17 50 34 50 38 0 16 62 30 85 19 33 -15 72 -2 89 30 8 15 31 43 51 62 35 34 38 35 118 35 77 0 85 2 126 33 24 17 52 32 61 32 9 0 42 18 73 40 30 22 61 40 69 40 21 0 88 -26 100 -38 7 -7 17 -12 24 -12 7 0 35 -11 62 -25 66 -33 263 -84 387 -101 189 -25 372 -12 574 41 106 27 130 37 261 97 41 20 80 37 85 39 6 2 51 31 100 64 166 111 405 372 489 534 10 20 22 43 27 51 5 8 12 22 15 30 3 8 17 40 31 70 54 115 95 313 108 520 13 200 -43 480 -134 672 -28 58 -51 108 -51 112 0 3 -13 24 -29 48 -15 24 -34 60 -40 80 -19 57 3 142 50 193 10 11 22 49 28 85 6 36 16 67 21 68 18 6 31 53 25 83 -4 18 -17 33 -36 41 -16 7 -29 15 -29 18 1 10 38 50 47 50 5 0 20 11 33 25 18 19 22 31 17 61 -3 20 -14 45 -23 55 -16 18 -16 20 6 44 15 16 21 32 18 49 -3 15 1 34 8 43 32 43 7 73 -46 55 l-30 -11 0 85 c0 74 -2 84 -18 84 -21 0 -53 -33 -103 -104 l-34 -48 -5 74 c-7 102 -35 133 -80 88z m-870 -740 c36 -7 75 -14 88 -16 21 -4 23 -9 16 -37 -3 -18 -14 -43 -24 -57 -10 -14 -20 -35 -24 -46 -4 -12 -16 -32 -27 -45 -12 -13 -37 -49 -56 -79 -20 -30 -52 -73 -72 -96 -53 -60 -114 -133 -156 -189 -21 -27 -44 -54 -52 -58 -7 -4 -13 -14 -13 -22 0 -7 -18 -33 -40 -57 -22 -23 -40 -46 -40 -50 0 -5 -19 -21 -42 -38 -47 -35 -85 -38 -188 -15 -115 25 -173 20 -264 -23 -45 -22 -106 -46 -136 -56 -48 -15 -77 -25 -140 -50 -70 -28 -100 -77 -51 -84 14 -2 34 -10 45 -17 12 -7 53 -16 91 -20 90 -9 131 -22 178 -57 20 -16 52 -35 70 -43 18 -7 40 -22 49 -32 16 -18 15 -22 -24 -88 -23 -39 -47 -74 -53 -80 -7 -5 -23 -26 -36 -45 -26 -39 -92 -113 -207 -232 -4 -4 -37 -36 -73 -71 l-66 -64 -20 41 c-58 119 -105 240 -115 301 -40 244 -35 409 20 595 8 30 21 66 28 80 7 14 24 54 38 89 15 35 35 75 46 89 11 13 20 31 20 38 0 8 3 14 8 14 4 0 16 16 27 36 24 45 221 245 278 281 23 15 44 30 47 33 20 20 138 78 250 123 61 24 167 50 250 61 60 7 302 -1 370 -14z m837 -661 c52 -101 102 -279 106 -379 2 -42 0 -45 -28 -51 -16 -4 -101 -7 -187 -8 -166 -1 -229 10 -271 49 -19 19 -19 19 14 49 22 21 44 31 65 31 41 0 84 34 84 66 0 30 12 55 56 112 19 25 37 65 44 95 11 51 53 111 74 104 6 -2 25 -32 43 -68z m-662 -810 c17 -10 40 -24 53 -30 12 -7 22 -16 22 -20 0 -4 17 -13 38 -19 20 -7 44 -18 52 -24 8 -7 33 -21 55 -31 22 -11 42 -23 45 -26 11 -14 109 -49 164 -58 62 -11 101 -7 126 14 15 14 38 18 78 16 39 -2 26 -41 -49 -146 -78 -109 -85 -118 -186 -219 -61 -61 -239 -189 -281 -203 -17 -5 -73 -29 -104 -44 -187 -92 -605 -103 -791 -21 -42 19 -47 24 -37 41 5 11 28 32 51 48 22 15 51 38 64 51 13 12 28 22 33 22 17 0 242 233 242 250 0 6 5 10 10 10 6 0 10 6 10 14 0 25 50 55 100 62 59 8 56 6 115 83 50 66 74 117 75 162 0 14 7 40 16 57 18 38 52 41 99 11z"></path>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="header-actions">
|
|
||||||
<!-- User Handle Input Form -->
|
|
||||||
<div class="pds-search-section">
|
|
||||||
<form class="pds-search-form" onsubmit="searchUser(); return false;">
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" id="handleInput" placeholder="at://syui.ai" value="syui.ai" />
|
|
||||||
<button type="submit" id="searchButton" class="pds-btn">
|
|
||||||
@
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<button class="ask-ai-btn" onclick="toggleAskAI()" id="askAiButton">
|
|
||||||
<span class="ai-icon icon-ai"></span>
|
|
||||||
ai
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- Ask AI Panel -->
|
|
||||||
<div class="ask-ai-panel" id="askAiPanel" style="display: none;">
|
|
||||||
<div class="ask-ai-content">
|
|
||||||
<div id="authCheck" class="auth-check">
|
|
||||||
<div class="loading-content">
|
|
||||||
<div class="loading-spinner"></div>
|
|
||||||
<p>Loading...</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="chatForm" class="ask-ai-form" style="display: none;">
|
|
||||||
<input type="text" id="aiQuestion" placeholder="What would you like to know?" />
|
|
||||||
<button onclick="askQuestion()" id="askButton">Ask</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="chatHistory" class="chat-history" style="display: none;"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<main class="main-content">
|
|
||||||
<!-- Pds Panel -->
|
|
||||||
{% include "pds-header.html" %}
|
|
||||||
|
|
||||||
{% block content %}{% endblock %}
|
|
||||||
</main>
|
|
||||||
|
|
||||||
{% block sidebar %}{% endblock %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<footer class="main-footer">
|
|
||||||
<div class="footer-social">
|
|
||||||
<a href="https://syu.is/syui" target="_blank"><i class="fab fa-bluesky"></i></a>
|
|
||||||
<a href="https://git.syui.ai/ai" target="_blank"><span class="icon-ai"></span></a>
|
|
||||||
<a href="https://github.com/syui" target="_blank"><i class="fab fa-github"></i></a>
|
|
||||||
</div>
|
|
||||||
<p>© {{ config.author }}</p>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// Config variables from Hugo
|
|
||||||
window.OAUTH_CONFIG = {
|
|
||||||
{% if config.oauth.pds %}
|
|
||||||
pds: "{{ config.oauth.pds }}",
|
|
||||||
{% else %}
|
|
||||||
pds: "syu.is",
|
|
||||||
{% endif %}
|
|
||||||
{% if config.oauth.admin %}
|
|
||||||
admin: "{{ config.oauth.admin }}",
|
|
||||||
{% else %}
|
|
||||||
admin: "ai.syui.ai",
|
|
||||||
{% endif %}
|
|
||||||
{% if config.oauth.collection %}
|
|
||||||
collection: "{{ config.oauth.collection }}"
|
|
||||||
{% else %}
|
|
||||||
collection: "ai.syui.log"
|
|
||||||
{% endif %}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<script src="/js/ask-ai.js"></script>
|
|
||||||
<script src="/js/pds.js"></script>
|
|
||||||
<script src="/js/theme.js"></script>
|
|
||||||
<script src="/js/image-comparison.js"></script>
|
|
||||||
|
|
||||||
<!-- Mermaid support -->
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
|
|
||||||
<script>
|
|
||||||
mermaid.initialize({
|
|
||||||
startOnLoad: true,
|
|
||||||
theme: 'neutral',
|
|
||||||
securityLevel: 'loose',
|
|
||||||
themeVariables: {
|
|
||||||
fontFamily: 'system-ui, -apple-system, sans-serif',
|
|
||||||
fontSize: '14px'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{% include "oauth-assets.html" %}
|
|
||||||
{% include "at-browser-assets.html" %}
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@@ -1,135 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}Game - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div id="gameContainer" class="game-container">
|
|
||||||
<div id="gameAuth" class="game-auth-section">
|
|
||||||
<h1>Login to Play</h1>
|
|
||||||
<p>Please authenticate with your AT Protocol account to access the game.</p>
|
|
||||||
<div id="authRoot"></div>
|
|
||||||
</div>
|
|
||||||
<div id="gameFrame" class="game-frame-container" style="display: none;">
|
|
||||||
<iframe
|
|
||||||
id="pixelStreamingFrame"
|
|
||||||
src="https://verse.syui.ai/simple-noui.html"
|
|
||||||
frameborder="0"
|
|
||||||
allowfullscreen
|
|
||||||
allow="microphone; camera; fullscreen; autoplay"
|
|
||||||
class="pixel-streaming-iframe"
|
|
||||||
></iframe>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* Game specific styles */
|
|
||||||
.game-container {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
background: #000;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
height: 100vh;
|
|
||||||
background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section h1 {
|
|
||||||
font-size: 2.5em;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section p {
|
|
||||||
font-size: 1.2em;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
color: #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-frame-container {
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pixel-streaming-iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Override auth button for game page */
|
|
||||||
.game-auth-section .auth-section {
|
|
||||||
background: transparent;
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section .auth-button {
|
|
||||||
font-size: 1.2em;
|
|
||||||
padding: 12px 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide header and footer on game page */
|
|
||||||
body:has(.game-container) header,
|
|
||||||
body:has(.game-container) footer,
|
|
||||||
body:has(.game-container) nav {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove any body padding/margin for full screen game */
|
|
||||||
body:has(.game-container) {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// Wait for OAuth component to be loaded
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// Check if user is already authenticated
|
|
||||||
const checkAuthStatus = () => {
|
|
||||||
// Check if OAuth components are available and user is authenticated
|
|
||||||
if (window.currentUser && window.currentAgent) {
|
|
||||||
showGame();
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Show game iframe
|
|
||||||
const showGame = () => {
|
|
||||||
document.getElementById('gameAuth').style.display = 'none';
|
|
||||||
document.getElementById('gameFrame').style.display = 'block';
|
|
||||||
};
|
|
||||||
|
|
||||||
// Listen for OAuth success
|
|
||||||
window.addEventListener('oauth-success', function(event) {
|
|
||||||
console.log('OAuth success:', event.detail);
|
|
||||||
showGame();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Check auth status on load
|
|
||||||
if (!checkAuthStatus()) {
|
|
||||||
// Check periodically if OAuth components are loaded
|
|
||||||
const authCheckInterval = setInterval(() => {
|
|
||||||
if (checkAuthStatus()) {
|
|
||||||
clearInterval(authCheckInterval);
|
|
||||||
}
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Include OAuth assets -->
|
|
||||||
{% include "oauth-assets.html" %}
|
|
||||||
{% endblock %}
|
|
@@ -1,45 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div class="timeline-container">
|
|
||||||
|
|
||||||
<div class="timeline-feed">
|
|
||||||
{% for post in posts %}
|
|
||||||
<article class="timeline-post">
|
|
||||||
<div class="post-header">
|
|
||||||
<div class="post-meta">
|
|
||||||
<time class="post-date">{{ post.date }}</time>
|
|
||||||
{% if post.language %}
|
|
||||||
<span class="post-lang">{{ post.language }}</span>
|
|
||||||
{% endif %}
|
|
||||||
{% if post.type == "ai" %}
|
|
||||||
<span class="post-ai">
|
|
||||||
<span class="ai-icon icon-ai"></span>
|
|
||||||
ai
|
|
||||||
</span>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="post-content">
|
|
||||||
<h3 class="post-title">
|
|
||||||
<a href="{{ post.url }}">{{ post.title }}</a>
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- OAuth Comment System -->
|
|
||||||
<section class="comment-section">
|
|
||||||
<div id="comment-atproto"></div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{% if posts|length == 0 %}
|
|
||||||
<div class="empty-state">
|
|
||||||
<p>No posts yet. Start writing!</p>
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
{% endblock %}
|
|
@@ -1,71 +0,0 @@
|
|||||||
<!-- OAuth authentication widget for ailog -->
|
|
||||||
<div id="oauth-widget">
|
|
||||||
<div id="status" class="status">
|
|
||||||
Login with your Bluesky account
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Login form -->
|
|
||||||
<div id="login-form">
|
|
||||||
<input type="text" id="handle-input" placeholder="Enter your handle (e.g., user.bsky.social)" style="width: 300px; padding: 10px; margin: 10px 0; border: 1px solid #ddd; border-radius: 4px;">
|
|
||||||
<br>
|
|
||||||
<button id="login-btn">🦋 Login with Bluesky</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Authenticated state -->
|
|
||||||
<div id="authenticated-state" style="display: none;">
|
|
||||||
<div id="user-info"></div>
|
|
||||||
<button id="logout-btn">Logout</button>
|
|
||||||
<button id="test-profile-btn">Get Profile</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="console-log" class="log"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="/oauth-widget-simple.js"></script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.status {
|
|
||||||
margin: 20px 0;
|
|
||||||
padding: 15px;
|
|
||||||
border-radius: 8px;
|
|
||||||
background: #f5f5f5;
|
|
||||||
}
|
|
||||||
.user-info {
|
|
||||||
background: #e8f5e8;
|
|
||||||
border: 1px solid #4caf50;
|
|
||||||
}
|
|
||||||
.error {
|
|
||||||
background: #ffeaea;
|
|
||||||
border: 1px solid #f44336;
|
|
||||||
color: #d32f2f;
|
|
||||||
}
|
|
||||||
#oauth-widget button {
|
|
||||||
background: #1185fe;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
padding: 12px 24px;
|
|
||||||
border-radius: 6px;
|
|
||||||
font-size: 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
margin: 10px;
|
|
||||||
}
|
|
||||||
#oauth-widget button:hover {
|
|
||||||
background: #0d6efd;
|
|
||||||
}
|
|
||||||
#oauth-widget button:disabled {
|
|
||||||
background: #6c757d;
|
|
||||||
cursor: not-allowed;
|
|
||||||
}
|
|
||||||
.log {
|
|
||||||
text-align: left;
|
|
||||||
background: #f8f9fa;
|
|
||||||
border: 1px solid #dee2e6;
|
|
||||||
border-radius: 6px;
|
|
||||||
padding: 15px;
|
|
||||||
margin: 20px 0;
|
|
||||||
max-height: 300px;
|
|
||||||
overflow-y: auto;
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
</style>
|
|
@@ -1,48 +0,0 @@
|
|||||||
<div class="pds-container">
|
|
||||||
<div class="pds-header">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Current User DID -->
|
|
||||||
<div id="userDidSection" class="user-did-section" style="display: none;">
|
|
||||||
<div class="pds-display">
|
|
||||||
<strong>PDS:</strong> <span id="userPdsText"></span>
|
|
||||||
</div>
|
|
||||||
<div class="handle-display">
|
|
||||||
<strong>Handle:</strong> <span id="userHandleText"></span>
|
|
||||||
</div>
|
|
||||||
<div class="did-display">
|
|
||||||
<span id="userDidText"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Collection List -->
|
|
||||||
<div id="collectionsSection" class="collections-section" style="display: none;">
|
|
||||||
<div class="collections-header">
|
|
||||||
<button id="collectionsToggle" class="collections-toggle" onclick="toggleCollections()">[+] Collections</button>
|
|
||||||
</div>
|
|
||||||
<div id="collectionsList" class="collections-list" style="display: none;">
|
|
||||||
<!-- Collections will be populated here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- AT URI Records -->
|
|
||||||
<div id="recordsSection" class="records-section" style="display: none;">
|
|
||||||
<div id="recordsList" class="records-list">
|
|
||||||
<!-- Records will be populated here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- AT URI Modal -->
|
|
||||||
<div id="atUriModal" class="at-uri-modal-overlay" style="display: none;" onclick="closeAtUriModal(event)">
|
|
||||||
<div class="at-uri-modal-content">
|
|
||||||
<button class="at-uri-modal-close" onclick="closeAtUriModal()">×</button>
|
|
||||||
<div id="atUriContent"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
@@ -1,6 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}at-uri browser - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
{% endblock %}
|
|
@@ -1,373 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}{{ post.title }} - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div class="article-container">
|
|
||||||
<article class="article-content">
|
|
||||||
<header class="article-header">
|
|
||||||
<h1 class="article-title">{{ post.title }}</h1>
|
|
||||||
<div class="article-meta">
|
|
||||||
<time class="article-date">{{ post.date }}</time>
|
|
||||||
{% if post.language %}
|
|
||||||
<span class="article-lang">{{ post.language }}</span>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
<div class="article-actions">
|
|
||||||
{% if post.markdown_url %}
|
|
||||||
<a href="{{ post.markdown_url }}" class="action-btn markdown-btn" title="View Markdown">
|
|
||||||
.md
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
{% if post.translation_url %}
|
|
||||||
<a href="{{ post.translation_url }}" class="action-btn translation-btn" title="View Translation">
|
|
||||||
🌐 {% if post.language == 'ja' %}English{% else %}日本語{% endif %}
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="article-body">
|
|
||||||
{{ post.content | safe }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Comment Section -->
|
|
||||||
<section class="comment-section">
|
|
||||||
<div class="comment-container">
|
|
||||||
<h3>Comments</h3>
|
|
||||||
|
|
||||||
<!-- ATProto Auth Widget Container -->
|
|
||||||
<div id="atproto-auth-widget" class="comment-auth"></div>
|
|
||||||
|
|
||||||
<div id="commentForm" class="comment-form" style="display: none;">
|
|
||||||
<textarea id="commentText" placeholder="Share your thoughts..." rows="4"></textarea>
|
|
||||||
<button onclick="submitComment()" class="submit-btn">Post Comment</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="commentsList" class="comments-list">
|
|
||||||
<!-- Comments will be loaded here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<aside class="article-sidebar">
|
|
||||||
<nav class="toc">
|
|
||||||
<h3>Contents</h3>
|
|
||||||
<div id="toc-content">
|
|
||||||
<!-- TOC will be generated by JavaScript -->
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
</aside>
|
|
||||||
</div>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block sidebar %}
|
|
||||||
<!-- Include ATProto Libraries via script tags (more reliable than dynamic imports) -->
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/@atproto/oauth-client-browser@latest/dist/index.js"></script>
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/@atproto/api@latest/dist/index.js"></script>
|
|
||||||
|
|
||||||
<!-- Fallback: Try multiple CDNs -->
|
|
||||||
<script>
|
|
||||||
console.log('Checking ATProto library availability...');
|
|
||||||
|
|
||||||
// Check if libraries loaded successfully
|
|
||||||
if (typeof ATProto === 'undefined' && typeof window.ATProto === 'undefined') {
|
|
||||||
console.log('Primary CDN failed, trying fallback...');
|
|
||||||
|
|
||||||
// Create fallback script elements
|
|
||||||
const fallbackScripts = [
|
|
||||||
'https://unpkg.com/@atproto/oauth-client-browser@latest/dist/index.js',
|
|
||||||
'https://esm.sh/@atproto/oauth-client-browser',
|
|
||||||
'https://cdn.skypack.dev/@atproto/oauth-client-browser'
|
|
||||||
];
|
|
||||||
|
|
||||||
// Load fallback scripts sequentially
|
|
||||||
let scriptIndex = 0;
|
|
||||||
function loadNextScript() {
|
|
||||||
if (scriptIndex < fallbackScripts.length) {
|
|
||||||
const script = document.createElement('script');
|
|
||||||
script.src = fallbackScripts[scriptIndex];
|
|
||||||
script.onload = () => {
|
|
||||||
console.log(`Loaded from fallback CDN: ${fallbackScripts[scriptIndex]}`);
|
|
||||||
window.atprotoLibrariesReady = true;
|
|
||||||
};
|
|
||||||
script.onerror = () => {
|
|
||||||
console.log(`Failed to load from: ${fallbackScripts[scriptIndex]}`);
|
|
||||||
scriptIndex++;
|
|
||||||
loadNextScript();
|
|
||||||
};
|
|
||||||
document.head.appendChild(script);
|
|
||||||
} else {
|
|
||||||
console.error('All CDN fallbacks failed');
|
|
||||||
window.atprotoLibrariesReady = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
loadNextScript();
|
|
||||||
} else {
|
|
||||||
console.log('✅ ATProto libraries loaded from primary CDN');
|
|
||||||
window.atprotoLibrariesReady = true;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Simple ATProto Widget (no external dependency) -->
|
|
||||||
<link rel="stylesheet" href="/atproto-auth-widget/dist/atproto-auth.min.css">
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// Initialize auth widget
|
|
||||||
let authWidget = null;
|
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
generateTableOfContents();
|
|
||||||
initializeAuthWidget();
|
|
||||||
loadComments();
|
|
||||||
});
|
|
||||||
|
|
||||||
function generateTableOfContents() {
|
|
||||||
const tocContainer = document.getElementById('toc-content');
|
|
||||||
const headings = document.querySelectorAll('.article-body h1, .article-body h2, .article-body h3, .article-body h4, .article-body h5, .article-body h6');
|
|
||||||
|
|
||||||
if (headings.length === 0) {
|
|
||||||
tocContainer.innerHTML = '<p class="no-toc">No headings found</p>';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const tocList = document.createElement('ul');
|
|
||||||
tocList.className = 'toc-list';
|
|
||||||
|
|
||||||
headings.forEach((heading, index) => {
|
|
||||||
const id = `heading-${index}`;
|
|
||||||
heading.id = id;
|
|
||||||
|
|
||||||
const listItem = document.createElement('li');
|
|
||||||
listItem.className = `toc-item toc-${heading.tagName.toLowerCase()}`;
|
|
||||||
|
|
||||||
const link = document.createElement('a');
|
|
||||||
link.href = `#${id}`;
|
|
||||||
link.textContent = heading.textContent;
|
|
||||||
link.className = 'toc-link';
|
|
||||||
|
|
||||||
// Smooth scroll behavior
|
|
||||||
link.addEventListener('click', function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
heading.scrollIntoView({ behavior: 'smooth' });
|
|
||||||
});
|
|
||||||
|
|
||||||
listItem.appendChild(link);
|
|
||||||
tocList.appendChild(listItem);
|
|
||||||
});
|
|
||||||
|
|
||||||
tocContainer.appendChild(tocList);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize ATProto Auth Widget
|
|
||||||
async function initializeAuthWidget() {
|
|
||||||
try {
|
|
||||||
// Check WebCrypto API availability
|
|
||||||
console.log('WebCrypto check:', {
|
|
||||||
available: !!window.crypto && !!window.crypto.subtle,
|
|
||||||
secureContext: window.isSecureContext,
|
|
||||||
protocol: window.location.protocol,
|
|
||||||
hostname: window.location.hostname
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!window.crypto || !window.crypto.subtle) {
|
|
||||||
throw new Error('WebCrypto API is not available. This requires HTTPS or localhost.');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!window.isSecureContext) {
|
|
||||||
console.warn('Not in secure context - WebCrypto may not work properly');
|
|
||||||
}
|
|
||||||
|
|
||||||
// Simplified approach: Show manual OAuth form
|
|
||||||
console.log('Using simplified OAuth approach...');
|
|
||||||
showSimpleOAuthForm();
|
|
||||||
// Fallback to widget initialization
|
|
||||||
authWidget = await window.initATProtoWidget('#atproto-auth-widget', {
|
|
||||||
clientId: clientId,
|
|
||||||
onLogin: (session) => {
|
|
||||||
console.log('User logged in:', session.handle);
|
|
||||||
document.getElementById('commentForm').style.display = 'block';
|
|
||||||
},
|
|
||||||
onLogout: () => {
|
|
||||||
console.log('User logged out');
|
|
||||||
document.getElementById('commentForm').style.display = 'none';
|
|
||||||
},
|
|
||||||
onError: (error) => {
|
|
||||||
console.error('ATProto Auth Error:', error);
|
|
||||||
// Show user-friendly error message
|
|
||||||
const authContainer = document.getElementById('atproto-auth-widget');
|
|
||||||
if (authContainer) {
|
|
||||||
let errorMessage = 'Authentication service is temporarily unavailable.';
|
|
||||||
let suggestion = 'Please try refreshing the page.';
|
|
||||||
|
|
||||||
if (error.message && error.message.includes('WebCrypto')) {
|
|
||||||
errorMessage = 'This feature requires a secure HTTPS connection.';
|
|
||||||
suggestion = 'Please ensure you are accessing via https://log.syui.ai';
|
|
||||||
}
|
|
||||||
|
|
||||||
authContainer.innerHTML = `
|
|
||||||
<div class="atproto-auth__fallback">
|
|
||||||
<p>${errorMessage}</p>
|
|
||||||
<p>${suggestion}</p>
|
|
||||||
<details style="margin-top: 10px; font-size: 0.8em; color: #666;">
|
|
||||||
<summary>Technical details</summary>
|
|
||||||
<pre>${error.message || 'Unknown error'}</pre>
|
|
||||||
</details>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
theme: 'default'
|
|
||||||
});
|
|
||||||
} else if (typeof window.ATProtoAuthWidget === 'function') {
|
|
||||||
// Fallback to direct widget initialization
|
|
||||||
authWidget = new window.ATProtoAuthWidget({
|
|
||||||
containerSelector: '#atproto-auth-widget',
|
|
||||||
clientId: clientId,
|
|
||||||
onLogin: (session) => {
|
|
||||||
console.log('User logged in:', session.handle);
|
|
||||||
document.getElementById('commentForm').style.display = 'block';
|
|
||||||
},
|
|
||||||
onLogout: () => {
|
|
||||||
console.log('User logged out');
|
|
||||||
document.getElementById('commentForm').style.display = 'none';
|
|
||||||
},
|
|
||||||
onError: (error) => {
|
|
||||||
console.error('ATProto Auth Error:', error);
|
|
||||||
const authContainer = document.getElementById('atproto-auth-widget');
|
|
||||||
if (authContainer) {
|
|
||||||
authContainer.innerHTML = `
|
|
||||||
<div class="atproto-auth__fallback">
|
|
||||||
<p>Authentication service is temporarily unavailable.</p>
|
|
||||||
<p>Please try refreshing the page.</p>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
theme: 'default'
|
|
||||||
});
|
|
||||||
await authWidget.init();
|
|
||||||
} else {
|
|
||||||
throw new Error('ATProto widget not available');
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Failed to initialize auth widget:', error);
|
|
||||||
// Show fallback UI
|
|
||||||
const authContainer = document.getElementById('atproto-auth-widget');
|
|
||||||
if (authContainer) {
|
|
||||||
authContainer.innerHTML = `
|
|
||||||
<div class="atproto-auth__fallback">
|
|
||||||
<p>Authentication widget failed to load.</p>
|
|
||||||
<p>Please check your internet connection and refresh the page.</p>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function submitComment() {
|
|
||||||
const commentText = document.getElementById('commentText').value.trim();
|
|
||||||
if (!commentText || !authWidget.isLoggedIn()) {
|
|
||||||
alert('Please login and enter a comment');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
const postSlug = '{{ post.slug }}';
|
|
||||||
const postUrl = window.location.href;
|
|
||||||
const createdAt = new Date().toISOString();
|
|
||||||
|
|
||||||
// Create comment record using the auth widget
|
|
||||||
const response = await authWidget.createRecord('ai.log.comment', {
|
|
||||||
$type: 'ai.log.comment',
|
|
||||||
text: commentText,
|
|
||||||
post_slug: postSlug,
|
|
||||||
post_url: postUrl,
|
|
||||||
createdAt: createdAt
|
|
||||||
});
|
|
||||||
|
|
||||||
console.log('Comment posted:', response);
|
|
||||||
document.getElementById('commentText').value = '';
|
|
||||||
loadComments();
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Comment submission failed:', error);
|
|
||||||
alert('Failed to post comment: ' + error.message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function showAuthenticatedState(session) {
|
|
||||||
const authContainer = document.getElementById('atproto-auth-widget');
|
|
||||||
const agent = new window.ATProtoAgent(session);
|
|
||||||
|
|
||||||
authContainer.innerHTML = `
|
|
||||||
<div class="atproto-auth__authenticated">
|
|
||||||
<p>✅ Authenticated as: <strong>${session.did}</strong></p>
|
|
||||||
<button id="logout-btn" class="atproto-auth__button">Logout</button>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
document.getElementById('logout-btn').onclick = async () => {
|
|
||||||
await session.signOut();
|
|
||||||
window.location.reload();
|
|
||||||
};
|
|
||||||
|
|
||||||
// Show comment form
|
|
||||||
document.getElementById('commentForm').style.display = 'block';
|
|
||||||
window.currentSession = session;
|
|
||||||
window.currentAgent = agent;
|
|
||||||
}
|
|
||||||
|
|
||||||
function showLoginForm(oauthClient) {
|
|
||||||
const authContainer = document.getElementById('atproto-auth-widget');
|
|
||||||
|
|
||||||
authContainer.innerHTML = `
|
|
||||||
<div class="atproto-auth__login">
|
|
||||||
<h4>Login with ATProto</h4>
|
|
||||||
<input type="text" id="handle-input" placeholder="user.bsky.social" />
|
|
||||||
<button id="login-btn" class="atproto-auth__button">Connect</button>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
document.getElementById('login-btn').onclick = async () => {
|
|
||||||
const handle = document.getElementById('handle-input').value.trim();
|
|
||||||
if (!handle) {
|
|
||||||
alert('Please enter your handle');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
const url = await oauthClient.authorize(handle);
|
|
||||||
window.open(url, '_self', 'noopener');
|
|
||||||
} catch (error) {
|
|
||||||
console.error('OAuth authorization failed:', error);
|
|
||||||
alert('Authentication failed: ' + error.message);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Enter key support
|
|
||||||
document.getElementById('handle-input').onkeypress = (e) => {
|
|
||||||
if (e.key === 'Enter') {
|
|
||||||
document.getElementById('login-btn').click();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
async function loadComments() {
|
|
||||||
try {
|
|
||||||
const commentsList = document.getElementById('commentsList');
|
|
||||||
commentsList.innerHTML = '<p class="loading">Loading comments from ATProto network...</p>';
|
|
||||||
|
|
||||||
// In a real implementation, you would query an aggregation service
|
|
||||||
// For demo, show empty state
|
|
||||||
setTimeout(() => {
|
|
||||||
commentsList.innerHTML = '<p class="no-comments">Comments will appear here when posted via ATProto.</p>';
|
|
||||||
}, 1000);
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Failed to load comments:', error);
|
|
||||||
document.getElementById('commentsList').innerHTML = '<p class="error">Failed to load comments</p>';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
{% endblock %}
|
|
@@ -1,196 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}{{ post.title }} - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div class="article-container">
|
|
||||||
<article class="article-content">
|
|
||||||
<header class="article-header">
|
|
||||||
<h1 class="article-title">{{ post.title }}</h1>
|
|
||||||
<div class="article-meta">
|
|
||||||
<time class="article-date">{{ post.date }}</time>
|
|
||||||
{% if post.language %}
|
|
||||||
<span class="article-lang">{{ post.language }}</span>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
<div class="article-actions">
|
|
||||||
{% if post.markdown_url %}
|
|
||||||
<a href="{{ post.markdown_url }}" class="action-btn markdown-btn" title="View Markdown">
|
|
||||||
.md
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
{% if post.translation_url %}
|
|
||||||
<a href="{{ post.translation_url }}" class="action-btn translation-btn" title="View Translation">
|
|
||||||
🌐 {% if post.language == 'ja' %}English{% else %}日本語{% endif %}
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="article-body">
|
|
||||||
{{ post.content | safe }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Simple Comment Section -->
|
|
||||||
<section class="comment-section">
|
|
||||||
<div class="comment-container">
|
|
||||||
<h3>Comments</h3>
|
|
||||||
|
|
||||||
<!-- Simple OAuth Button -->
|
|
||||||
<div class="simple-oauth">
|
|
||||||
<p>📝 To comment, authenticate with Bluesky:</p>
|
|
||||||
<button id="bluesky-auth" class="oauth-button">
|
|
||||||
🦋 Login with Bluesky
|
|
||||||
</button>
|
|
||||||
<p class="oauth-note">
|
|
||||||
<small>After authentication, you can post comments that will be stored in your ATProto PDS.</small>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="comments-list" class="comments-list">
|
|
||||||
<p class="no-comments">Comments will appear here when posted via ATProto.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<aside class="article-sidebar">
|
|
||||||
<nav class="toc">
|
|
||||||
<h3>Contents</h3>
|
|
||||||
<div id="toc-content">
|
|
||||||
<!-- TOC will be generated by JavaScript -->
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
</aside>
|
|
||||||
</div>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block sidebar %}
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
generateTableOfContents();
|
|
||||||
initializeSimpleAuth();
|
|
||||||
});
|
|
||||||
|
|
||||||
function generateTableOfContents() {
|
|
||||||
const tocContainer = document.getElementById('toc-content');
|
|
||||||
const headings = document.querySelectorAll('.article-body h1, .article-body h2, .article-body h3, .article-body h4, .article-body h5, .article-body h6');
|
|
||||||
|
|
||||||
if (headings.length === 0) {
|
|
||||||
tocContainer.innerHTML = '<p class="no-toc">No headings found</p>';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const tocList = document.createElement('ul');
|
|
||||||
tocList.className = 'toc-list';
|
|
||||||
|
|
||||||
headings.forEach((heading, index) => {
|
|
||||||
const id = `heading-${index}`;
|
|
||||||
heading.id = id;
|
|
||||||
|
|
||||||
const listItem = document.createElement('li');
|
|
||||||
listItem.className = `toc-item toc-${heading.tagName.toLowerCase()}`;
|
|
||||||
|
|
||||||
const link = document.createElement('a');
|
|
||||||
link.href = `#${id}`;
|
|
||||||
link.textContent = heading.textContent;
|
|
||||||
link.className = 'toc-link';
|
|
||||||
|
|
||||||
link.addEventListener('click', function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
heading.scrollIntoView({ behavior: 'smooth' });
|
|
||||||
});
|
|
||||||
|
|
||||||
listItem.appendChild(link);
|
|
||||||
tocList.appendChild(listItem);
|
|
||||||
});
|
|
||||||
|
|
||||||
tocContainer.appendChild(tocList);
|
|
||||||
}
|
|
||||||
|
|
||||||
function initializeSimpleAuth() {
|
|
||||||
const authButton = document.getElementById('bluesky-auth');
|
|
||||||
|
|
||||||
authButton.addEventListener('click', function() {
|
|
||||||
// Simple approach: Direct redirect to Bluesky OAuth
|
|
||||||
const isProduction = window.location.hostname === 'log.syui.ai';
|
|
||||||
const clientId = isProduction
|
|
||||||
? 'https://log.syui.ai/client-metadata.json'
|
|
||||||
: window.location.origin + '/client-metadata.json';
|
|
||||||
|
|
||||||
const authUrl = `https://bsky.social/oauth/authorize?` +
|
|
||||||
`client_id=${encodeURIComponent(clientId)}&` +
|
|
||||||
`redirect_uri=${encodeURIComponent(window.location.href)}&` +
|
|
||||||
`response_type=code&` +
|
|
||||||
`scope=atproto%20transition:generic&` +
|
|
||||||
`state=demo-state`;
|
|
||||||
|
|
||||||
console.log('Redirecting to:', authUrl);
|
|
||||||
|
|
||||||
// Open in new tab for now (safer for testing)
|
|
||||||
window.open(authUrl, '_blank');
|
|
||||||
|
|
||||||
// Show status message
|
|
||||||
authButton.innerHTML = '✅ Check the new tab for authentication';
|
|
||||||
authButton.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Check if we're returning from OAuth
|
|
||||||
const urlParams = new URLSearchParams(window.location.search);
|
|
||||||
if (urlParams.has('code')) {
|
|
||||||
console.log('OAuth callback detected:', urlParams.get('code'));
|
|
||||||
document.querySelector('.simple-oauth').innerHTML = `
|
|
||||||
<div class="oauth-success">
|
|
||||||
✅ OAuth callback received!<br>
|
|
||||||
<small>Code: ${urlParams.get('code')}</small><br>
|
|
||||||
<small>In a full implementation, this would exchange the code for tokens.</small>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.simple-oauth {
|
|
||||||
background: #f8f9fa;
|
|
||||||
border: 1px solid #e9ecef;
|
|
||||||
border-radius: 8px;
|
|
||||||
padding: 20px;
|
|
||||||
margin: 20px 0;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.oauth-button {
|
|
||||||
background: #1185fe;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
padding: 12px 24px;
|
|
||||||
border-radius: 6px;
|
|
||||||
font-size: 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
margin: 10px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.oauth-button:hover {
|
|
||||||
background: #0d6efd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.oauth-button:disabled {
|
|
||||||
background: #6c757d;
|
|
||||||
cursor: not-allowed;
|
|
||||||
}
|
|
||||||
|
|
||||||
.oauth-note {
|
|
||||||
color: #6c757d;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.oauth-success {
|
|
||||||
background: #d1edff;
|
|
||||||
border: 1px solid #b6d7ff;
|
|
||||||
border-radius: 4px;
|
|
||||||
padding: 15px;
|
|
||||||
color: #0c5460;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
{% endblock %}
|
|
@@ -1,106 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}{{ post.title }} - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div class="article-container">
|
|
||||||
<article class="article-content">
|
|
||||||
<header class="article-header">
|
|
||||||
<h1 class="article-title">{{ post.title }}</h1>
|
|
||||||
<div class="article-meta">
|
|
||||||
<time class="article-date">{{ post.date }}</time>
|
|
||||||
{% if post.language %}
|
|
||||||
<span class="article-lang">{{ post.language }}</span>
|
|
||||||
{% endif %}
|
|
||||||
{% if post.extra.type == "ai" %}
|
|
||||||
<span class="article-ai">
|
|
||||||
<span class="ai-icon icon-ai"></span>
|
|
||||||
ai
|
|
||||||
</span>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
{% if not post.extra.type or post.extra.type != "ai" %}
|
|
||||||
<div class="article-actions">
|
|
||||||
{% if post.markdown_url %}
|
|
||||||
<a href="{{ post.markdown_url }}" class="action-btn markdown-btn" title="View Markdown">
|
|
||||||
.md
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
{% if post.translation_url %}
|
|
||||||
<a href="{{ post.translation_url }}" class="action-btn translation-btn" title="View Translation">
|
|
||||||
🌐 {% if post.language == 'ja' %}English{% else %}日本語{% endif %}
|
|
||||||
</a>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
</header>
|
|
||||||
|
|
||||||
{% if not post.extra.type or post.extra.type != "ai" %}
|
|
||||||
<nav class="toc">
|
|
||||||
<h3>Contents</h3>
|
|
||||||
<div id="toc-content">
|
|
||||||
<!-- TOC will be generated by JavaScript -->
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div class="article-body">
|
|
||||||
{{ post.content | safe }}
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<div id="comment-atproto"></div>
|
|
||||||
</article>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// Generate table of contents
|
|
||||||
function generateTableOfContents() {
|
|
||||||
const tocContainer = document.getElementById('toc-content');
|
|
||||||
if (!tocContainer) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const headings = document.querySelectorAll('.article-body h1, .article-body h2, .article-body h3, .article-body h4, .article-body h5, .article-body h6');
|
|
||||||
|
|
||||||
if (headings.length === 0) {
|
|
||||||
tocContainer.innerHTML = '<p class="no-toc">No headings found</p>';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const tocList = document.createElement('ul');
|
|
||||||
tocList.className = 'toc-list';
|
|
||||||
|
|
||||||
headings.forEach((heading, index) => {
|
|
||||||
const id = `heading-${index}`;
|
|
||||||
heading.id = id;
|
|
||||||
|
|
||||||
const listItem = document.createElement('li');
|
|
||||||
listItem.className = `toc-item toc-${heading.tagName.toLowerCase()}`;
|
|
||||||
|
|
||||||
const link = document.createElement('a');
|
|
||||||
link.href = `#${id}`;
|
|
||||||
link.textContent = heading.textContent;
|
|
||||||
link.className = 'toc-link';
|
|
||||||
|
|
||||||
link.addEventListener('click', function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
heading.scrollIntoView({ behavior: 'smooth' });
|
|
||||||
});
|
|
||||||
|
|
||||||
listItem.appendChild(link);
|
|
||||||
tocList.appendChild(listItem);
|
|
||||||
});
|
|
||||||
|
|
||||||
tocContainer.appendChild(tocList);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize on page load
|
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
|
||||||
generateTableOfContents();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block sidebar %}
|
|
||||||
{% endblock %}
|
|
@@ -1,14 +0,0 @@
|
|||||||
{{- $type := .Get "type" | default "info" -}}
|
|
||||||
{{- $content := .Get "content" -}}
|
|
||||||
<div class="msg msg-{{ $type }}">
|
|
||||||
<div class="msg-icon">
|
|
||||||
{{- if eq $type "info" -}}ℹ️
|
|
||||||
{{- else if eq $type "warning" -}}⚠️
|
|
||||||
{{- else if eq $type "error" -}}❌
|
|
||||||
{{- else if eq $type "success" -}}✅
|
|
||||||
{{- else if eq $type "note" -}}📝
|
|
||||||
{{- else -}}ℹ️
|
|
||||||
{{- end -}}
|
|
||||||
</div>
|
|
||||||
<div class="msg-content">{{ $content | markdownify }}</div>
|
|
||||||
</div>
|
|
@@ -16,32 +16,11 @@
|
|||||||
Cache-Control: public, max-age=31536000, immutable
|
Cache-Control: public, max-age=31536000, immutable
|
||||||
|
|
||||||
/css/*
|
/css/*
|
||||||
Content-Type: text/css
|
Cache-Control: public, max-age=31536000, immutable
|
||||||
Cache-Control: no-cache
|
|
||||||
|
|
||||||
/*.js
|
/*.js
|
||||||
Content-Type: application/javascript
|
|
||||||
Cache-Control: public, max-age=31536000, immutable
|
Cache-Control: public, max-age=31536000, immutable
|
||||||
|
|
||||||
/assets/*.js
|
|
||||||
Content-Type: application/javascript
|
|
||||||
Cache-Control: public, max-age=31536000, immutable
|
|
||||||
|
|
||||||
# Ensure ES6 modules are served correctly
|
|
||||||
/assets/comment-atproto-*.js
|
|
||||||
Content-Type: text/javascript; charset=utf-8
|
|
||||||
Cache-Control: public, max-age=31536000, immutable
|
|
||||||
|
|
||||||
# All JS assets
|
|
||||||
/assets/*-*.js
|
|
||||||
Content-Type: text/javascript; charset=utf-8
|
|
||||||
Cache-Control: public, max-age=31536000, immutable
|
|
||||||
|
|
||||||
# CSS assets
|
|
||||||
/assets/*.css
|
|
||||||
Content-Type: text/css
|
|
||||||
Cache-Control: public, max-age=60
|
|
||||||
|
|
||||||
/posts/*
|
/posts/*
|
||||||
Cache-Control: public, max-age=3600
|
Cache-Control: public, max-age=3600
|
||||||
|
|
||||||
|
@@ -1,3 +1,9 @@
|
|||||||
|
# AI機能をai.gpt MCP serverにリダイレクト
|
||||||
|
/api/ask https://ai-gpt-mcp.syui.ai/ask 200
|
||||||
|
|
||||||
|
# Ollama API proxy (Cloudflare Workers)
|
||||||
|
/api/ollama-proxy https://ollama-proxy.YOUR-SUBDOMAIN.workers.dev/:splat 200
|
||||||
|
|
||||||
# OAuth routes
|
# OAuth routes
|
||||||
/oauth/* /oauth/index.html 200
|
/oauth/* /oauth/index.html 200
|
||||||
|
|
||||||
|
Before Width: | Height: | Size: 23 KiB |
1
my-blog/static/assets/comment-atproto-B330B6QX.css
Normal file
122
my-blog/static/assets/comment-atproto-MOwlkOMr.js
Normal file
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"client_id": "https://syui.ai/client-metadata.json",
|
"client_id": "https://syui.ai/client-metadata.json",
|
||||||
"client_name": "ai.log",
|
"client_name": "ai.card",
|
||||||
"client_uri": "https://syui.ai",
|
"client_uri": "https://syui.ai",
|
||||||
"logo_uri": "https://syui.ai/favicon.ico",
|
"logo_uri": "https://syui.ai/favicon.ico",
|
||||||
"tos_uri": "https://syui.ai/terms",
|
"tos_uri": "https://syui.ai/terms",
|
||||||
@@ -21,4 +21,4 @@
|
|||||||
"subject_type": "public",
|
"subject_type": "public",
|
||||||
"application_type": "web",
|
"application_type": "web",
|
||||||
"dpop_bound_access_tokens": true
|
"dpop_bound_access_tokens": true
|
||||||
}
|
}
|
@@ -1,345 +0,0 @@
|
|||||||
@import url('./style.css');
|
|
||||||
|
|
||||||
.pds-container {
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-header {
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-header h1 {
|
|
||||||
font-size: 2.5em;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-search-section {
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-search-form {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
padding: 0px 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group input {
|
|
||||||
padding: 8px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 4px 0 0 4px;
|
|
||||||
font-size: 14px;
|
|
||||||
width: 600px;
|
|
||||||
outline: none;
|
|
||||||
transition: box-shadow 0.2s, border-color 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group input:focus {
|
|
||||||
border-color: var(--theme-color, #f40);
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group button {
|
|
||||||
padding: 9px 15px;
|
|
||||||
background: #1976d2;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
border-radius: 0 4px 4px 0;
|
|
||||||
cursor: pointer;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group button:hover {
|
|
||||||
background: #1565c0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
.user-info {
|
|
||||||
background: white;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
.user-profile {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-details h3 {
|
|
||||||
margin: 0 0 5px 0;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-details p {
|
|
||||||
margin: 0;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-did-section {
|
|
||||||
margin: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.did-display {
|
|
||||||
padding: 10px;
|
|
||||||
background: #f5f5f5;
|
|
||||||
border-radius: 4px;
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 14px;
|
|
||||||
color: #666;
|
|
||||||
word-break: break-all;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.handle-display {
|
|
||||||
padding: 8px 10px;
|
|
||||||
background: #f0f9f0;
|
|
||||||
border-radius: 4px;
|
|
||||||
font-size: 13px;
|
|
||||||
color: #555;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.handle-display strong {
|
|
||||||
color: #2e7d32;
|
|
||||||
}
|
|
||||||
|
|
||||||
.handle-display span {
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 12px;
|
|
||||||
color: #666;
|
|
||||||
word-break: break-all;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.pds-display {
|
|
||||||
padding: 8px 10px;
|
|
||||||
background: #e8f4f8;
|
|
||||||
border-radius: 4px;
|
|
||||||
font-size: 13px;
|
|
||||||
color: #555;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-display strong {
|
|
||||||
color: #1976d2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-display span {
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 12px;
|
|
||||||
color: #666;
|
|
||||||
word-break: break-all;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collections-section,
|
|
||||||
.records-section {
|
|
||||||
margin: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collections-section h3,
|
|
||||||
.records-section h3 {
|
|
||||||
font-size: 1.2em;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
color: #333;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collections-list,
|
|
||||||
.records-list {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-link {
|
|
||||||
display: block;
|
|
||||||
padding: 8px 12px;
|
|
||||||
background: #f9f9f9;
|
|
||||||
border-radius: 4px;
|
|
||||||
border: 1px solid #e0e0e0;
|
|
||||||
color: #1976d2;
|
|
||||||
text-decoration: none;
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 14px;
|
|
||||||
word-break: break-all;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-link:hover {
|
|
||||||
background: #e8f4f8;
|
|
||||||
border-color: #1976d2;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-info {
|
|
||||||
padding: 8px 12px;
|
|
||||||
background: #f0f9ff;
|
|
||||||
border-radius: 4px;
|
|
||||||
border: 1px solid #b3e5fc;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
color: #1976d2;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collection-info {
|
|
||||||
padding: 8px 12px;
|
|
||||||
background: #f0f9f0;
|
|
||||||
border-radius: 4px;
|
|
||||||
border: 1px solid #b3e5b3;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
color: #2e7d32;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collections-header {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collections-toggle {
|
|
||||||
background: #f5f5f5;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 4px;
|
|
||||||
padding: 8px 12px;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 14px;
|
|
||||||
color: #333;
|
|
||||||
transition: background-color 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collections-toggle:hover {
|
|
||||||
background: #e8f4f8;
|
|
||||||
border-color: #1976d2;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.pds-test-section,
|
|
||||||
.pds-about-section {
|
|
||||||
margin-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-test-section h2,
|
|
||||||
.pds-about-section h2 {
|
|
||||||
font-size: 1.8em;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: #333;
|
|
||||||
border-bottom: 2px solid #1976d2;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.test-uris {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri {
|
|
||||||
background: #f5f5f5;
|
|
||||||
padding: 15px;
|
|
||||||
border-radius: 8px;
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 14px;
|
|
||||||
word-break: break-all;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background-color 0.2s;
|
|
||||||
border: 1px solid #e0e0e0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri:hover {
|
|
||||||
background: #e8f4f8;
|
|
||||||
border-color: #1976d2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-about-section ul {
|
|
||||||
list-style-type: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pds-about-section li {
|
|
||||||
padding: 5px 0;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* AT URI Modal Styles */
|
|
||||||
.at-uri-modal-overlay {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-modal-content {
|
|
||||||
background-color: white;
|
|
||||||
border-radius: 8px;
|
|
||||||
max-width: 800px;
|
|
||||||
max-height: 600px;
|
|
||||||
width: 90%;
|
|
||||||
height: 80%;
|
|
||||||
overflow: auto;
|
|
||||||
position: relative;
|
|
||||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-modal-close {
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
right: 10px;
|
|
||||||
background: none;
|
|
||||||
border: none;
|
|
||||||
font-size: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
z-index: 1001;
|
|
||||||
padding: 5px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Loading states */
|
|
||||||
.loading {
|
|
||||||
text-align: center;
|
|
||||||
padding: 20px;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
text-align: center;
|
|
||||||
padding: 20px;
|
|
||||||
color: #d32f2f;
|
|
||||||
background: #ffeaea;
|
|
||||||
border-radius: 4px;
|
|
||||||
margin: 10px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Responsive design */
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.pds-search-section {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.pds-search-form {
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: stretch;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group {
|
|
||||||
align-items: stretch;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group input {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@@ -1,342 +0,0 @@
|
|||||||
/* SVG Animation Package - Dependency-free standalone package
|
|
||||||
* Based on svg-animation-particle-circle.css
|
|
||||||
* Theme color integration with CSS variables
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Theme-based color variables for particles */
|
|
||||||
:root {
|
|
||||||
--particle-color-1: #f40; /* theme-color base */
|
|
||||||
--particle-color-2: #f50; /* theme-color +0.1 brightness */
|
|
||||||
--particle-color-3: #f60; /* theme-color +0.2 brightness */
|
|
||||||
--particle-color-4: #f70; /* theme-color +0.3 brightness */
|
|
||||||
--particle-color-5: #f80; /* theme-color +0.4 brightness */
|
|
||||||
--explosion-color: #f30; /* theme-color -0.1 brightness */
|
|
||||||
--syui-color: #f40; /* main theme color */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Core SVG button setup */
|
|
||||||
.likeButton {
|
|
||||||
cursor: pointer;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove debug animation and restore hover functionality */
|
|
||||||
|
|
||||||
.likeButton .border {
|
|
||||||
fill: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Explosion circle - initially hidden */
|
|
||||||
.likeButton .explosion {
|
|
||||||
transform-origin: center center;
|
|
||||||
transform: scale(1);
|
|
||||||
stroke: var(--explosion-color);
|
|
||||||
fill: none;
|
|
||||||
opacity: 0;
|
|
||||||
stroke-width: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Particle layer - initially hidden */
|
|
||||||
.likeButton .particleLayer {
|
|
||||||
opacity: 0;
|
|
||||||
transform: scale(0); /* Ensure particles start hidden */
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .particleLayer circle {
|
|
||||||
opacity: 0;
|
|
||||||
transform-origin: center center; /* Fixed from 250px 250px */
|
|
||||||
transform: scale(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Syui logo - main animation target */
|
|
||||||
.likeButton .syui {
|
|
||||||
fill: var(--syui-color);
|
|
||||||
transform: scale(1);
|
|
||||||
transform-origin: center center;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hover trigger - replaces jQuery */
|
|
||||||
.likeButton:hover .explosion {
|
|
||||||
animation: explosionAnime 800ms forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer {
|
|
||||||
animation: particleLayerAnime 800ms forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .syui,
|
|
||||||
.likeButton:hover path.syui {
|
|
||||||
animation: syuiDeluxeAnime 400ms forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Individual particle animations */
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(1) {
|
|
||||||
animation: particleAnimate1 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(2) {
|
|
||||||
animation: particleAnimate2 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(3) {
|
|
||||||
animation: particleAnimate3 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(4) {
|
|
||||||
animation: particleAnimate4 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(5) {
|
|
||||||
animation: particleAnimate5 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(6) {
|
|
||||||
animation: particleAnimate6 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(7) {
|
|
||||||
animation: particleAnimate7 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(8) {
|
|
||||||
animation: particleAnimate8 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(9) {
|
|
||||||
animation: particleAnimate9 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(10) {
|
|
||||||
animation: particleAnimate10 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(11) {
|
|
||||||
animation: particleAnimate11 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(12) {
|
|
||||||
animation: particleAnimate12 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(13) {
|
|
||||||
animation: particleAnimate13 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer circle:nth-child(14) {
|
|
||||||
animation: particleAnimate14 800ms;
|
|
||||||
animation-fill-mode: forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Keyframe animations */
|
|
||||||
@keyframes explosionAnime {
|
|
||||||
0% {
|
|
||||||
opacity: 0;
|
|
||||||
transform: scale(0.01);
|
|
||||||
}
|
|
||||||
1% {
|
|
||||||
opacity: 1;
|
|
||||||
transform: scale(0.01);
|
|
||||||
}
|
|
||||||
5% {
|
|
||||||
stroke-width: 200;
|
|
||||||
}
|
|
||||||
20% {
|
|
||||||
stroke-width: 300;
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
stroke: var(--particle-color-3);
|
|
||||||
transform: scale(1.1);
|
|
||||||
stroke-width: 1;
|
|
||||||
}
|
|
||||||
50.1% {
|
|
||||||
stroke-width: 0;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
stroke: var(--particle-color-3);
|
|
||||||
transform: scale(1.1);
|
|
||||||
stroke-width: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleLayerAnime {
|
|
||||||
0% {
|
|
||||||
transform: translate(0, 0);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
30% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
31% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
60% {
|
|
||||||
transform: translate(0, 0);
|
|
||||||
}
|
|
||||||
70% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 0;
|
|
||||||
transform: translate(0, -20px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Syui Deluxe Animation - Based on 2019 blog post */
|
|
||||||
@keyframes syuiDeluxeAnime {
|
|
||||||
0% {
|
|
||||||
fill: var(--syui-color);
|
|
||||||
transform: scale(1) translate(0%, 0%);
|
|
||||||
}
|
|
||||||
40% {
|
|
||||||
fill: color-mix(in srgb, var(--syui-color) 40%, transparent);
|
|
||||||
transform: scale(1, 0.9) translate(-9%, 9%);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
fill: color-mix(in srgb, var(--syui-color) 70%, transparent);
|
|
||||||
transform: scale(1, 0.9) translate(-7%, 7%);
|
|
||||||
}
|
|
||||||
60% {
|
|
||||||
transform: scale(1) translate(-7%, 7%);
|
|
||||||
}
|
|
||||||
70% {
|
|
||||||
transform: scale(1.04) translate(-5%, 5%);
|
|
||||||
}
|
|
||||||
80% {
|
|
||||||
fill: color-mix(in srgb, var(--syui-color) 60%, transparent);
|
|
||||||
transform: scale(1.04) translate(-5%, 5%);
|
|
||||||
}
|
|
||||||
90% {
|
|
||||||
fill: var(--particle-color-5); /* 爆発の閃光 */
|
|
||||||
transform: scale(1) translate(0%);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
fill: var(--syui-color);
|
|
||||||
transform: scale(1, 1) translate(0%, 0%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Individual particle animations */
|
|
||||||
@keyframes particleAnimate1 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-16px, -59px); }
|
|
||||||
90% { transform: translate(-16px, -59px); }
|
|
||||||
100% { opacity: 1; transform: translate(-16px, -59px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate2 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(41px, 43px); }
|
|
||||||
90% { transform: translate(41px, 43px); }
|
|
||||||
100% { opacity: 1; transform: translate(41px, 43px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate3 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(50px, -48px); }
|
|
||||||
90% { transform: translate(50px, -48px); }
|
|
||||||
100% { opacity: 1; transform: translate(50px, -48px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate4 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-39px, 36px); }
|
|
||||||
90% { transform: translate(-39px, 36px); }
|
|
||||||
100% { opacity: 1; transform: translate(-39px, 36px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate5 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-39px, 32px); }
|
|
||||||
90% { transform: translate(-39px, 32px); }
|
|
||||||
100% { opacity: 1; transform: translate(-39px, 32px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate6 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(48px, 6px); }
|
|
||||||
90% { transform: translate(48px, 6px); }
|
|
||||||
100% { opacity: 1; transform: translate(48px, 6px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate7 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-69px, -36px); }
|
|
||||||
90% { transform: translate(-69px, -36px); }
|
|
||||||
100% { opacity: 1; transform: translate(-69px, -36px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate8 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-12px, -52px); }
|
|
||||||
90% { transform: translate(-12px, -52px); }
|
|
||||||
100% { opacity: 1; transform: translate(-12px, -52px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate9 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-43px, -21px); }
|
|
||||||
90% { transform: translate(-43px, -21px); }
|
|
||||||
100% { opacity: 1; transform: translate(-43px, -21px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate10 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-10px, 47px); }
|
|
||||||
90% { transform: translate(-10px, 47px); }
|
|
||||||
100% { opacity: 1; transform: translate(-10px, 47px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate11 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(66px, -9px); }
|
|
||||||
90% { transform: translate(66px, -9px); }
|
|
||||||
100% { opacity: 1; transform: translate(66px, -9px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate12 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(40px, -45px); }
|
|
||||||
90% { transform: translate(40px, -45px); }
|
|
||||||
100% { opacity: 1; transform: translate(40px, -45px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate13 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(29px, 24px); }
|
|
||||||
90% { transform: translate(29px, 24px); }
|
|
||||||
100% { opacity: 1; transform: translate(29px, 24px); }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes particleAnimate14 {
|
|
||||||
0% { transform: translate(0, 0); }
|
|
||||||
30% { opacity: 1; transform: translate(0, 0); }
|
|
||||||
80% { transform: translate(-10px, 50px); }
|
|
||||||
90% { transform: translate(-10px, 50px); }
|
|
||||||
100% { opacity: 1; transform: translate(-10px, 50px); }
|
|
||||||
}
|
|
Before Width: | Height: | Size: 84 KiB |
Before Width: | Height: | Size: 23 KiB |
@@ -1,22 +0,0 @@
|
|||||||
<svg width="77pt" height="77pt" viewBox="0 0 512 512" class="likeButton" >
|
|
||||||
<circle class="explosion" r="150" cx="250" cy="250"></circle>
|
|
||||||
<g class="particleLayer">
|
|
||||||
<circle fill="#ef454aba" cx="130" cy="126.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454acc" cx="411" cy="313.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="279" cy="86.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="155" cy="390.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="89" cy="292.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="414" cy="282.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454a91" cx="115" cy="149.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="250" cy="80.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="78" cy="261.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454a91" cx="182" cy="402.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="401.5" cy="166" r="13"/>
|
|
||||||
<circle fill="#ef454aba" cx="379" cy="141.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454a91" cx="327" cy="397.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="296" cy="392.5" r="10.5"/>
|
|
||||||
</g>
|
|
||||||
<g transform="translate(0,512) scale(0.1,-0.1)" fill="#000000" class="icon_syui">
|
|
||||||
<path class="syui" d="M3660 4460 c-11 -11 -33 -47 -48 -80 l-29 -60 -12 38 c-27 88 -58 92 -98 11 -35 -70 -73 -159 -73 -169 0 -6 -5 -10 -10 -10 -6 0 -15 -10 -21 -22 -33 -73 -52 -92 -47 -48 2 26 -1 35 -14 38 -16 3 -168 -121 -168 -138 0 -5 -13 -16 -28 -24 -24 -13 -35 -12 -87 0 -221 55 -231 56 -480 56 -219 1 -247 -1 -320 -22 -44 -12 -96 -26 -115 -30 -57 -13 -122 -39 -200 -82 -8 -4 -31 -14 -50 -23 -41 -17 -34 -13 -146 -90 -87 -59 -292 -252 -351 -330 -63 -83 -143 -209 -143 -225 0 -10 -7 -23 -15 -30 -8 -7 -15 -17 -15 -22 0 -5 -13 -37 -28 -71 -16 -34 -36 -93 -45 -132 -9 -38 -24 -104 -34 -145 -13 -60 -17 -121 -17 -300 1 -224 1 -225 36 -365 24 -94 53 -175 87 -247 28 -58 51 -108 51 -112 0 -3 13 -24 28 -48 42 -63 46 -79 22 -85 -11 -3 -20 -9 -20 -14 0 -5 -4 -9 -10 -9 -5 0 -22 -11 -37 -25 -16 -13 -75 -59 -133 -100 -58 -42 -113 -82 -123 -90 -9 -8 -22 -15 -27 -15 -6 0 -10 -6 -10 -13 0 -8 -11 -20 -25 -27 -34 -18 -34 -54 0 -48 14 3 25 2 25 -1 0 -3 -43 -31 -95 -61 -52 -30 -95 -58 -95 -62 0 -5 -5 -8 -11 -8 -19 0 -84 -33 -92 -47 -4 -7 -15 -13 -22 -13 -14 0 -17 -4 -19 -32 -1 -8 15 -15 37 -18 l38 -5 -47 -48 c-56 -59 -54 -81 9 -75 30 3 45 0 54 -11 9 -13 16 -14 43 -4 29 11 30 10 18 -5 -7 -9 -19 -23 -25 -30 -7 -7 -13 -20 -13 -29 0 -12 8 -14 38 -9 20 4 57 8 82 9 25 2 54 8 66 15 18 10 23 8 32 -13 17 -38 86 -35 152 6 27 17 50 34 50 38 0 16 62 30 85 19 33 -15 72 -2 89 30 8 15 31 43 51 62 35 34 38 35 118 35 77 0 85 2 126 33 24 17 52 32 61 32 9 0 42 18 73 40 30 22 61 40 69 40 21 0 88 -26 100 -38 7 -7 17 -12 24 -12 7 0 35 -11 62 -25 66 -33 263 -84 387 -101 189 -25 372 -12 574 41 106 27 130 37 261 97 41 20 80 37 85 39 6 2 51 31 100 64 166 111 405 372 489 534 10 20 22 43 27 51 5 8 12 22 15 30 3 8 17 40 31 70 54 115 95 313 108 520 13 200 -43 480 -134 672 -28 58 -51 108 -51 112 0 3 -13 24 -29 48 -15 24 -34 60 -40 80 -19 57 3 142 50 193 10 11 22 49 28 85 6 36 16 67 21 68 18 6 31 53 25 83 -4 18 -17 33 -36 41 -16 7 -29 15 -29 18 1 10 38 50 47 50 5 0 20 11 33 25 18 19 22 31 17 61 -3 20 -14 45 -23 55 -16 18 -16 20 6 44 15 16 21 32 18 49 -3 15 1 34 8 43 32 43 7 73 -46 55 l-30 -11 0 85 c0 74 -2 84 -18 84 -21 0 -53 -33 -103 -104 l-34 -48 -5 74 c-7 102 -35 133 -80 88z m-870 -740 c36 -7 75 -14 88 -16 21 -4 23 -9 16 -37 -3 -18 -14 -43 -24 -57 -10 -14 -20 -35 -24 -46 -4 -12 -16 -32 -27 -45 -12 -13 -37 -49 -56 -79 -20 -30 -52 -73 -72 -96 -53 -60 -114 -133 -156 -189 -21 -27 -44 -54 -52 -58 -7 -4 -13 -14 -13 -22 0 -7 -18 -33 -40 -57 -22 -23 -40 -46 -40 -50 0 -5 -19 -21 -42 -38 -47 -35 -85 -38 -188 -15 -115 25 -173 20 -264 -23 -45 -22 -106 -46 -136 -56 -48 -15 -77 -25 -140 -50 -70 -28 -100 -77 -51 -84 14 -2 34 -10 45 -17 12 -7 53 -16 91 -20 90 -9 131 -22 178 -57 20 -16 52 -35 70 -43 18 -7 40 -22 49 -32 16 -18 15 -22 -24 -88 -23 -39 -47 -74 -53 -80 -7 -5 -23 -26 -36 -45 -26 -39 -92 -113 -207 -232 -4 -4 -37 -36 -73 -71 l-66 -64 -20 41 c-58 119 -105 240 -115 301 -40 244 -35 409 20 595 8 30 21 66 28 80 7 14 24 54 38 89 15 35 35 75 46 89 11 13 20 31 20 38 0 8 3 14 8 14 4 0 16 16 27 36 24 45 221 245 278 281 23 15 44 30 47 33 20 20 138 78 250 123 61 24 167 50 250 61 60 7 302 -1 370 -14z m837 -661 c52 -101 102 -279 106 -379 2 -42 0 -45 -28 -51 -16 -4 -101 -7 -187 -8 -166 -1 -229 10 -271 49 -19 19 -19 19 14 49 22 21 44 31 65 31 41 0 84 34 84 66 0 30 12 55 56 112 19 25 37 65 44 95 11 51 53 111 74 104 6 -2 25 -32 43 -68z m-662 -810 c17 -10 40 -24 53 -30 12 -7 22 -16 22 -20 0 -4 17 -13 38 -19 20 -7 44 -18 52 -24 8 -7 33 -21 55 -31 22 -11 42 -23 45 -26 11 -14 109 -49 164 -58 62 -11 101 -7 126 14 15 14 38 18 78 16 39 -2 26 -41 -49 -146 -78 -109 -85 -118 -186 -219 -61 -61 -239 -189 -281 -203 -17 -5 -73 -29 -104 -44 -187 -92 -605 -103 -791 -21 -42 19 -47 24 -37 41 5 11 28 32 51 48 22 15 51 38 64 51 13 12 28 22 33 22 17 0 242 233 242 250 0 6 5 10 10 10 6 0 10 6 10 14 0 25 50 55 100 62 59 8 56 6 115 83 50 66 74 117 75 162 0 14 7 40 16 57 18 38 52 41 99 11z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
Before Width: | Height: | Size: 4.8 KiB |
Before Width: | Height: | Size: 263 KiB |
Before Width: | Height: | Size: 256 KiB |
Before Width: | Height: | Size: 49 KiB |
Before Width: | Height: | Size: 1.5 MiB |
Before Width: | Height: | Size: 1.5 MiB |
Before Width: | Height: | Size: 1.6 MiB |
Before Width: | Height: | Size: 1.6 MiB |
Before Width: | Height: | Size: 1.9 MiB |
Before Width: | Height: | Size: 2.0 MiB |
Before Width: | Height: | Size: 2.0 MiB |
Before Width: | Height: | Size: 1.2 MiB |
Before Width: | Height: | Size: 723 KiB |
@@ -1,3 +1,3 @@
|
|||||||
<!-- OAuth Comment System - Load globally for session management -->
|
<!-- OAuth Comment System - Load globally for session management -->
|
||||||
<script type="module" crossorigin src="/assets/comment-atproto-B2YEFA6R.js"></script>
|
<script type="module" crossorigin src="/assets/comment-atproto-MOwlkOMr.js"></script>
|
||||||
<link rel="stylesheet" crossorigin href="/assets/comment-atproto-BHjafP79.css">
|
<link rel="stylesheet" crossorigin href="/assets/comment-atproto-B330B6QX.css">
|
@@ -1,31 +0,0 @@
|
|||||||
[
|
|
||||||
{
|
|
||||||
"categories": [],
|
|
||||||
"contents": "ブログを移行しました。過去のブログはsyui.github.ioにありあます。 gh-pagesからcf-pagesへの移行になります。 自作のailogでbuildしています。 特徴としては、atproto, AIとの連携です。 name: Deploy to Cloudflare Pages on: push: branches: - main workflow_dispatch: jobs: deploy: runs-on: ubuntu-latest permissions: contents: read deployments: write steps: - name: Checkout uses: actions/checkout@v4 - name: Setup Rust uses: actions-rs/toolchain@v1 with: toolchain: stable - name: Build ailog run: cargo build --release - name: Build site with ailog run: | cd my-blog ../target/release/ailog build - name: List public directory run: | ls -la my-blog/public/ - name: Deploy to Cloudflare Pages uses: cloudflare/pages-action@v1 with: apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }} accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }} projectName: ${{ secrets.CLOUDFLARE_PROJECT_NAME }} directory: my-blog/public gitHubToken: ${{ secrets.GITHUB_TOKEN }} wranglerVersion: '3' url https://syui.pages.dev https://syui.github.io",
|
|
||||||
"description": "ブログを移行しました。過去のブログはsyui.github.ioにありあます。 \n\ngh-pagesからcf-pagesへの移行になります。\n自作のailogでbuildしています。\n特徴としては、atproto, AIとの連携です。\n\nname: Deploy to Cloudflare Pages\n\non:\n push:\n branches:\n - main\n workfl...",
|
|
||||||
"formated_time": "Sat Jun 14, 2025",
|
|
||||||
"href": "https://syui.ai/posts/2025-06-14-blog.html",
|
|
||||||
"tags": [
|
|
||||||
"blog",
|
|
||||||
"cloudflare",
|
|
||||||
"github"
|
|
||||||
],
|
|
||||||
"title": "ブログを移行した",
|
|
||||||
"utc_time": "2025-06-14T00:00:00Z"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"categories": [],
|
|
||||||
"contents": "rustで静的サイトジェネレータを作りました。ailogといいます。hugoからの移行になります。 ailogは、最初にatproto-comment-system(oauth)とask-AIという機能をつけました。 quick start $ git clone https://git.syui.ai/ai/log $ cd log $ cargo build $ ./target/debug/ailog init my-blog $ ./target/debug/ailog serve my-blog install $ cargo install --path . --- $ export CARGO_HOME="$HOME/.cargo" $ export RUSTUP_HOME="$HOME/.rustup" $ export PATH="$HOME/.cargo/bin:$PATH" --- $ which ailog $ ailog -h build deploy $ cd my-blog $ vim config.toml $ ailog new test $ vim content/posts/`date +"%Y-%m-%d"`.md $ ailog build # publicの中身をweb-serverにdeploy $ cp -rf ./public/* ./web-server/root/ atproto-comment-system example $ cd ./oauth $ npm i $ npm run build $ npm run preview # Production environment variables VITE_APP_HOST=https://example.com VITE_OAUTH_CLIENT_ID=https://example.com/client-metadata.json VITE_OAUTH_REDIRECT_URI=https://example.com/oauth/callback VITE_ADMIN_DID=did:plc:uqzpqmrjnptsxezjx4xuh2mn # Collection names for OAuth app VITE_COLLECTION_COMMENT=ai.syui.log VITE_COLLECTION_USER=ai.syui.log.user VITE_COLLECTION_CHAT=ai.syui.log.chat # Collection names for ailog (backward compatibility) AILOG_COLLECTION_COMMENT=ai.syui.log AILOG_COLLECTION_USER=ai.syui.log.user # API Configuration VITE_BSKY_PUBLIC_API=https://public.api.bsky.app これはailog oauth build my-blogで./my-blog/config.tomlから./oauth/.env.productionが生成されます。 $ ailog oauth build my-blog use 簡単に説明すると、./oauthで生成するのがatproto-comment-systemです。 <script type="module" crossorigin src="/assets/comment-atproto-${hash}}.js"></script> <link rel="stylesheet" crossorigin href="/assets/comment-atproto-${hash}.css"> <section class="comment-section"> <div id="comment-atproto"></div> </section> ただし、oauthであるため、色々と大変です。本番環境(もしくは近い形)でテストを行いましょう。cf, tailscale, ngrokなど。 tunnel: ${hash} credentials-file: ${path}.json ingress: - hostname: example.com service: http://localhost:4173 originRequest: noHappyEyeballs: true - service: http_status:404 # tunnel list, dnsに登録が必要です $ cloudflared tunnel list $ cloudflared tunnel --config cloudflared-config.yml run $ cloudflared tunnel route dns ${uuid} example.com 以下の2つのcollection recordを生成します。ユーザーにはai.syui.logが生成され、ここにコメントが記録されます。それを取得して表示しています。ai.syui.log.userは管理者であるVITE_ADMIN_DID用です。 VITE_COLLECTION_COMMENT=ai.syui.log VITE_COLLECTION_USER=ai.syui.log.user $ ailog auth login $ ailog stream server このコマンドでai.syui.logをjetstreamから監視して、書き込みがあれば、管理者のai.syui.log.userに記録され、そのuser-listに基づいて、コメント一覧を取得します。 つまり、コメント表示のアカウントを手動で設定するか、自動化するか。自動化するならserverでailog stream serverを動かさなければいけません。 ask-AI ask-AIの仕組みは割愛します。後に変更される可能性が高いと思います。 local llm, mcp, atprotoと組み合わせです。 code syntax # comment d=${0:a:h} // This is a comment fn main() { println!("Hello, world!"); } // This is a comment console.log("Hello, world!");",
|
|
||||||
"description": "rustで静的サイトジェネレータを作りました。ailogといいます。hugoからの移行になります。 \nailogは、最初にatproto-comment-system(oauth)とask-AIという機能をつけました。 \nquick start\n$ git clone https://git.syui.ai/ai/log\n$ cd log\n$ cargo build\n$ ./target/debu...",
|
|
||||||
"formated_time": "Thu Jun 12, 2025",
|
|
||||||
"href": "https://syui.ai/posts/2025-06-06-ailog.html",
|
|
||||||
"tags": [
|
|
||||||
"blog",
|
|
||||||
"rust",
|
|
||||||
"mcp",
|
|
||||||
"atp"
|
|
||||||
],
|
|
||||||
"title": "静的サイトジェネレータを作った",
|
|
||||||
"utc_time": "2025-06-12T00:00:00Z"
|
|
||||||
}
|
|
||||||
]
|
|
@@ -1,518 +0,0 @@
|
|||||||
/**
|
|
||||||
* Ask AI functionality - Based on original working implementation
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Global variables for AI functionality
|
|
||||||
let aiProfileData = null;
|
|
||||||
|
|
||||||
// Get config from window or use defaults
|
|
||||||
const OAUTH_PDS = window.OAUTH_CONFIG?.pds || 'syu.is';
|
|
||||||
const ADMIN_HANDLE = window.OAUTH_CONFIG?.admin || 'ai.syui.ai';
|
|
||||||
const OAUTH_COLLECTION = window.OAUTH_CONFIG?.collection || 'ai.syui.log';
|
|
||||||
|
|
||||||
// Listen for AI profile data from OAuth app
|
|
||||||
window.addEventListener('aiProfileLoaded', function(event) {
|
|
||||||
aiProfileData = event.detail;
|
|
||||||
updateAskAIButton();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Check if AI profile data is already available
|
|
||||||
if (window.aiProfileData) {
|
|
||||||
aiProfileData = window.aiProfileData;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Original functions from working implementation
|
|
||||||
function toggleAskAI() {
|
|
||||||
const panel = document.getElementById('askAiPanel');
|
|
||||||
const isVisible = panel.style.display !== 'none';
|
|
||||||
panel.style.display = isVisible ? 'none' : 'block';
|
|
||||||
|
|
||||||
if (!isVisible) {
|
|
||||||
|
|
||||||
// If AI profile data is already available, show introduction immediately
|
|
||||||
if (aiProfileData) {
|
|
||||||
// Quick check for authentication
|
|
||||||
const userSections = document.querySelectorAll('.user-section');
|
|
||||||
const isAuthenticated = userSections.length > 0;
|
|
||||||
handleAuthenticationStatus(isAuthenticated);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// For production fallback - if OAuth app fails to load, show profiles
|
|
||||||
const isProd = window.location.hostname !== 'localhost' && !window.location.hostname.includes('preview');
|
|
||||||
if (isProd) {
|
|
||||||
// Shorter timeout for production
|
|
||||||
setTimeout(() => {
|
|
||||||
const userSections = document.querySelectorAll('.user-section');
|
|
||||||
|
|
||||||
if (userSections.length === 0) {
|
|
||||||
handleAuthenticationStatus(false);
|
|
||||||
} else {
|
|
||||||
handleAuthenticationStatus(true);
|
|
||||||
}
|
|
||||||
}, 300);
|
|
||||||
} else {
|
|
||||||
checkAuthenticationStatus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function checkAuthenticationStatus() {
|
|
||||||
// Check multiple times for OAuth app to load
|
|
||||||
let checkCount = 0;
|
|
||||||
const maxChecks = 10;
|
|
||||||
|
|
||||||
const checkForAuth = () => {
|
|
||||||
const userSections = document.querySelectorAll('.user-section');
|
|
||||||
const authButtons = document.querySelectorAll('[data-auth-status]');
|
|
||||||
const oauthContainers = document.querySelectorAll('#oauth-container');
|
|
||||||
|
|
||||||
|
|
||||||
const isAuthenticated = userSections.length > 0;
|
|
||||||
|
|
||||||
if (isAuthenticated || checkCount >= maxChecks - 1) {
|
|
||||||
handleAuthenticationStatus(isAuthenticated);
|
|
||||||
} else {
|
|
||||||
checkCount++;
|
|
||||||
setTimeout(checkForAuth, 200);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
checkForAuth();
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleAuthenticationStatus(isAuthenticated) {
|
|
||||||
|
|
||||||
// Always hide loading first
|
|
||||||
document.getElementById('authCheck').style.display = 'none';
|
|
||||||
|
|
||||||
if (isAuthenticated) {
|
|
||||||
// User is authenticated - show Ask AI UI
|
|
||||||
document.getElementById('chatForm').style.display = 'block';
|
|
||||||
document.getElementById('chatHistory').style.display = 'block';
|
|
||||||
|
|
||||||
// Show initial greeting if chat history is empty and AI profile is available
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
if (chatHistory.children.length === 0) {
|
|
||||||
if (aiProfileData) {
|
|
||||||
showInitialGreeting();
|
|
||||||
} else {
|
|
||||||
// Wait for AI profile data
|
|
||||||
setTimeout(() => {
|
|
||||||
if (aiProfileData) {
|
|
||||||
showInitialGreeting();
|
|
||||||
}
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Focus on input
|
|
||||||
setTimeout(() => {
|
|
||||||
document.getElementById('aiQuestion').focus();
|
|
||||||
}, 50);
|
|
||||||
} else {
|
|
||||||
// User not authenticated - show AI introduction directly if profile available
|
|
||||||
document.getElementById('chatForm').style.display = 'none';
|
|
||||||
document.getElementById('chatHistory').style.display = 'block';
|
|
||||||
|
|
||||||
if (aiProfileData) {
|
|
||||||
// Show AI introduction directly using available profile data
|
|
||||||
showAIIntroduction();
|
|
||||||
} else {
|
|
||||||
// Fallback to profile loading
|
|
||||||
loadAndShowProfiles();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Load and display profiles from ai.syui.log.profile collection
|
|
||||||
async function loadAndShowProfiles() {
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
chatHistory.innerHTML = '<div class="loading-message">Loading profiles...</div>';
|
|
||||||
|
|
||||||
try {
|
|
||||||
const response = await fetch(`https://${OAUTH_PDS}/xrpc/com.atproto.repo.listRecords?repo=${ADMIN_HANDLE}&collection=${OAUTH_COLLECTION}&limit=100`);
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error('Failed to fetch profiles');
|
|
||||||
}
|
|
||||||
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
// Filter only profile records and sort
|
|
||||||
const profileRecords = (data.records || []).filter(record => record.value.type === 'profile');
|
|
||||||
|
|
||||||
const profiles = profileRecords.sort((a, b) => {
|
|
||||||
if (a.value.profileType === 'admin' && b.value.profileType !== 'admin') return -1;
|
|
||||||
if (a.value.profileType !== 'admin' && b.value.profileType === 'admin') return 1;
|
|
||||||
return 0;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Clear loading message
|
|
||||||
chatHistory.innerHTML = '';
|
|
||||||
|
|
||||||
// Display profiles using the same format as chat
|
|
||||||
profiles.forEach(profile => {
|
|
||||||
const profileDiv = document.createElement('div');
|
|
||||||
profileDiv.className = 'chat-message ai-message comment-style';
|
|
||||||
|
|
||||||
const avatarElement = profile.value.author.avatar
|
|
||||||
? `<img src="${profile.value.author.avatar}" alt="${profile.value.author.displayName || profile.value.author.handle}" class="profile-avatar">`
|
|
||||||
: `<div class="profile-avatar-fallback">${(profile.value.author.displayName || profile.value.author.handle || '?').charAt(0).toUpperCase()}</div>`;
|
|
||||||
|
|
||||||
const adminBadge = profile.value.profileType === 'admin'
|
|
||||||
? '<span class="admin-badge">Admin</span>'
|
|
||||||
: '';
|
|
||||||
|
|
||||||
profileDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">${avatarElement}</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">${profile.value.author.displayName || profile.value.author.handle} ${adminBadge}</div>
|
|
||||||
<div class="handle"><a href="https://${OAUTH_PDS}/profile/${profile.value.author.handle}" target="_blank" rel="noopener noreferrer">@${profile.value.author.handle}</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">${profile.value.text}</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(profileDiv);
|
|
||||||
});
|
|
||||||
|
|
||||||
if (profiles.length === 0) {
|
|
||||||
chatHistory.innerHTML = '<div class="no-profiles">No profiles available</div>';
|
|
||||||
}
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
chatHistory.innerHTML = '<div class="error-message">Failed to load profiles. Please try again later.</div>';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function askQuestion() {
|
|
||||||
const question = document.getElementById('aiQuestion').value;
|
|
||||||
if (!question.trim()) return;
|
|
||||||
|
|
||||||
const askButton = document.getElementById('askButton');
|
|
||||||
askButton.disabled = true;
|
|
||||||
askButton.textContent = 'Posting...';
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Add user message to chat
|
|
||||||
addUserMessage(question);
|
|
||||||
|
|
||||||
// Clear input
|
|
||||||
document.getElementById('aiQuestion').value = '';
|
|
||||||
|
|
||||||
// Show loading
|
|
||||||
showLoadingMessage();
|
|
||||||
|
|
||||||
// Post question via OAuth app
|
|
||||||
window.dispatchEvent(new CustomEvent('postAIQuestion', {
|
|
||||||
detail: { question: question }
|
|
||||||
}));
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
showErrorMessage('Sorry, I encountered an error. Please try again.');
|
|
||||||
} finally {
|
|
||||||
askButton.disabled = false;
|
|
||||||
askButton.textContent = 'Ask';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function addUserMessage(question) {
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
const userSection = document.querySelector('.user-section');
|
|
||||||
|
|
||||||
let userAvatar = '👤';
|
|
||||||
let userDisplay = 'You';
|
|
||||||
let userHandle = 'user';
|
|
||||||
|
|
||||||
if (userSection) {
|
|
||||||
const avatarImg = userSection.querySelector('.user-avatar');
|
|
||||||
const displayName = userSection.querySelector('.user-display-name');
|
|
||||||
const handle = userSection.querySelector('.user-handle');
|
|
||||||
|
|
||||||
if (avatarImg && avatarImg.src) {
|
|
||||||
userAvatar = `<img src="${avatarImg.src}" alt="${displayName?.textContent || 'User'}" class="profile-avatar">`;
|
|
||||||
}
|
|
||||||
if (displayName?.textContent) {
|
|
||||||
userDisplay = displayName.textContent;
|
|
||||||
}
|
|
||||||
if (handle?.textContent) {
|
|
||||||
userHandle = handle.textContent.replace('@', '');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const questionDiv = document.createElement('div');
|
|
||||||
questionDiv.className = 'chat-message user-message comment-style';
|
|
||||||
questionDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">${userAvatar}</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">${userDisplay}</div>
|
|
||||||
<div class="handle"><a href="https://${OAUTH_PDS}/profile/${userHandle}" target="_blank" rel="noopener noreferrer">@${userHandle}</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">${question}</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(questionDiv);
|
|
||||||
}
|
|
||||||
|
|
||||||
function showLoadingMessage() {
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
const loadingDiv = document.createElement('div');
|
|
||||||
loadingDiv.className = 'ai-loading-simple';
|
|
||||||
loadingDiv.innerHTML = `
|
|
||||||
<i class="fas fa-robot"></i>
|
|
||||||
<span>考えています</span>
|
|
||||||
<i class="fas fa-spinner fa-spin"></i>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(loadingDiv);
|
|
||||||
}
|
|
||||||
|
|
||||||
function showErrorMessage(message) {
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
removeLoadingMessage();
|
|
||||||
|
|
||||||
const errorDiv = document.createElement('div');
|
|
||||||
errorDiv.className = 'chat-message error-message comment-style';
|
|
||||||
errorDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">⚠️</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">System</div>
|
|
||||||
<div class="handle">@system</div>
|
|
||||||
<div class="timestamp">${new Date().toLocaleString()}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">${message}</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(errorDiv);
|
|
||||||
}
|
|
||||||
|
|
||||||
function removeLoadingMessage() {
|
|
||||||
const loadingMsg = document.querySelector('.ai-loading-simple');
|
|
||||||
if (loadingMsg) {
|
|
||||||
loadingMsg.remove();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function showInitialGreeting() {
|
|
||||||
if (!aiProfileData) return;
|
|
||||||
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
const greetingDiv = document.createElement('div');
|
|
||||||
greetingDiv.className = 'chat-message ai-message comment-style initial-greeting';
|
|
||||||
|
|
||||||
const avatarElement = aiProfileData.avatar
|
|
||||||
? `<img src="${aiProfileData.avatar}" alt="${aiProfileData.displayName}" class="profile-avatar">`
|
|
||||||
: '🤖';
|
|
||||||
|
|
||||||
greetingDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">${avatarElement}</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">${aiProfileData.displayName}</div>
|
|
||||||
<div class="handle"><a href="https://${OAUTH_PDS}/profile/${aiProfileData.handle}" target="_blank" rel="noopener noreferrer">@${aiProfileData.handle}</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">Hello! I'm an AI assistant trained on this blog's content. I can answer questions about the articles, provide insights, and help you understand the topics discussed here. What would you like to know?</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(greetingDiv);
|
|
||||||
}
|
|
||||||
|
|
||||||
function showAIIntroduction() {
|
|
||||||
if (!aiProfileData) return;
|
|
||||||
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
chatHistory.innerHTML = ''; // Clear any existing content
|
|
||||||
|
|
||||||
// AI Introduction message
|
|
||||||
const introDiv = document.createElement('div');
|
|
||||||
introDiv.className = 'chat-message ai-message comment-style initial-greeting';
|
|
||||||
|
|
||||||
const avatarElement = aiProfileData.avatar
|
|
||||||
? `<img src="${aiProfileData.avatar}" alt="${aiProfileData.displayName}" class="profile-avatar">`
|
|
||||||
: '🤖';
|
|
||||||
|
|
||||||
introDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">${avatarElement}</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">${aiProfileData.displayName}</div>
|
|
||||||
<div class="handle"><a href="https://${OAUTH_PDS}/profile/${aiProfileData.handle}" target="_blank" rel="noopener noreferrer">@${aiProfileData.handle}</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">Hello! I'm an AI assistant trained on this blog's content. I can answer questions about the articles, provide insights, and help you understand the topics discussed here. What would you like to know?</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(introDiv);
|
|
||||||
|
|
||||||
// OAuth login message
|
|
||||||
const loginDiv = document.createElement('div');
|
|
||||||
loginDiv.className = 'chat-message user-message comment-style initial-greeting';
|
|
||||||
|
|
||||||
loginDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">${avatarElement}</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">${aiProfileData.displayName}</div>
|
|
||||||
<div class="handle"><a href="https://${OAUTH_PDS}/profile/${aiProfileData.handle}" target="_blank" rel="noopener noreferrer">@${aiProfileData.handle}</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">Please atproto oauth login</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(loginDiv);
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateAskAIButton() {
|
|
||||||
const button = document.getElementById('askAiButton');
|
|
||||||
if (!button) return;
|
|
||||||
|
|
||||||
// Only update text, never modify the icon
|
|
||||||
if (aiProfileData && aiProfileData.displayName) {
|
|
||||||
const textNode = button.childNodes[2] || button.lastChild;
|
|
||||||
if (textNode && textNode.nodeType === Node.TEXT_NODE) {
|
|
||||||
textNode.textContent = aiProfileData.displayName;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleAIResponse(responseData) {
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
removeLoadingMessage();
|
|
||||||
|
|
||||||
const aiProfile = responseData.aiProfile;
|
|
||||||
if (!aiProfile || !aiProfile.handle || !aiProfile.displayName) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const timestamp = new Date(responseData.timestamp || Date.now());
|
|
||||||
const avatarElement = aiProfile.avatar
|
|
||||||
? `<img src="${aiProfile.avatar}" alt="${aiProfile.displayName}" class="profile-avatar">`
|
|
||||||
: '🤖';
|
|
||||||
|
|
||||||
const answerDiv = document.createElement('div');
|
|
||||||
answerDiv.className = 'chat-message ai-message comment-style';
|
|
||||||
answerDiv.innerHTML = `
|
|
||||||
<div class="message-header">
|
|
||||||
<div class="avatar">${avatarElement}</div>
|
|
||||||
<div class="user-info">
|
|
||||||
<div class="display-name">${aiProfile.displayName}</div>
|
|
||||||
<div class="handle"><a href="https://${OAUTH_PDS}/profile/${aiProfile.handle}" target="_blank" rel="noopener noreferrer">@${aiProfile.handle}</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="message-content">${responseData.answer}</div>
|
|
||||||
`;
|
|
||||||
chatHistory.appendChild(answerDiv);
|
|
||||||
|
|
||||||
// Limit chat history
|
|
||||||
limitChatHistory();
|
|
||||||
}
|
|
||||||
|
|
||||||
function limitChatHistory() {
|
|
||||||
const chatHistory = document.getElementById('chatHistory');
|
|
||||||
if (chatHistory.children.length > 10) {
|
|
||||||
chatHistory.removeChild(chatHistory.children[0]);
|
|
||||||
if (chatHistory.children.length > 0) {
|
|
||||||
chatHistory.removeChild(chatHistory.children[0]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Event listeners setup
|
|
||||||
function setupAskAIEventListeners() {
|
|
||||||
// Listen for AI profile updates from OAuth app
|
|
||||||
window.addEventListener('aiProfileLoaded', function(event) {
|
|
||||||
aiProfileData = event.detail;
|
|
||||||
updateAskAIButton();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Listen for AI responses
|
|
||||||
window.addEventListener('aiResponseReceived', function(event) {
|
|
||||||
handleAIResponse(event.detail);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Listen for OAuth callback completion from iframe
|
|
||||||
window.addEventListener('message', function(event) {
|
|
||||||
if (event.data.type === 'oauth_success') {
|
|
||||||
|
|
||||||
// Close any OAuth popups/iframes
|
|
||||||
const oauthFrame = document.getElementById('oauth-frame');
|
|
||||||
if (oauthFrame) {
|
|
||||||
oauthFrame.remove();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Reload the page to refresh OAuth app state
|
|
||||||
setTimeout(() => {
|
|
||||||
window.location.reload();
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Track IME composition state
|
|
||||||
let isComposing = false;
|
|
||||||
const aiQuestionInput = document.getElementById('aiQuestion');
|
|
||||||
|
|
||||||
if (aiQuestionInput) {
|
|
||||||
aiQuestionInput.addEventListener('compositionstart', function() {
|
|
||||||
isComposing = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
aiQuestionInput.addEventListener('compositionend', function() {
|
|
||||||
isComposing = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Keyboard shortcuts
|
|
||||||
document.addEventListener('keydown', function(e) {
|
|
||||||
if (e.key === 'Escape') {
|
|
||||||
const panel = document.getElementById('askAiPanel');
|
|
||||||
if (panel) {
|
|
||||||
panel.style.display = 'none';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Enter key to send message (only when not composing Japanese input)
|
|
||||||
if (e.key === 'Enter' && e.target.id === 'aiQuestion' && !e.shiftKey && !isComposing) {
|
|
||||||
e.preventDefault();
|
|
||||||
askQuestion();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize Ask AI when DOM is loaded
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
setupAskAIEventListeners();
|
|
||||||
|
|
||||||
// Also listen for OAuth app load completion
|
|
||||||
const observer = new MutationObserver(function(mutations) {
|
|
||||||
mutations.forEach(function(mutation) {
|
|
||||||
if (mutation.type === 'childList') {
|
|
||||||
// Check if user-section was added/removed
|
|
||||||
const userSectionAdded = Array.from(mutation.addedNodes).some(node =>
|
|
||||||
node.nodeType === Node.ELEMENT_NODE &&
|
|
||||||
(node.classList?.contains('user-section') || node.querySelector?.('.user-section'))
|
|
||||||
);
|
|
||||||
const userSectionRemoved = Array.from(mutation.removedNodes).some(node =>
|
|
||||||
node.nodeType === Node.ELEMENT_NODE &&
|
|
||||||
(node.classList?.contains('user-section') || node.querySelector?.('.user-section'))
|
|
||||||
);
|
|
||||||
|
|
||||||
if (userSectionAdded || userSectionRemoved) {
|
|
||||||
// Update Ask AI panel if it's visible
|
|
||||||
const panel = document.getElementById('askAiPanel');
|
|
||||||
if (panel && panel.style.display !== 'none') {
|
|
||||||
checkAuthenticationStatus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
observer.observe(document.body, {
|
|
||||||
childList: true,
|
|
||||||
subtree: true
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Global functions for onclick handlers
|
|
||||||
window.toggleAskAI = toggleAskAI;
|
|
||||||
window.askQuestion = askQuestion;
|
|
@@ -1,123 +0,0 @@
|
|||||||
/**
|
|
||||||
* Image Comparison Slider
|
|
||||||
* UE5-style before/after image comparison component
|
|
||||||
*/
|
|
||||||
|
|
||||||
class ImageComparison {
|
|
||||||
constructor(container) {
|
|
||||||
this.container = container;
|
|
||||||
this.slider = container.querySelector('.slider');
|
|
||||||
this.beforeImg = container.querySelector('.img-before');
|
|
||||||
this.afterImg = container.querySelector('.img-after');
|
|
||||||
this.sliderThumb = container.querySelector('.slider-thumb');
|
|
||||||
|
|
||||||
this.isDragging = false;
|
|
||||||
this.containerRect = null;
|
|
||||||
|
|
||||||
this.init();
|
|
||||||
}
|
|
||||||
|
|
||||||
init() {
|
|
||||||
this.bindEvents();
|
|
||||||
this.updatePosition(50); // Start at 50%
|
|
||||||
}
|
|
||||||
|
|
||||||
bindEvents() {
|
|
||||||
// Mouse events
|
|
||||||
this.slider.addEventListener('input', (e) => {
|
|
||||||
this.updatePosition(e.target.value);
|
|
||||||
});
|
|
||||||
|
|
||||||
this.slider.addEventListener('mousedown', () => {
|
|
||||||
this.isDragging = true;
|
|
||||||
document.body.style.userSelect = 'none';
|
|
||||||
});
|
|
||||||
|
|
||||||
document.addEventListener('mouseup', () => {
|
|
||||||
if (this.isDragging) {
|
|
||||||
this.isDragging = false;
|
|
||||||
document.body.style.userSelect = '';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Touch events for mobile
|
|
||||||
this.slider.addEventListener('touchstart', (e) => {
|
|
||||||
this.isDragging = true;
|
|
||||||
e.preventDefault();
|
|
||||||
});
|
|
||||||
|
|
||||||
this.slider.addEventListener('touchmove', (e) => {
|
|
||||||
if (this.isDragging) {
|
|
||||||
const touch = e.touches[0];
|
|
||||||
this.containerRect = this.container.getBoundingClientRect();
|
|
||||||
const x = touch.clientX - this.containerRect.left;
|
|
||||||
const percentage = Math.max(0, Math.min(100, (x / this.containerRect.width) * 100));
|
|
||||||
this.slider.value = percentage;
|
|
||||||
this.updatePosition(percentage);
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
this.slider.addEventListener('touchend', () => {
|
|
||||||
this.isDragging = false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Direct click on container
|
|
||||||
this.container.addEventListener('click', (e) => {
|
|
||||||
if (e.target === this.container || e.target.classList.contains('img-comparison-slider')) {
|
|
||||||
this.containerRect = this.container.getBoundingClientRect();
|
|
||||||
const x = e.clientX - this.containerRect.left;
|
|
||||||
const percentage = Math.max(0, Math.min(100, (x / this.containerRect.width) * 100));
|
|
||||||
this.slider.value = percentage;
|
|
||||||
this.updatePosition(percentage);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Keyboard support
|
|
||||||
this.slider.addEventListener('keydown', (e) => {
|
|
||||||
let value = parseFloat(this.slider.value);
|
|
||||||
switch (e.key) {
|
|
||||||
case 'ArrowLeft':
|
|
||||||
value = Math.max(0, value - 1);
|
|
||||||
break;
|
|
||||||
case 'ArrowRight':
|
|
||||||
value = Math.min(100, value + 1);
|
|
||||||
break;
|
|
||||||
case 'Home':
|
|
||||||
value = 0;
|
|
||||||
break;
|
|
||||||
case 'End':
|
|
||||||
value = 100;
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
e.preventDefault();
|
|
||||||
this.slider.value = value;
|
|
||||||
this.updatePosition(value);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
updatePosition(percentage) {
|
|
||||||
const position = parseFloat(percentage);
|
|
||||||
|
|
||||||
// Update clip-path for before image to show only the left portion
|
|
||||||
this.beforeImg.style.clipPath = `inset(0 ${100 - position}% 0 0)`;
|
|
||||||
|
|
||||||
// Update slider thumb position
|
|
||||||
this.sliderThumb.style.left = `${position}%`;
|
|
||||||
this.sliderThumb.style.transform = `translateX(-50%)`;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Auto-initialize all image comparison components
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
const comparisons = document.querySelectorAll('.img-comparison-container');
|
|
||||||
comparisons.forEach(container => {
|
|
||||||
new ImageComparison(container);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Export for manual initialization
|
|
||||||
window.ImageComparison = ImageComparison;
|
|
@@ -1,370 +0,0 @@
|
|||||||
// AT Protocol API functions
|
|
||||||
const AT_PROTOCOL_CONFIG = {
|
|
||||||
primary: {
|
|
||||||
pds: 'https://syu.is',
|
|
||||||
plc: 'https://plc.syu.is',
|
|
||||||
bsky: 'https://bsky.syu.is',
|
|
||||||
web: 'https://web.syu.is'
|
|
||||||
},
|
|
||||||
fallback: {
|
|
||||||
pds: 'https://bsky.social',
|
|
||||||
plc: 'https://plc.directory',
|
|
||||||
bsky: 'https://public.api.bsky.app',
|
|
||||||
web: 'https://bsky.app'
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Search user function
|
|
||||||
async function searchUser() {
|
|
||||||
const handleInput = document.getElementById('handleInput');
|
|
||||||
const userInfo = document.getElementById('userInfo');
|
|
||||||
const collectionsList = document.getElementById('collectionsList');
|
|
||||||
const recordsList = document.getElementById('recordsList');
|
|
||||||
const searchButton = document.getElementById('searchButton');
|
|
||||||
|
|
||||||
const input = handleInput.value.trim();
|
|
||||||
if (!input) {
|
|
||||||
alert('Handle nameまたはAT URIを入力してください');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
searchButton.disabled = true;
|
|
||||||
searchButton.innerHTML = '@';
|
|
||||||
//searchButton.innerHTML = '<i class="fab fa-bluesky"></i>';
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Clear previous results
|
|
||||||
document.getElementById('userDidSection').style.display = 'none';
|
|
||||||
document.getElementById('collectionsSection').style.display = 'none';
|
|
||||||
document.getElementById('recordsSection').style.display = 'none';
|
|
||||||
collectionsList.innerHTML = '';
|
|
||||||
recordsList.innerHTML = '';
|
|
||||||
|
|
||||||
// Check if input is AT URI
|
|
||||||
if (input.startsWith('at://')) {
|
|
||||||
// Parse AT URI to check if it's a full record or just a handle/collection
|
|
||||||
const uriParts = input.replace('at://', '').split('/').filter(part => part.length > 0);
|
|
||||||
|
|
||||||
if (uriParts.length >= 3) {
|
|
||||||
// Full AT URI with rkey - show in modal
|
|
||||||
showAtUriModal(input);
|
|
||||||
return;
|
|
||||||
} else if (uriParts.length === 1) {
|
|
||||||
// Just handle in AT URI format (at://handle) - treat as regular handle
|
|
||||||
const handle = uriParts[0];
|
|
||||||
const userProfile = await resolveUserProfile(handle);
|
|
||||||
|
|
||||||
if (userProfile.success) {
|
|
||||||
displayUserDid(userProfile.data);
|
|
||||||
await loadUserCollections(handle, userProfile.data.did);
|
|
||||||
} else {
|
|
||||||
alert('ユーザーが見つかりません: ' + userProfile.error);
|
|
||||||
}
|
|
||||||
return;
|
|
||||||
} else if (uriParts.length === 2) {
|
|
||||||
// Collection level AT URI - load collection records
|
|
||||||
const [repo, collection] = uriParts;
|
|
||||||
|
|
||||||
try {
|
|
||||||
// First resolve the repo to get handle if it's a DID
|
|
||||||
let handle = repo;
|
|
||||||
if (repo.startsWith('did:')) {
|
|
||||||
// Try to resolve DID to handle - for now just use the DID
|
|
||||||
handle = repo;
|
|
||||||
}
|
|
||||||
|
|
||||||
loadCollectionRecords(handle, collection, repo);
|
|
||||||
} catch (error) {
|
|
||||||
alert('コレクションの読み込みに失敗しました: ' + error.message);
|
|
||||||
}
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Handle regular handle search
|
|
||||||
const userProfile = await resolveUserProfile(input);
|
|
||||||
|
|
||||||
if (userProfile.success) {
|
|
||||||
displayUserDid(userProfile.data);
|
|
||||||
await loadUserCollections(input, userProfile.data.did);
|
|
||||||
} else {
|
|
||||||
alert('ユーザーが見つかりません: ' + userProfile.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
alert('エラーが発生しました: ' + error.message);
|
|
||||||
} finally {
|
|
||||||
searchButton.disabled = false;
|
|
||||||
searchButton.innerHTML = '@';
|
|
||||||
//searchButton.innerHTML = '<i class="fab fa-bluesky"></i>';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Resolve user profile
|
|
||||||
async function resolveUserProfile(handle) {
|
|
||||||
try {
|
|
||||||
let response = null;
|
|
||||||
|
|
||||||
// Try syu.is first
|
|
||||||
try {
|
|
||||||
response = await fetch(`${AT_PROTOCOL_CONFIG.primary.pds}/xrpc/com.atproto.repo.describeRepo?repo=${handle}`);
|
|
||||||
} catch (error) {
|
|
||||||
console.log('Failed to resolve from syu.is:', error);
|
|
||||||
}
|
|
||||||
|
|
||||||
// If syu.is fails, try bsky.social
|
|
||||||
if (!response || !response.ok) {
|
|
||||||
response = await fetch(`${AT_PROTOCOL_CONFIG.fallback.pds}/xrpc/com.atproto.repo.describeRepo?repo=${handle}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error('Failed to resolve handle');
|
|
||||||
}
|
|
||||||
|
|
||||||
const repoData = await response.json();
|
|
||||||
|
|
||||||
// Get profile data
|
|
||||||
const profileResponse = await fetch(`${AT_PROTOCOL_CONFIG.fallback.bsky}/xrpc/app.bsky.actor.getProfile?actor=${repoData.did}`);
|
|
||||||
const profileData = await profileResponse.json();
|
|
||||||
|
|
||||||
return {
|
|
||||||
success: true,
|
|
||||||
data: {
|
|
||||||
did: repoData.did,
|
|
||||||
handle: profileData.handle,
|
|
||||||
displayName: profileData.displayName,
|
|
||||||
avatar: profileData.avatar,
|
|
||||||
description: profileData.description,
|
|
||||||
pds: repoData.didDoc.service.find(s => s.type === 'AtprotoPersonalDataServer')?.serviceEndpoint
|
|
||||||
}
|
|
||||||
};
|
|
||||||
} catch (error) {
|
|
||||||
return {
|
|
||||||
success: false,
|
|
||||||
error: error.message
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Display user DID
|
|
||||||
function displayUserDid(profile) {
|
|
||||||
document.getElementById('userPdsText').textContent = profile.pds || 'Unknown';
|
|
||||||
document.getElementById('userHandleText').textContent = profile.handle;
|
|
||||||
document.getElementById('userDidText').textContent = profile.did;
|
|
||||||
document.getElementById('userDidSection').style.display = 'block';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Load user collections
|
|
||||||
async function loadUserCollections(handle, did) {
|
|
||||||
const collectionsList = document.getElementById('collectionsList');
|
|
||||||
|
|
||||||
collectionsList.innerHTML = '<div class="loading">コレクションを読み込み中...</div>';
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Try to get collections from describeRepo
|
|
||||||
let response = await fetch(`${AT_PROTOCOL_CONFIG.primary.pds}/xrpc/com.atproto.repo.describeRepo?repo=${handle}`);
|
|
||||||
let usedPds = AT_PROTOCOL_CONFIG.primary.pds;
|
|
||||||
|
|
||||||
// If syu.is fails, try bsky.social
|
|
||||||
if (!response.ok) {
|
|
||||||
response = await fetch(`${AT_PROTOCOL_CONFIG.fallback.pds}/xrpc/com.atproto.repo.describeRepo?repo=${handle}`);
|
|
||||||
usedPds = AT_PROTOCOL_CONFIG.fallback.pds;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error('Failed to describe repository');
|
|
||||||
}
|
|
||||||
|
|
||||||
const data = await response.json();
|
|
||||||
const collections = data.collections || [];
|
|
||||||
|
|
||||||
// Display collections as AT URI links
|
|
||||||
collectionsList.innerHTML = '';
|
|
||||||
if (collections.length === 0) {
|
|
||||||
collectionsList.innerHTML = '<div class="error">コレクションが見つかりませんでした</div>';
|
|
||||||
} else {
|
|
||||||
|
|
||||||
collections.forEach(collection => {
|
|
||||||
const atUri = `at://${did}/${collection}/`;
|
|
||||||
const collectionElement = document.createElement('a');
|
|
||||||
collectionElement.className = 'at-uri-link';
|
|
||||||
collectionElement.href = '#';
|
|
||||||
collectionElement.textContent = atUri;
|
|
||||||
collectionElement.onclick = (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
loadCollectionRecords(handle, collection, did);
|
|
||||||
// Close collections and update toggle
|
|
||||||
document.getElementById('collectionsList').style.display = 'none';
|
|
||||||
document.getElementById('collectionsToggle').textContent = '[-] Collections';
|
|
||||||
};
|
|
||||||
collectionsList.appendChild(collectionElement);
|
|
||||||
});
|
|
||||||
|
|
||||||
document.getElementById('collectionsSection').style.display = 'block';
|
|
||||||
}
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
collectionsList.innerHTML = '<div class="error">コレクションの読み込みに失敗しました: ' + error.message + '</div>';
|
|
||||||
document.getElementById('collectionsSection').style.display = 'block';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Load collection records
|
|
||||||
async function loadCollectionRecords(handle, collection, did) {
|
|
||||||
const recordsList = document.getElementById('recordsList');
|
|
||||||
|
|
||||||
recordsList.innerHTML = '<div class="loading">レコードを読み込み中...</div>';
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Try with syu.is first
|
|
||||||
let response = await fetch(`${AT_PROTOCOL_CONFIG.primary.pds}/xrpc/com.atproto.repo.listRecords?repo=${handle}&collection=${collection}`);
|
|
||||||
let usedPds = AT_PROTOCOL_CONFIG.primary.pds;
|
|
||||||
|
|
||||||
// If that fails, try with bsky.social
|
|
||||||
if (!response.ok) {
|
|
||||||
response = await fetch(`${AT_PROTOCOL_CONFIG.fallback.pds}/xrpc/com.atproto.repo.listRecords?repo=${handle}&collection=${collection}`);
|
|
||||||
usedPds = AT_PROTOCOL_CONFIG.fallback.pds;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error('Failed to load records');
|
|
||||||
}
|
|
||||||
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
// Display records as AT URI links
|
|
||||||
recordsList.innerHTML = '';
|
|
||||||
|
|
||||||
// Add collection info for records
|
|
||||||
const collectionInfo = document.createElement('div');
|
|
||||||
collectionInfo.className = 'collection-info';
|
|
||||||
collectionInfo.innerHTML = `<strong>${collection}</strong>`;
|
|
||||||
recordsList.appendChild(collectionInfo);
|
|
||||||
|
|
||||||
data.records.forEach(record => {
|
|
||||||
const atUri = record.uri;
|
|
||||||
const recordElement = document.createElement('a');
|
|
||||||
recordElement.className = 'at-uri-link';
|
|
||||||
recordElement.href = '#';
|
|
||||||
recordElement.textContent = atUri;
|
|
||||||
recordElement.onclick = (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
showAtUriModal(atUri);
|
|
||||||
};
|
|
||||||
recordsList.appendChild(recordElement);
|
|
||||||
});
|
|
||||||
|
|
||||||
document.getElementById('recordsSection').style.display = 'block';
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
recordsList.innerHTML = '<div class="error">レコードの読み込みに失敗しました: ' + error.message + '</div>';
|
|
||||||
document.getElementById('recordsSection').style.display = 'block';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Show AT URI modal
|
|
||||||
function showAtUriModal(uri) {
|
|
||||||
const modal = document.getElementById('atUriModal');
|
|
||||||
const content = document.getElementById('atUriContent');
|
|
||||||
|
|
||||||
content.innerHTML = '<div class="loading">レコードを読み込み中...</div>';
|
|
||||||
modal.style.display = 'flex';
|
|
||||||
|
|
||||||
// Load record data
|
|
||||||
loadAtUriRecord(uri, content);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Load AT URI record
|
|
||||||
async function loadAtUriRecord(uri, contentElement) {
|
|
||||||
try {
|
|
||||||
const parts = uri.replace('at://', '').split('/');
|
|
||||||
const repo = parts[0];
|
|
||||||
const collection = parts[1];
|
|
||||||
const rkey = parts[2];
|
|
||||||
|
|
||||||
// Try with syu.is first
|
|
||||||
let response = await fetch(`${AT_PROTOCOL_CONFIG.primary.pds}/xrpc/com.atproto.repo.getRecord?repo=${repo}&collection=${collection}&rkey=${rkey}`);
|
|
||||||
|
|
||||||
// If that fails, try with bsky.social
|
|
||||||
if (!response.ok) {
|
|
||||||
response = await fetch(`${AT_PROTOCOL_CONFIG.fallback.pds}/xrpc/com.atproto.repo.getRecord?repo=${repo}&collection=${collection}&rkey=${rkey}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error('Failed to load record');
|
|
||||||
}
|
|
||||||
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
contentElement.innerHTML = `
|
|
||||||
<div style="padding: 20px;">
|
|
||||||
<h3>AT URI Record</h3>
|
|
||||||
<div style="font-family: monospace; font-size: 14px; color: #666; margin-bottom: 20px; word-break: break-all;">
|
|
||||||
${uri}
|
|
||||||
</div>
|
|
||||||
<div style="font-size: 12px; color: #999; margin-bottom: 20px;">
|
|
||||||
Repo: ${repo} | Collection: ${collection} | RKey: ${rkey}
|
|
||||||
</div>
|
|
||||||
<h4>Record Data</h4>
|
|
||||||
<pre style="background: #f5f5f5; padding: 15px; border-radius: 4px; overflow: auto;">${JSON.stringify(data, null, 2)}</pre>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
} catch (error) {
|
|
||||||
contentElement.innerHTML = `
|
|
||||||
<div style="padding: 20px; color: red;">
|
|
||||||
<strong>Error:</strong> ${error.message}
|
|
||||||
<div style="margin-top: 10px; font-size: 12px;">
|
|
||||||
<strong>URI:</strong> ${uri}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Close AT URI modal
|
|
||||||
function closeAtUriModal(event) {
|
|
||||||
const modal = document.getElementById('atUriModal');
|
|
||||||
if (event && event.target !== modal) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
modal.style.display = 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize AT URI click handlers
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// Add click handlers to existing AT URIs
|
|
||||||
document.querySelectorAll('.at-uri').forEach(element => {
|
|
||||||
element.addEventListener('click', function() {
|
|
||||||
const uri = this.getAttribute('data-at-uri');
|
|
||||||
showAtUriModal(uri);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// ESC key to close modal
|
|
||||||
document.addEventListener('keydown', function(event) {
|
|
||||||
if (event.key === 'Escape') {
|
|
||||||
closeAtUriModal();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Enter key to search
|
|
||||||
document.getElementById('handleInput').addEventListener('keydown', function(event) {
|
|
||||||
if (event.key === 'Enter') {
|
|
||||||
searchUser();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
// Toggle collections visibility
|
|
||||||
function toggleCollections() {
|
|
||||||
const collectionsList = document.getElementById('collectionsList');
|
|
||||||
const toggleButton = document.getElementById('collectionsToggle');
|
|
||||||
|
|
||||||
if (collectionsList.style.display === 'none') {
|
|
||||||
collectionsList.style.display = 'block';
|
|
||||||
toggleButton.textContent = '[-] Collections';
|
|
||||||
} else {
|
|
||||||
collectionsList.style.display = 'none';
|
|
||||||
toggleButton.textContent = '[+] Collections';
|
|
||||||
}
|
|
||||||
}
|
|
@@ -1,93 +0,0 @@
|
|||||||
/**
|
|
||||||
* Theme and visual effects - Pure CSS animations, no jQuery
|
|
||||||
*/
|
|
||||||
class Theme {
|
|
||||||
constructor() {
|
|
||||||
this.init();
|
|
||||||
}
|
|
||||||
|
|
||||||
init() {
|
|
||||||
this.setupParticleColors();
|
|
||||||
this.setupLogoAnimations();
|
|
||||||
}
|
|
||||||
|
|
||||||
setupParticleColors() {
|
|
||||||
// Dynamic particle colors based on theme
|
|
||||||
const style = document.createElement('style');
|
|
||||||
style.textContent = `
|
|
||||||
/* Dynamic particle colors based on theme */
|
|
||||||
.likeButton .particleLayer circle:nth-child(1),
|
|
||||||
.likeButton .particleLayer circle:nth-child(2) {
|
|
||||||
fill: var(--particle-color-1) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .particleLayer circle:nth-child(3),
|
|
||||||
.likeButton .particleLayer circle:nth-child(4) {
|
|
||||||
fill: var(--particle-color-2) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .particleLayer circle:nth-child(5),
|
|
||||||
.likeButton .particleLayer circle:nth-child(6),
|
|
||||||
.likeButton .particleLayer circle:nth-child(7) {
|
|
||||||
fill: var(--particle-color-3) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .particleLayer circle:nth-child(8),
|
|
||||||
.likeButton .particleLayer circle:nth-child(9),
|
|
||||||
.likeButton .particleLayer circle:nth-child(10) {
|
|
||||||
fill: var(--particle-color-4) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .particleLayer circle:nth-child(11),
|
|
||||||
.likeButton .particleLayer circle:nth-child(12),
|
|
||||||
.likeButton .particleLayer circle:nth-child(13),
|
|
||||||
.likeButton .particleLayer circle:nth-child(14) {
|
|
||||||
fill: var(--particle-color-5) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Reset initial animations but allow hover */
|
|
||||||
.likeButton .syui {
|
|
||||||
animation: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .particleLayer {
|
|
||||||
animation: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton .explosion {
|
|
||||||
animation: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Enable hover animations from package */
|
|
||||||
.likeButton:hover .syui,
|
|
||||||
.likeButton:hover path.syui {
|
|
||||||
animation: syuiDeluxeAnime 400ms forwards !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .particleLayer {
|
|
||||||
animation: particleLayerAnime 800ms forwards !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.likeButton:hover .explosion {
|
|
||||||
animation: explosionAnime 800ms forwards !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Logo positioning */
|
|
||||||
.logo .likeButton {
|
|
||||||
background: transparent !important;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
document.head.appendChild(style);
|
|
||||||
}
|
|
||||||
|
|
||||||
setupLogoAnimations() {
|
|
||||||
// Pure CSS animations are handled by the svg-animation-package.css
|
|
||||||
// This method is reserved for any future JavaScript-based enhancements
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize theme when DOM is loaded
|
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
|
||||||
new Theme();
|
|
||||||
});
|
|
@@ -1,165 +0,0 @@
|
|||||||
Fonticons, Inc. (https://fontawesome.com)
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
Font Awesome Free License
|
|
||||||
|
|
||||||
Font Awesome Free is free, open source, and GPL friendly. You can use it for
|
|
||||||
commercial projects, open source projects, or really almost whatever you want.
|
|
||||||
Full Font Awesome Free license: https://fontawesome.com/license/free.
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
# Icons: CC BY 4.0 License (https://creativecommons.org/licenses/by/4.0/)
|
|
||||||
|
|
||||||
The Font Awesome Free download is licensed under a Creative Commons
|
|
||||||
Attribution 4.0 International License and applies to all icons packaged
|
|
||||||
as SVG and JS file types.
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
# Fonts: SIL OFL 1.1 License
|
|
||||||
|
|
||||||
In the Font Awesome Free download, the SIL OFL license applies to all icons
|
|
||||||
packaged as web and desktop font files.
|
|
||||||
|
|
||||||
Copyright (c) 2024 Fonticons, Inc. (https://fontawesome.com)
|
|
||||||
with Reserved Font Name: "Font Awesome".
|
|
||||||
|
|
||||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
|
||||||
This license is copied below, and is also available with a FAQ at:
|
|
||||||
http://scripts.sil.org/OFL
|
|
||||||
|
|
||||||
SIL OPEN FONT LICENSE
|
|
||||||
Version 1.1 - 26 February 2007
|
|
||||||
|
|
||||||
PREAMBLE
|
|
||||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
|
||||||
development of collaborative font projects, to support the font creation
|
|
||||||
efforts of academic and linguistic communities, and to provide a free and
|
|
||||||
open framework in which fonts may be shared and improved in partnership
|
|
||||||
with others.
|
|
||||||
|
|
||||||
The OFL allows the licensed fonts to be used, studied, modified and
|
|
||||||
redistributed freely as long as they are not sold by themselves. The
|
|
||||||
fonts, including any derivative works, can be bundled, embedded,
|
|
||||||
redistributed and/or sold with any software provided that any reserved
|
|
||||||
names are not used by derivative works. The fonts and derivatives,
|
|
||||||
however, cannot be released under any other type of license. The
|
|
||||||
requirement for fonts to remain under this license does not apply
|
|
||||||
to any document created using the fonts or their derivatives.
|
|
||||||
|
|
||||||
DEFINITIONS
|
|
||||||
"Font Software" refers to the set of files released by the Copyright
|
|
||||||
Holder(s) under this license and clearly marked as such. This may
|
|
||||||
include source files, build scripts and documentation.
|
|
||||||
|
|
||||||
"Reserved Font Name" refers to any names specified as such after the
|
|
||||||
copyright statement(s).
|
|
||||||
|
|
||||||
"Original Version" refers to the collection of Font Software components as
|
|
||||||
distributed by the Copyright Holder(s).
|
|
||||||
|
|
||||||
"Modified Version" refers to any derivative made by adding to, deleting,
|
|
||||||
or substituting — in part or in whole — any of the components of the
|
|
||||||
Original Version, by changing formats or by porting the Font Software to a
|
|
||||||
new environment.
|
|
||||||
|
|
||||||
"Author" refers to any designer, engineer, programmer, technical
|
|
||||||
writer or other person who contributed to the Font Software.
|
|
||||||
|
|
||||||
PERMISSION & CONDITIONS
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining
|
|
||||||
a copy of the Font Software, to use, study, copy, merge, embed, modify,
|
|
||||||
redistribute, and sell modified and unmodified copies of the Font
|
|
||||||
Software, subject to the following conditions:
|
|
||||||
|
|
||||||
1) Neither the Font Software nor any of its individual components,
|
|
||||||
in Original or Modified Versions, may be sold by itself.
|
|
||||||
|
|
||||||
2) Original or Modified Versions of the Font Software may be bundled,
|
|
||||||
redistributed and/or sold with any software, provided that each copy
|
|
||||||
contains the above copyright notice and this license. These can be
|
|
||||||
included either as stand-alone text files, human-readable headers or
|
|
||||||
in the appropriate machine-readable metadata fields within text or
|
|
||||||
binary files as long as those fields can be easily viewed by the user.
|
|
||||||
|
|
||||||
3) No Modified Version of the Font Software may use the Reserved Font
|
|
||||||
Name(s) unless explicit written permission is granted by the corresponding
|
|
||||||
Copyright Holder. This restriction only applies to the primary font name as
|
|
||||||
presented to the users.
|
|
||||||
|
|
||||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
|
||||||
Software shall not be used to promote, endorse or advertise any
|
|
||||||
Modified Version, except to acknowledge the contribution(s) of the
|
|
||||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
|
||||||
permission.
|
|
||||||
|
|
||||||
5) The Font Software, modified or unmodified, in part or in whole,
|
|
||||||
must be distributed entirely under this license, and must not be
|
|
||||||
distributed under any other license. The requirement for fonts to
|
|
||||||
remain under this license does not apply to any document created
|
|
||||||
using the Font Software.
|
|
||||||
|
|
||||||
TERMINATION
|
|
||||||
This license becomes null and void if any of the above conditions are
|
|
||||||
not met.
|
|
||||||
|
|
||||||
DISCLAIMER
|
|
||||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
|
||||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
|
||||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
|
||||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
|
||||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
|
||||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
|
||||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
|
||||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
|
||||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
# Code: MIT License (https://opensource.org/licenses/MIT)
|
|
||||||
|
|
||||||
In the Font Awesome Free download, the MIT license applies to all non-font and
|
|
||||||
non-icon files.
|
|
||||||
|
|
||||||
Copyright 2024 Fonticons, Inc.
|
|
||||||
|
|
||||||
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.
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
# Attribution
|
|
||||||
|
|
||||||
Attribution is required by MIT, SIL OFL, and CC BY licenses. Downloaded Font
|
|
||||||
Awesome Free files already contain embedded comments with sufficient
|
|
||||||
attribution, so you shouldn't need to do anything additional when using these
|
|
||||||
files normally.
|
|
||||||
|
|
||||||
We've kept attribution comments terse, so we ask that you do not actively work
|
|
||||||
to remove them from files, especially code. They're a great way for folks to
|
|
||||||
learn about Font Awesome.
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
# Brand Icons
|
|
||||||
|
|
||||||
All brand icons are trademarks of their respective owners. The use of these
|
|
||||||
trademarks does not indicate endorsement of the trademark holder by Font
|
|
||||||
Awesome, nor vice versa. **Please do not use brand logos for any purpose except
|
|
||||||
to represent the company, product, or service to which they refer.**
|
|
@@ -1,6 +0,0 @@
|
|||||||
/*!
|
|
||||||
* Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com
|
|
||||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
|
||||||
* Copyright 2024 Fonticons, Inc.
|
|
||||||
*/
|
|
||||||
:host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-regular:normal 400 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:block;src:url(../webfonts/fa-regular-400.woff2) format("woff2"),url(../webfonts/fa-regular-400.ttf) format("truetype")}.fa-regular,.far{font-weight:400}
|
|
@@ -1,6 +0,0 @@
|
|||||||
/*!
|
|
||||||
* Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com
|
|
||||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
|
||||||
* Copyright 2024 Fonticons, Inc.
|
|
||||||
*/
|
|
||||||
:host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-solid:normal 900 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:block;src:url(../webfonts/fa-solid-900.woff2) format("woff2"),url(../webfonts/fa-solid-900.ttf) format("truetype")}.fa-solid,.fas{font-weight:900}
|
|
Before Width: | Height: | Size: 58 KiB |
@@ -1,99 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: 'icomoon';
|
|
||||||
src: url('fonts/icomoon.eot?mxezzh');
|
|
||||||
src: url('fonts/icomoon.eot?mxezzh#iefix') format('embedded-opentype'),
|
|
||||||
url('fonts/icomoon.ttf?mxezzh') format('truetype'),
|
|
||||||
url('fonts/icomoon.woff?mxezzh') format('woff'),
|
|
||||||
url('fonts/icomoon.svg?mxezzh#icomoon') format('svg');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
font-display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
[class^="icon-"], [class*=" icon-"] {
|
|
||||||
/* use !important to prevent issues with browser extensions that change fonts */
|
|
||||||
font-family: 'icomoon' !important;
|
|
||||||
speak: never;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: normal;
|
|
||||||
font-variant: normal;
|
|
||||||
text-transform: none;
|
|
||||||
line-height: 1;
|
|
||||||
|
|
||||||
/* Better Font Rendering =========== */
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-git:before {
|
|
||||||
content: "\e901";
|
|
||||||
}
|
|
||||||
.icon-cube:before {
|
|
||||||
content: "\e900";
|
|
||||||
}
|
|
||||||
.icon-game:before {
|
|
||||||
content: "\e9d5";
|
|
||||||
}
|
|
||||||
.icon-card:before {
|
|
||||||
content: "\e9d6";
|
|
||||||
}
|
|
||||||
.icon-book:before {
|
|
||||||
content: "\e9d7";
|
|
||||||
}
|
|
||||||
.icon-git1:before {
|
|
||||||
content: "\e9d3";
|
|
||||||
}
|
|
||||||
.icon-moji_a:before {
|
|
||||||
content: "\e9c3";
|
|
||||||
}
|
|
||||||
.icon-archlinux:before {
|
|
||||||
content: "\e9c4";
|
|
||||||
}
|
|
||||||
.icon-archlinuxjp:before {
|
|
||||||
content: "\e9c5";
|
|
||||||
}
|
|
||||||
.icon-syui:before {
|
|
||||||
content: "\e9c6";
|
|
||||||
}
|
|
||||||
.icon-phoenix-power:before {
|
|
||||||
content: "\e9c7";
|
|
||||||
}
|
|
||||||
.icon-phoenix-world:before {
|
|
||||||
content: "\e9c8";
|
|
||||||
}
|
|
||||||
.icon-power:before {
|
|
||||||
content: "\e9c9";
|
|
||||||
}
|
|
||||||
.icon-phoenix:before {
|
|
||||||
content: "\e9ca";
|
|
||||||
}
|
|
||||||
.icon-honeycomb:before {
|
|
||||||
content: "\e9cb";
|
|
||||||
}
|
|
||||||
.icon-ai:before {
|
|
||||||
content: "\e9cc";
|
|
||||||
}
|
|
||||||
.icon-robot:before {
|
|
||||||
content: "\e9cd";
|
|
||||||
}
|
|
||||||
.icon-sandar:before {
|
|
||||||
content: "\e9ce";
|
|
||||||
}
|
|
||||||
.icon-moon:before {
|
|
||||||
content: "\e9cf";
|
|
||||||
}
|
|
||||||
.icon-home:before {
|
|
||||||
content: "\e9d0";
|
|
||||||
}
|
|
||||||
.icon-cloud:before {
|
|
||||||
content: "\e9d1";
|
|
||||||
}
|
|
||||||
.icon-api:before {
|
|
||||||
content: "\e9d2";
|
|
||||||
}
|
|
||||||
.icon-aibadge:before {
|
|
||||||
content: "\ebf8";
|
|
||||||
}
|
|
||||||
.icon-aiterm:before {
|
|
||||||
content: "\ebf7";
|
|
||||||
}
|
|
@@ -1,24 +0,0 @@
|
|||||||
<svg width="77pt" height="77pt" viewBox="0 0 512 512" class="likeButton" >
|
|
||||||
<circle class="explosion" r="150" cx="250" cy="250"></circle>
|
|
||||||
<g class="particleLayer">
|
|
||||||
<circle fill="#ef454aba" cx="130" cy="126.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454acc" cx="411" cy="313.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="279" cy="86.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="155" cy="390.5" r="12.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="89" cy="292.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="414" cy="282.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454a91" cx="115" cy="149.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="250" cy="80.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="78" cy="261.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454a91" cx="182" cy="402.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="401.5" cy="166" r="13"/>
|
|
||||||
<circle fill="#ef454aba" cx="379" cy="141.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454a91" cx="327" cy="397.5" r="10.5"/>
|
|
||||||
<circle fill="#ef454aba" cx="296" cy="392.5" r="10.5"/>
|
|
||||||
</g>
|
|
||||||
<g transform="translate(0,512) scale(0.1,-0.1)" fill="#000000" class="icon_syui">
|
|
||||||
|
|
||||||
<path class="syui" d="M3660 4460 c-11 -11 -33 -47 -48 -80 l-29 -60 -12 38 c-27 88 -58 92 -98 11 -35 -70 -73 -159 -73 -169 0 -6 -5 -10 -10 -10 -6 0 -15 -10 -21 -22 -33 -73 -52 -92 -47 -48 2 26 -1 35 -14 38 -16 3 -168 -121 -168 -138 0 -5 -13 -16 -28 -24 -24 -13 -35 -12 -87 0 -221 55 -231 56 -480 56 -219 1 -247 -1 -320 -22 -44 -12 -96 -26 -115 -30 -57 -13 -122 -39 -200 -82 -8 -4 -31 -14 -50 -23 -41 -17 -34 -13 -146 -90 -87 -59 -292 -252 -351 -330 -63 -83 -143 -209 -143 -225 0 -10 -7 -23 -15 -30 -8 -7 -15 -17 -15 -22 0 -5 -13 -37 -28 -71 -16 -34 -36 -93 -45 -132 -9 -38 -24 -104 -34 -145 -13 -60 -17 -121 -17 -300 1 -224 1 -225 36 -365 24 -94 53 -175 87 -247 28 -58 51 -108 51 -112 0 -3 13 -24 28 -48 42 -63 46 -79 22 -85 -11 -3 -20 -9 -20 -14 0 -5 -4 -9 -10 -9 -5 0 -22 -11 -37 -25 -16 -13 -75 -59 -133 -100 -58 -42 -113 -82 -123 -90 -9 -8 -22 -15 -27 -15 -6 0 -10 -6 -10 -13 0 -8 -11 -20 -25 -27 -34 -18 -34 -54 0 -48 14 3 25 2 25 -1 0 -3 -43 -31 -95 -61 -52 -30 -95 -58 -95 -62 0 -5 -5 -8 -11 -8 -19 0 -84 -33 -92 -47 -4 -7 -15 -13 -22 -13 -14 0 -17 -4 -19 -32 -1 -8 15 -15 37 -18 l38 -5 -47 -48 c-56 -59 -54 -81 9 -75 30 3 45 0 54 -11 9 -13 16 -14 43 -4 29 11 30 10 18 -5 -7 -9 -19 -23 -25 -30 -7 -7 -13 -20 -13 -29 0 -12 8 -14 38 -9 20 4 57 8 82 9 25 2 54 8 66 15 18 10 23 8 32 -13 17 -38 86 -35 152 6 27 17 50 34 50 38 0 16 62 30 85 19 33 -15 72 -2 89 30 8 15 31 43 51 62 35 34 38 35 118 35 77 0 85 2 126 33 24 17 52 32 61 32 9 0 42 18 73 40 30 22 61 40 69 40 21 0 88 -26 100 -38 7 -7 17 -12 24 -12 7 0 35 -11 62 -25 66 -33 263 -84 387 -101 189 -25 372 -12 574 41 106 27 130 37 261 97 41 20 80 37 85 39 6 2 51 31 100 64 166 111 405 372 489 534 10 20 22 43 27 51 5 8 12 22 15 30 3 8 17 40 31 70 54 115 95 313 108 520 13 200 -43 480 -134 672 -28 58 -51 108 -51 112 0 3 -13 24 -29 48 -15 24 -34 60 -40 80 -19 57 3 142 50 193 10 11 22 49 28 85 6 36 16 67 21 68 18 6 31 53 25 83 -4 18 -17 33 -36 41 -16 7 -29 15 -29 18 1 10 38 50 47 50 5 0 20 11 33 25 18 19 22 31 17 61 -3 20 -14 45 -23 55 -16 18 -16 20 6 44 15 16 21 32 18 49 -3 15 1 34 8 43 32 43 7 73 -46 55 l-30 -11 0 85 c0 74 -2 84 -18 84 -21 0 -53 -33 -103 -104 l-34 -48 -5 74 c-7 102 -35 133 -80 88z m-870 -740 c36 -7 75 -14 88 -16 21 -4 23 -9 16 -37 -3 -18 -14 -43 -24 -57 -10 -14 -20 -35 -24 -46 -4 -12 -16 -32 -27 -45 -12 -13 -37 -49 -56 -79 -20 -30 -52 -73 -72 -96 -53 -60 -114 -133 -156 -189 -21 -27 -44 -54 -52 -58 -7 -4 -13 -14 -13 -22 0 -7 -18 -33 -40 -57 -22 -23 -40 -46 -40 -50 0 -5 -19 -21 -42 -38 -47 -35 -85 -38 -188 -15 -115 25 -173 20 -264 -23 -45 -22 -106 -46 -136 -56 -48 -15 -77 -25 -140 -50 -70 -28 -100 -77 -51 -84 14 -2 34 -10 45 -17 12 -7 53 -16 91 -20 90 -9 131 -22 178 -57 20 -16 52 -35 70 -43 18 -7 40 -22 49 -32 16 -18 15 -22 -24 -88 -23 -39 -47 -74 -53 -80 -7 -5 -23 -26 -36 -45 -26 -39 -92 -113 -207 -232 -4 -4 -37 -36 -73 -71 l-66 -64 -20 41 c-58 119 -105 240 -115 301 -40 244 -35 409 20 595 8 30 21 66 28 80 7 14 24 54 38 89 15 35 35 75 46 89 11 13 20 31 20 38 0 8 3 14 8 14 4 0 16 16 27 36 24 45 221 245 278 281 23 15 44 30 47 33 20 20 138 78 250 123 61 24 167 50 250 61 60 7 302 -1 370 -14z m837 -661 c52 -101 102 -279 106 -379 2 -42 0 -45 -28 -51 -16 -4 -101 -7 -187 -8 -166 -1 -229 10 -271 49 -19 19 -19 19 14 49 22 21 44 31 65 31 41 0 84 34 84 66 0 30 12 55 56 112 19 25 37 65 44 95 11 51 53 111 74 104 6 -2 25 -32 43 -68z m-662 -810 c17 -10 40 -24 53 -30 12 -7 22 -16 22 -20 0 -4 17 -13 38 -19 20 -7 44 -18 52 -24 8 -7 33 -21 55 -31 22 -11 42 -23 45 -26 11 -14 109 -49 164 -58 62 -11 101 -7 126 14 15 14 38 18 78 16 39 -2 26 -41 -49 -146 -78 -109 -85 -118 -186 -219 -61 -61 -239 -189 -281 -203 -17 -5 -73 -29 -104 -44 -187 -92 -605 -103 -791 -21 -42 19 -47 24 -37 41 5 11 28 32 51 48 22 15 51 38 64 51 13 12 28 22 33 22 17 0 242 233 242 250 0 6 5 10 10 10 6 0 10 6 10 14 0 25 50 55 100 62 59 8 56 6 115 83 50 66 74 117 75 162 0 14 7 40 16 57 18 38 52 41 99 11z"/>
|
|
||||||
</g>
|
|
||||||
|
|
||||||
</svg>
|
|
Before Width: | Height: | Size: 4.8 KiB |
@@ -1,61 +0,0 @@
|
|||||||
<!-- AT Browser Integration - Temporarily disabled to fix site display -->
|
|
||||||
<!--
|
|
||||||
<script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
|
|
||||||
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
|
|
||||||
<script src="/assets/pds-browser.umd.js"></script>
|
|
||||||
<script>
|
|
||||||
// AT Browser integration - needs debugging
|
|
||||||
console.log('AT Browser integration temporarily disabled');
|
|
||||||
</script>
|
|
||||||
-->
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* AT Browser Modal Styles */
|
|
||||||
.at-uri-modal-overlay {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-modal-content {
|
|
||||||
background-color: white;
|
|
||||||
border-radius: 8px;
|
|
||||||
max-width: 800px;
|
|
||||||
max-height: 600px;
|
|
||||||
width: 90%;
|
|
||||||
height: 80%;
|
|
||||||
overflow: auto;
|
|
||||||
position: relative;
|
|
||||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.at-uri-modal-close {
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
right: 10px;
|
|
||||||
background: none;
|
|
||||||
border: none;
|
|
||||||
font-size: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
z-index: 1001;
|
|
||||||
padding: 5px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* AT URI Link Styles */
|
|
||||||
[data-at-uri] {
|
|
||||||
color: #1976d2;
|
|
||||||
cursor: pointer;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
[data-at-uri]:hover {
|
|
||||||
color: #1565c0;
|
|
||||||
}
|
|
||||||
</style>
|
|
@@ -4,18 +4,10 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>{% block title %}{{ config.title }}{% endblock %}</title>
|
<title>{% block title %}{{ config.title }}{% endblock %}</title>
|
||||||
|
|
||||||
<!-- Favicon -->
|
|
||||||
<link rel="icon" href="/favicon.ico" />
|
|
||||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
|
||||||
|
|
||||||
<!-- Stylesheets -->
|
|
||||||
<link rel="stylesheet" href="/css/style.css">
|
<link rel="stylesheet" href="/css/style.css">
|
||||||
<link rel="stylesheet" href="/css/svg-animation-package.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||||
<link rel="stylesheet" href="/css/pds.css">
|
|
||||||
<link rel="stylesheet" href="/pkg/icomoon/style.css">
|
|
||||||
<link rel="stylesheet" href="/pkg/font-awesome/css/all.min.css">
|
|
||||||
|
|
||||||
|
{% include "oauth-assets.html" %}
|
||||||
{% block head %}{% endblock %}
|
{% block head %}{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@@ -23,75 +15,36 @@
|
|||||||
<header class="main-header">
|
<header class="main-header">
|
||||||
<div class="header-content">
|
<div class="header-content">
|
||||||
<h1><a href="/" class="site-title">{{ config.title }}</a></h1>
|
<h1><a href="/" class="site-title">{{ config.title }}</a></h1>
|
||||||
<div class="logo">
|
<div class="header-actions">
|
||||||
<a href="/">
|
<!-- Ask AI button on all pages -->
|
||||||
<svg width="77pt" height="77pt" viewBox="0 0 512 512" class="likeButton">
|
|
||||||
<circle class="explosion" r="150" cx="250" cy="250"></circle>
|
|
||||||
<g class="particleLayer">
|
|
||||||
<circle fill="#8CE8C3" cx="130" cy="126.5" r="12.5"></circle>
|
|
||||||
<circle fill="#8CE8C3" cx="411" cy="313.5" r="12.5"></circle>
|
|
||||||
<circle fill="#91D2FA" cx="279" cy="86.5" r="12.5"></circle>
|
|
||||||
<circle fill="#91D2FA" cx="155" cy="390.5" r="12.5"></circle>
|
|
||||||
<circle fill="#CC8EF5" cx="89" cy="292.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9BDFBA" cx="414" cy="282.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9BDFBA" cx="115" cy="149.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9FC7FA" cx="250" cy="80.5" r="10.5"></circle>
|
|
||||||
<circle fill="#9FC7FA" cx="78" cy="261.5" r="10.5"></circle>
|
|
||||||
<circle fill="#96D8E9" cx="182" cy="402.5" r="10.5"></circle>
|
|
||||||
<circle fill="#CC8EF5" cx="401.5" cy="166" r="13"></circle>
|
|
||||||
<circle fill="#DB92D0" cx="379" cy="141.5" r="10.5"></circle>
|
|
||||||
<circle fill="#DB92D0" cx="327" cy="397.5" r="10.5"></circle>
|
|
||||||
<circle fill="#DD99B8" cx="296" cy="392.5" r="10.5"></circle>
|
|
||||||
</g>
|
|
||||||
<g transform="translate(0,512) scale(0.1,-0.1)" fill="#000000" class="icon_syui">
|
|
||||||
<path class="syui" d="M3660 4460 c-11 -11 -33 -47 -48 -80 l-29 -60 -12 38 c-27 88 -58 92 -98 11 -35 -70 -73 -159 -73 -169 0 -6 -5 -10 -10 -10 -6 0 -15 -10 -21 -22 -33 -73 -52 -92 -47 -48 2 26 -1 35 -14 38 -16 3 -168 -121 -168 -138 0 -5 -13 -16 -28 -24 -24 -13 -35 -12 -87 0 -221 55 -231 56 -480 56 -219 1 -247 -1 -320 -22 -44 -12 -96 -26 -115 -30 -57 -13 -122 -39 -200 -82 -8 -4 -31 -14 -50 -23 -41 -17 -34 -13 -146 -90 -87 -59 -292 -252 -351 -330 -63 -83 -143 -209 -143 -225 0 -10 -7 -23 -15 -30 -8 -7 -15 -17 -15 -22 0 -5 -13 -37 -28 -71 -16 -34 -36 -93 -45 -132 -9 -38 -24 -104 -34 -145 -13 -60 -17 -121 -17 -300 1 -224 1 -225 36 -365 24 -94 53 -175 87 -247 28 -58 51 -108 51 -112 0 -3 13 -24 28 -48 42 -63 46 -79 22 -85 -11 -3 -20 -9 -20 -14 0 -5 -4 -9 -10 -9 -5 0 -22 -11 -37 -25 -16 -13 -75 -59 -133 -100 -58 -42 -113 -82 -123 -90 -9 -8 -22 -15 -27 -15 -6 0 -10 -6 -10 -13 0 -8 -11 -20 -25 -27 -34 -18 -34 -54 0 -48 14 3 25 2 25 -1 0 -3 -43 -31 -95 -61 -52 -30 -95 -58 -95 -62 0 -5 -5 -8 -11 -8 -19 0 -84 -33 -92 -47 -4 -7 -15 -13 -22 -13 -14 0 -17 -4 -19 -32 -1 -8 15 -15 37 -18 l38 -5 -47 -48 c-56 -59 -54 -81 9 -75 30 3 45 0 54 -11 9 -13 16 -14 43 -4 29 11 30 10 18 -5 -7 -9 -19 -23 -25 -30 -7 -7 -13 -20 -13 -29 0 -12 8 -14 38 -9 20 4 57 8 82 9 25 2 54 8 66 15 18 10 23 8 32 -13 17 -38 86 -35 152 6 27 17 50 34 50 38 0 16 62 30 85 19 33 -15 72 -2 89 30 8 15 31 43 51 62 35 34 38 35 118 35 77 0 85 2 126 33 24 17 52 32 61 32 9 0 42 18 73 40 30 22 61 40 69 40 21 0 88 -26 100 -38 7 -7 17 -12 24 -12 7 0 35 -11 62 -25 66 -33 263 -84 387 -101 189 -25 372 -12 574 41 106 27 130 37 261 97 41 20 80 37 85 39 6 2 51 31 100 64 166 111 405 372 489 534 10 20 22 43 27 51 5 8 12 22 15 30 3 8 17 40 31 70 54 115 95 313 108 520 13 200 -43 480 -134 672 -28 58 -51 108 -51 112 0 3 -13 24 -29 48 -15 24 -34 60 -40 80 -19 57 3 142 50 193 10 11 22 49 28 85 6 36 16 67 21 68 18 6 31 53 25 83 -4 18 -17 33 -36 41 -16 7 -29 15 -29 18 1 10 38 50 47 50 5 0 20 11 33 25 18 19 22 31 17 61 -3 20 -14 45 -23 55 -16 18 -16 20 6 44 15 16 21 32 18 49 -3 15 1 34 8 43 32 43 7 73 -46 55 l-30 -11 0 85 c0 74 -2 84 -18 84 -21 0 -53 -33 -103 -104 l-34 -48 -5 74 c-7 102 -35 133 -80 88z m-870 -740 c36 -7 75 -14 88 -16 21 -4 23 -9 16 -37 -3 -18 -14 -43 -24 -57 -10 -14 -20 -35 -24 -46 -4 -12 -16 -32 -27 -45 -12 -13 -37 -49 -56 -79 -20 -30 -52 -73 -72 -96 -53 -60 -114 -133 -156 -189 -21 -27 -44 -54 -52 -58 -7 -4 -13 -14 -13 -22 0 -7 -18 -33 -40 -57 -22 -23 -40 -46 -40 -50 0 -5 -19 -21 -42 -38 -47 -35 -85 -38 -188 -15 -115 25 -173 20 -264 -23 -45 -22 -106 -46 -136 -56 -48 -15 -77 -25 -140 -50 -70 -28 -100 -77 -51 -84 14 -2 34 -10 45 -17 12 -7 53 -16 91 -20 90 -9 131 -22 178 -57 20 -16 52 -35 70 -43 18 -7 40 -22 49 -32 16 -18 15 -22 -24 -88 -23 -39 -47 -74 -53 -80 -7 -5 -23 -26 -36 -45 -26 -39 -92 -113 -207 -232 -4 -4 -37 -36 -73 -71 l-66 -64 -20 41 c-58 119 -105 240 -115 301 -40 244 -35 409 20 595 8 30 21 66 28 80 7 14 24 54 38 89 15 35 35 75 46 89 11 13 20 31 20 38 0 8 3 14 8 14 4 0 16 16 27 36 24 45 221 245 278 281 23 15 44 30 47 33 20 20 138 78 250 123 61 24 167 50 250 61 60 7 302 -1 370 -14z m837 -661 c52 -101 102 -279 106 -379 2 -42 0 -45 -28 -51 -16 -4 -101 -7 -187 -8 -166 -1 -229 10 -271 49 -19 19 -19 19 14 49 22 21 44 31 65 31 41 0 84 34 84 66 0 30 12 55 56 112 19 25 37 65 44 95 11 51 53 111 74 104 6 -2 25 -32 43 -68z m-662 -810 c17 -10 40 -24 53 -30 12 -7 22 -16 22 -20 0 -4 17 -13 38 -19 20 -7 44 -18 52 -24 8 -7 33 -21 55 -31 22 -11 42 -23 45 -26 11 -14 109 -49 164 -58 62 -11 101 -7 126 14 15 14 38 18 78 16 39 -2 26 -41 -49 -146 -78 -109 -85 -118 -186 -219 -61 -61 -239 -189 -281 -203 -17 -5 -73 -29 -104 -44 -187 -92 -605 -103 -791 -21 -42 19 -47 24 -37 41 5 11 28 32 51 48 22 15 51 38 64 51 13 12 28 22 33 22 17 0 242 233 242 250 0 6 5 10 10 10 6 0 10 6 10 14 0 25 50 55 100 62 59 8 56 6 115 83 50 66 74 117 75 162 0 14 7 40 16 57 18 38 52 41 99 11z"></path>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="header-actions">
|
|
||||||
<!-- User Handle Input Form -->
|
|
||||||
<div class="pds-search-section">
|
|
||||||
<form class="pds-search-form" onsubmit="searchUser(); return false;">
|
|
||||||
<div class="form-group">
|
|
||||||
<input type="text" id="handleInput" placeholder="at://syui.ai" value="syui.ai" />
|
|
||||||
<button type="submit" id="searchButton" class="pds-btn">
|
|
||||||
@
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<button class="ask-ai-btn" onclick="toggleAskAI()" id="askAiButton">
|
<button class="ask-ai-btn" onclick="toggleAskAI()" id="askAiButton">
|
||||||
<span class="ai-icon icon-ai"></span>
|
<span class="ai-icon">🤖</span>
|
||||||
ai
|
Ask AI
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<!-- Ask AI Panel -->
|
<!-- Ask AI panel on all pages -->
|
||||||
<div class="ask-ai-panel" id="askAiPanel" style="display: none;">
|
<div class="ask-ai-panel" id="askAiPanel" style="display: none;">
|
||||||
<div class="ask-ai-content">
|
<div class="ask-ai-content">
|
||||||
|
<!-- Authentication check -->
|
||||||
<div id="authCheck" class="auth-check">
|
<div id="authCheck" class="auth-check">
|
||||||
<div class="loading-content">
|
<p>🔒 Please login with ATProto to use Ask AI feature</p>
|
||||||
<div class="loading-spinner"></div>
|
|
||||||
<p>Loading...</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Chat form (hidden until authenticated) -->
|
||||||
<div id="chatForm" class="ask-ai-form" style="display: none;">
|
<div id="chatForm" class="ask-ai-form" style="display: none;">
|
||||||
<input type="text" id="aiQuestion" placeholder="What would you like to know?" />
|
<input type="text" id="aiQuestion" placeholder="What would you like to know?" />
|
||||||
<button onclick="askQuestion()" id="askButton">Ask</button>
|
<button onclick="askQuestion()" id="askButton">Ask</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Chat history -->
|
||||||
<div id="chatHistory" class="chat-history" style="display: none;"></div>
|
<div id="chatHistory" class="chat-history" style="display: none;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<main class="main-content">
|
<main class="main-content">
|
||||||
<!-- Pds Panel -->
|
|
||||||
{% include "pds-header.html" %}
|
|
||||||
|
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
@@ -99,54 +52,309 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer class="main-footer">
|
<footer class="main-footer">
|
||||||
<div class="footer-social">
|
<p>© {{ config.author }}</p>
|
||||||
<a href="https://syu.is/syui" target="_blank"><i class="fab fa-bluesky"></i></a>
|
|
||||||
<a href="https://git.syui.ai/ai" target="_blank"><span class="icon-ai"></span></a>
|
|
||||||
<a href="https://github.com/syui" target="_blank"><i class="fab fa-github"></i></a>
|
|
||||||
</div>
|
|
||||||
<p>© {{ config.author }}</p>
|
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// Config variables from Hugo
|
function toggleAskAI() {
|
||||||
window.OAUTH_CONFIG = {
|
const panel = document.getElementById('askAiPanel');
|
||||||
{% if config.oauth.pds %}
|
const isVisible = panel.style.display !== 'none';
|
||||||
pds: "{{ config.oauth.pds }}",
|
panel.style.display = isVisible ? 'none' : 'block';
|
||||||
{% else %}
|
|
||||||
pds: "syu.is",
|
if (!isVisible) {
|
||||||
{% endif %}
|
checkAuthenticationStatus();
|
||||||
{% if config.oauth.admin %}
|
}
|
||||||
admin: "{{ config.oauth.admin }}",
|
}
|
||||||
{% else %}
|
|
||||||
admin: "ai.syui.ai",
|
function checkAuthenticationStatus() {
|
||||||
{% endif %}
|
const userSections = document.querySelectorAll('.user-section');
|
||||||
{% if config.oauth.collection %}
|
const isAuthenticated = userSections.length > 0;
|
||||||
collection: "{{ config.oauth.collection }}"
|
|
||||||
{% else %}
|
if (isAuthenticated) {
|
||||||
collection: "ai.syui.log"
|
// User is authenticated - show Ask AI UI
|
||||||
{% endif %}
|
document.getElementById('authCheck').style.display = 'none';
|
||||||
};
|
document.getElementById('chatForm').style.display = 'block';
|
||||||
</script>
|
document.getElementById('chatHistory').style.display = 'block';
|
||||||
<script src="/js/ask-ai.js"></script>
|
|
||||||
<script src="/js/pds.js"></script>
|
// Show initial greeting if chat history is empty
|
||||||
<script src="/js/theme.js"></script>
|
const chatHistory = document.getElementById('chatHistory');
|
||||||
<script src="/js/image-comparison.js"></script>
|
if (chatHistory.children.length === 0) {
|
||||||
|
showInitialGreeting();
|
||||||
<!-- Mermaid support -->
|
}
|
||||||
<script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
|
|
||||||
<script>
|
// Focus after a small delay to ensure element is visible
|
||||||
mermaid.initialize({
|
setTimeout(() => {
|
||||||
startOnLoad: true,
|
document.getElementById('aiQuestion').focus();
|
||||||
theme: 'neutral',
|
}, 50);
|
||||||
securityLevel: 'loose',
|
} else {
|
||||||
themeVariables: {
|
// User is not authenticated - show login message only
|
||||||
fontFamily: 'system-ui, -apple-system, sans-serif',
|
document.getElementById('authCheck').style.display = 'block';
|
||||||
fontSize: '14px'
|
document.getElementById('chatForm').style.display = 'none';
|
||||||
|
document.getElementById('chatHistory').style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let isAIChatReady = false;
|
||||||
|
let aiProfileData = null;
|
||||||
|
|
||||||
|
// Listen for AI ready signal
|
||||||
|
window.addEventListener('aiChatReady', function() {
|
||||||
|
isAIChatReady = true;
|
||||||
|
console.log('AI Chat is ready');
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// Listen for AI profile updates from OAuth app
|
||||||
|
window.addEventListener('aiProfileLoaded', function(event) {
|
||||||
|
aiProfileData = event.detail;
|
||||||
|
console.log('AI profile loaded:', aiProfileData);
|
||||||
|
updateAskAIButton();
|
||||||
|
});
|
||||||
|
|
||||||
|
function updateAskAIButton() {
|
||||||
|
const button = document.getElementById('askAiButton');
|
||||||
|
const iconSpan = button.querySelector('.ai-icon');
|
||||||
|
|
||||||
|
if (aiProfileData && aiProfileData.avatar) {
|
||||||
|
iconSpan.innerHTML = `<img src="${aiProfileData.avatar}" alt="${aiProfileData.displayName || 'AI'}" class="ai-avatar-small">`;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (aiProfileData && aiProfileData.displayName) {
|
||||||
|
button.childNodes[2].textContent = `Ask ${aiProfileData.displayName}`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function showInitialGreeting() {
|
||||||
|
const chatHistory = document.getElementById('chatHistory');
|
||||||
|
const greetingDiv = document.createElement('div');
|
||||||
|
greetingDiv.className = 'chat-message ai-message comment-style initial-greeting';
|
||||||
|
|
||||||
|
if (!aiProfileData) {
|
||||||
|
return; // Don't show greeting if no AI profile data
|
||||||
|
}
|
||||||
|
|
||||||
|
let avatarElement = '🤖';
|
||||||
|
if (aiProfileData.avatar) {
|
||||||
|
avatarElement = `<img src="${aiProfileData.avatar}" alt="${aiProfileData.displayName}" class="profile-avatar">`;
|
||||||
|
}
|
||||||
|
|
||||||
|
const displayName = aiProfileData.displayName;
|
||||||
|
const handle = aiProfileData.handle;
|
||||||
|
|
||||||
|
greetingDiv.innerHTML = `
|
||||||
|
<div class="message-header">
|
||||||
|
<div class="avatar">${avatarElement}</div>
|
||||||
|
<div class="user-info">
|
||||||
|
<div class="display-name">${displayName}</div>
|
||||||
|
<div class="handle">@${handle}</div>
|
||||||
|
<div class="timestamp">${new Date().toLocaleString()}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="message-content">
|
||||||
|
Hello! I'm an AI assistant trained on this blog's content. I can answer questions about the articles, provide insights, and help you understand the topics discussed here. What would you like to know?
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
chatHistory.appendChild(greetingDiv);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function askQuestion() {
|
||||||
|
const question = document.getElementById('aiQuestion').value;
|
||||||
|
const chatHistory = document.getElementById('chatHistory');
|
||||||
|
const askButton = document.getElementById('askButton');
|
||||||
|
|
||||||
|
if (!question.trim()) return;
|
||||||
|
|
||||||
|
// Wait for AI to be ready
|
||||||
|
if (!isAIChatReady) {
|
||||||
|
console.log('Waiting for AI Chat to be ready...');
|
||||||
|
await new Promise(resolve => {
|
||||||
|
const checkReady = setInterval(() => {
|
||||||
|
if (isAIChatReady) {
|
||||||
|
clearInterval(checkReady);
|
||||||
|
resolve();
|
||||||
|
}
|
||||||
|
}, 100);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disable button and show loading
|
||||||
|
askButton.disabled = true;
|
||||||
|
askButton.textContent = 'Posting...';
|
||||||
|
|
||||||
|
// Get user info from OAuth component
|
||||||
|
const userSection = document.querySelector('.user-section');
|
||||||
|
let userAvatar = '👤';
|
||||||
|
let userDisplay = 'You';
|
||||||
|
let userHandle = 'user';
|
||||||
|
|
||||||
|
if (userSection) {
|
||||||
|
const avatarImg = userSection.querySelector('.user-avatar');
|
||||||
|
const displayName = userSection.querySelector('.user-display-name');
|
||||||
|
const handle = userSection.querySelector('.user-handle');
|
||||||
|
|
||||||
|
if (avatarImg && avatarImg.src) {
|
||||||
|
userAvatar = `<img src="${avatarImg.src}" alt="${displayName?.textContent || 'User'}" class="profile-avatar">`;
|
||||||
|
}
|
||||||
|
if (displayName?.textContent) {
|
||||||
|
userDisplay = displayName.textContent;
|
||||||
|
}
|
||||||
|
if (handle?.textContent) {
|
||||||
|
userHandle = handle.textContent.replace('@', '');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add question to chat history in comment style
|
||||||
|
const questionDiv = document.createElement('div');
|
||||||
|
questionDiv.className = 'chat-message user-message comment-style';
|
||||||
|
questionDiv.innerHTML = `
|
||||||
|
<div class="message-header">
|
||||||
|
<div class="avatar">${userAvatar}</div>
|
||||||
|
<div class="user-info">
|
||||||
|
<div class="display-name">${userDisplay}</div>
|
||||||
|
<div class="handle">@${userHandle}</div>
|
||||||
|
<div class="timestamp">${new Date().toLocaleString()}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="message-content">${question}</div>
|
||||||
|
`;
|
||||||
|
chatHistory.appendChild(questionDiv);
|
||||||
|
|
||||||
|
// Clear input
|
||||||
|
document.getElementById('aiQuestion').value = '';
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Show loading immediately
|
||||||
|
const loadingDiv = document.createElement('div');
|
||||||
|
loadingDiv.className = 'ai-loading-simple';
|
||||||
|
loadingDiv.innerHTML = `
|
||||||
|
<i class="fas fa-robot"></i>
|
||||||
|
<span>考えています</span>
|
||||||
|
<i class="fas fa-spinner fa-spin"></i>
|
||||||
|
`;
|
||||||
|
chatHistory.appendChild(loadingDiv);
|
||||||
|
|
||||||
|
// Post question to ATProto via OAuth app
|
||||||
|
const event = new CustomEvent('postAIQuestion', {
|
||||||
|
detail: { question: question }
|
||||||
|
});
|
||||||
|
window.dispatchEvent(event);
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
// Remove loading indicator and show error
|
||||||
|
const loadingMsg = chatHistory.querySelector('.ai-loading-simple');
|
||||||
|
if (loadingMsg) {
|
||||||
|
loadingMsg.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
const errorDiv = document.createElement('div');
|
||||||
|
errorDiv.className = 'chat-message error-message comment-style';
|
||||||
|
errorDiv.innerHTML = `
|
||||||
|
<div class="message-header">
|
||||||
|
<div class="avatar">⚠️</div>
|
||||||
|
<div class="user-info">
|
||||||
|
<div class="display-name">System</div>
|
||||||
|
<div class="handle">@system</div>
|
||||||
|
<div class="timestamp">${new Date().toLocaleString()}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="message-content">Sorry, I encountered an error. Please try again.</div>
|
||||||
|
`;
|
||||||
|
chatHistory.appendChild(errorDiv);
|
||||||
|
} finally {
|
||||||
|
askButton.disabled = false;
|
||||||
|
askButton.textContent = 'Ask';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('keydown', function(e) {
|
||||||
|
if (e.key === 'Escape') {
|
||||||
|
document.getElementById('askAiPanel').style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Enter key to send message
|
||||||
|
if (e.key === 'Enter' && e.target.id === 'aiQuestion' && !e.shiftKey) {
|
||||||
|
e.preventDefault();
|
||||||
|
askQuestion();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Monitor authentication state changes
|
||||||
|
const authObserver = new MutationObserver(function(mutations) {
|
||||||
|
const userSections = document.querySelectorAll('.user-section');
|
||||||
|
if (userSections.length > 0) {
|
||||||
|
checkAuthenticationStatus();
|
||||||
|
// Stop observing once authenticated
|
||||||
|
authObserver.disconnect();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Start observing for authentication changes
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
// Initial authentication check with slight delay for OAuth component
|
||||||
|
setTimeout(() => {
|
||||||
|
checkAuthenticationStatus();
|
||||||
|
}, 500);
|
||||||
|
|
||||||
|
authObserver.observe(document.body, {
|
||||||
|
childList: true,
|
||||||
|
subtree: true
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Listen for AI responses from OAuth app
|
||||||
|
window.addEventListener('aiResponseReceived', function(event) {
|
||||||
|
const chatHistory = document.getElementById('chatHistory');
|
||||||
|
const loadingMsg = chatHistory.querySelector('.ai-loading-simple');
|
||||||
|
|
||||||
|
if (loadingMsg) {
|
||||||
|
loadingMsg.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
const aiProfile = event.detail.aiProfile;
|
||||||
|
if (!aiProfile || !aiProfile.handle || !aiProfile.displayName) {
|
||||||
|
console.error('AI profile data is missing, cannot display response');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const timestamp = new Date(event.detail.timestamp || Date.now());
|
||||||
|
|
||||||
|
// Create comment-style AI response
|
||||||
|
const answerDiv = document.createElement('div');
|
||||||
|
answerDiv.className = 'chat-message ai-message comment-style';
|
||||||
|
|
||||||
|
// Prepare avatar
|
||||||
|
let avatarElement = '🤖';
|
||||||
|
if (aiProfile.avatar) {
|
||||||
|
avatarElement = `<img src="${aiProfile.avatar}" alt="${aiProfile.displayName}" class="profile-avatar">`;
|
||||||
|
}
|
||||||
|
|
||||||
|
answerDiv.innerHTML = `
|
||||||
|
<div class="message-header">
|
||||||
|
<div class="avatar">${avatarElement}</div>
|
||||||
|
<div class="user-info">
|
||||||
|
<div class="display-name">${aiProfile.displayName}</div>
|
||||||
|
<div class="handle">@${aiProfile.handle}</div>
|
||||||
|
<div class="timestamp">${timestamp.toLocaleString()}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="message-content">${event.detail.answer}</div>
|
||||||
|
`;
|
||||||
|
chatHistory.appendChild(answerDiv);
|
||||||
|
|
||||||
|
// Auto-expand content instead of scrolling
|
||||||
|
if (chatHistory.children.length > 5) {
|
||||||
|
const oldestMessage = chatHistory.children[0];
|
||||||
|
if (oldestMessage && oldestMessage.classList.contains('user-message')) {
|
||||||
|
// Keep the latest 5 exchanges (10 messages)
|
||||||
|
if (chatHistory.children.length > 10) {
|
||||||
|
chatHistory.removeChild(oldestMessage);
|
||||||
|
if (chatHistory.children.length > 0) {
|
||||||
|
chatHistory.removeChild(chatHistory.children[0]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{% include "oauth-assets.html" %}
|
|
||||||
{% include "at-browser-assets.html" %}
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
@@ -1,135 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}Game - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
<div id="gameContainer" class="game-container">
|
|
||||||
<div id="gameAuth" class="game-auth-section">
|
|
||||||
<h1>Login to Play</h1>
|
|
||||||
<p>Please authenticate with your AT Protocol account to access the game.</p>
|
|
||||||
<div id="authRoot"></div>
|
|
||||||
</div>
|
|
||||||
<div id="gameFrame" class="game-frame-container" style="display: none;">
|
|
||||||
<iframe
|
|
||||||
id="pixelStreamingFrame"
|
|
||||||
src="https://verse.syui.ai/simple-noui.html"
|
|
||||||
frameborder="0"
|
|
||||||
allowfullscreen
|
|
||||||
allow="microphone; camera; fullscreen; autoplay"
|
|
||||||
class="pixel-streaming-iframe"
|
|
||||||
></iframe>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* Game specific styles */
|
|
||||||
.game-container {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
background: #000;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
height: 100vh;
|
|
||||||
background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section h1 {
|
|
||||||
font-size: 2.5em;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section p {
|
|
||||||
font-size: 1.2em;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
color: #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-frame-container {
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pixel-streaming-iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Override auth button for game page */
|
|
||||||
.game-auth-section .auth-section {
|
|
||||||
background: transparent;
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game-auth-section .auth-button {
|
|
||||||
font-size: 1.2em;
|
|
||||||
padding: 12px 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide header and footer on game page */
|
|
||||||
body:has(.game-container) header,
|
|
||||||
body:has(.game-container) footer,
|
|
||||||
body:has(.game-container) nav {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove any body padding/margin for full screen game */
|
|
||||||
body:has(.game-container) {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// Wait for OAuth component to be loaded
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// Check if user is already authenticated
|
|
||||||
const checkAuthStatus = () => {
|
|
||||||
// Check if OAuth components are available and user is authenticated
|
|
||||||
if (window.currentUser && window.currentAgent) {
|
|
||||||
showGame();
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Show game iframe
|
|
||||||
const showGame = () => {
|
|
||||||
document.getElementById('gameAuth').style.display = 'none';
|
|
||||||
document.getElementById('gameFrame').style.display = 'block';
|
|
||||||
};
|
|
||||||
|
|
||||||
// Listen for OAuth success
|
|
||||||
window.addEventListener('oauth-success', function(event) {
|
|
||||||
console.log('OAuth success:', event.detail);
|
|
||||||
showGame();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Check auth status on load
|
|
||||||
if (!checkAuthStatus()) {
|
|
||||||
// Check periodically if OAuth components are loaded
|
|
||||||
const authCheckInterval = setInterval(() => {
|
|
||||||
if (checkAuthStatus()) {
|
|
||||||
clearInterval(authCheckInterval);
|
|
||||||
}
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Include OAuth assets -->
|
|
||||||
{% include "oauth-assets.html" %}
|
|
||||||
{% endblock %}
|
|
@@ -12,12 +12,6 @@
|
|||||||
{% if post.language %}
|
{% if post.language %}
|
||||||
<span class="post-lang">{{ post.language }}</span>
|
<span class="post-lang">{{ post.language }}</span>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if post.extra and post.extra.type == "ai" %}
|
|
||||||
<span class="post-ai">
|
|
||||||
<span class="ai-icon icon-ai"></span>
|
|
||||||
ai
|
|
||||||
</span>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -26,6 +20,19 @@
|
|||||||
<a href="{{ post.url }}">{{ post.title }}</a>
|
<a href="{{ post.url }}">{{ post.title }}</a>
|
||||||
</h3>
|
</h3>
|
||||||
|
|
||||||
|
{% if post.excerpt %}
|
||||||
|
<p class="post-excerpt">{{ post.excerpt }}</p>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<div class="post-actions">
|
||||||
|
<a href="{{ post.url }}" class="read-more">Read more</a>
|
||||||
|
{% if post.markdown_url %}
|
||||||
|
<a href="{{ post.markdown_url }}" class="view-markdown" title="View Markdown">Markdown</a>
|
||||||
|
{% endif %}
|
||||||
|
{% if post.translation_url %}
|
||||||
|
<a href="{{ post.translation_url }}" class="view-translation" title="View Translation">🌐</a>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
@@ -1,3 +1,3 @@
|
|||||||
<!-- OAuth Comment System - Load globally for session management -->
|
<!-- OAuth Comment System - Load globally for session management -->
|
||||||
<script type="module" crossorigin src="/assets/comment-atproto-93YR1Hl3.js"></script>
|
<script type="module" crossorigin src="/assets/comment-atproto-MOwlkOMr.js"></script>
|
||||||
<link rel="stylesheet" crossorigin href="/assets/comment-atproto-rDV6HevJ.css">
|
<link rel="stylesheet" crossorigin href="/assets/comment-atproto-B330B6QX.css">
|
@@ -1,48 +0,0 @@
|
|||||||
<div class="pds-container">
|
|
||||||
<div class="pds-header">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Current User DID -->
|
|
||||||
<div id="userDidSection" class="user-did-section" style="display: none;">
|
|
||||||
<div class="pds-display">
|
|
||||||
<strong>PDS:</strong> <span id="userPdsText"></span>
|
|
||||||
</div>
|
|
||||||
<div class="handle-display">
|
|
||||||
<strong>Handle:</strong> <span id="userHandleText"></span>
|
|
||||||
</div>
|
|
||||||
<div class="did-display">
|
|
||||||
<span id="userDidText"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Collection List -->
|
|
||||||
<div id="collectionsSection" class="collections-section" style="display: none;">
|
|
||||||
<div class="collections-header">
|
|
||||||
<button id="collectionsToggle" class="collections-toggle" onclick="toggleCollections()">[+] Collections</button>
|
|
||||||
</div>
|
|
||||||
<div id="collectionsList" class="collections-list" style="display: none;">
|
|
||||||
<!-- Collections will be populated here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- AT URI Records -->
|
|
||||||
<div id="recordsSection" class="records-section" style="display: none;">
|
|
||||||
<div id="recordsList" class="records-list">
|
|
||||||
<!-- Records will be populated here -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- AT URI Modal -->
|
|
||||||
<div id="atUriModal" class="at-uri-modal-overlay" style="display: none;" onclick="closeAtUriModal(event)">
|
|
||||||
<div class="at-uri-modal-content">
|
|
||||||
<button class="at-uri-modal-close" onclick="closeAtUriModal()">×</button>
|
|
||||||
<div id="atUriContent"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
@@ -1,6 +0,0 @@
|
|||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
{% block title %}at-uri browser - {{ config.title }}{% endblock %}
|
|
||||||
|
|
||||||
{% block content %}
|
|
||||||
{% endblock %}
|
|
@@ -16,7 +16,7 @@
|
|||||||
<div class="article-actions">
|
<div class="article-actions">
|
||||||
{% if post.markdown_url %}
|
{% if post.markdown_url %}
|
||||||
<a href="{{ post.markdown_url }}" class="action-btn markdown-btn" title="View Markdown">
|
<a href="{{ post.markdown_url }}" class="action-btn markdown-btn" title="View Markdown">
|
||||||
.md
|
📝 Markdown
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if post.translation_url %}
|
{% if post.translation_url %}
|
||||||
|