oSoWoSo/DistroHopper
1
0
Fork 0
mirror of https://github.com/oSoWoSo/DistroHopper.git synced 2026-06-14 09:32:21 +00:00
Code Issues Projects Releases Packages Wiki Activity
DistroHopper/web-create
zenobit c4fcb6ff91 Prepare release and new website
2026-05-27 17:00:06 +02:00

1466 lines
51 KiB
Bash
Executable file
Raw Permalink Blame History

#!/usr/bin/env bash
#shellcheck disable=SC2089
#
# Make website from .md files
#
# Author: zenobit <zen@duck.com>
# Date: February 14, 2026
# License: MIT
#
BUILD_VERSION='0.0.5'
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
SRC_DIR="${SRC_DIR:-website-source}"
OUT_DIR="${OUT_DIR:-website}"
PUBLIC_DIR="${PUBLIC_DIR:-public}"
# Source shared functions
# shellcheck source=lib.sh
source "${SCRIPT_DIR}/lib.sh"
# Load .env — project dir takes priority
check_variables() {
if [ -z "$TITLE" ]; then
return 1
fi
}
if [ -f ".env" ]; then
source ".env"
check_variables && echo 'Using .env'
elif [ -f "${SRC_DIR}/.env" ]; then
source "${SRC_DIR}/.env"
check_variables && echo 'Using ${SRC_DIR}/.env'
elif [ -f "${SCRIPT_DIR}/.env" ]; then
source "${SCRIPT_DIR}/.env"
check_variables && echo 'Using .env'
fi
# ---------------------------------------------------------------------------
# Repo detection
# ---------------------------------------------------------------------------
_is_gitea() {
local base_url="$1"
local response
response=$(curl -sfL --max-time 5 "${base_url}/api/v1/meta" 2>/dev/null)
[[ "$response" =~ \"version\" ]] && return 0
return 1
}
_detect_repo() {
if ! git rev-parse --git-dir >/dev/null 2>&1; then
_r "Not a git repository — repo buttons will be disabled"
REPO_URL="" REPO_PLATFORM="" REPO_ZIP_URL="" REPO_RELEASE_URL=""
return
fi
# Prefer SSH remote over HTTPS if available
local raw ssh_remote https_remote
while IFS= read -r remote; do
local url
url=$(git remote get-url "$remote" 2>/dev/null)
if [[ "$url" =~ ^git@ || "$url" =~ ^ssh:// ]]; then
ssh_remote="$url"
break
else
https_remote="${https_remote:-$url}"
fi
done < <(git remote)
raw="${ssh_remote:-$https_remote}"
if [ -z "$raw" ]; then
_r "No git remote found — repo buttons will be disabled"
REPO_URL="" REPO_PLATFORM="" REPO_ZIP_URL="" REPO_RELEASE_URL=""
return
fi
# Normalize SSH → HTTPS
local https_url
if [[ "$raw" =~ ^git@ ]]; then
https_url=$(echo "$raw" | sed 's|git@\(.*\):\(.*\)\.git|https://\1/\2|; s|git@\(.*\):\(.*\)|https://\1/\2|')
elif [[ "$raw" =~ ^ssh:// ]]; then
https_url=$(echo "$raw" | sed 's|ssh://git@\(.*\)|https://\1|')
else
https_url="${raw%.git}"
fi
local base_url slug
base_url=$(echo "$https_url" | sed 's|\(https\?://[^/]*\).*|\1|')
slug="${https_url#"${base_url}"/}"
if [[ "$https_url" =~ github\.com ]]; then
REPO_PLATFORM="github"
REPO_URL="$https_url"
REPO_ZIP_URL="${https_url}/archive/refs/heads/main.zip"
REPO_RELEASE_URL="${https_url}/releases/latest"
elif [[ "$https_url" =~ gitlab\.com ]]; then
REPO_PLATFORM="gitlab"
REPO_URL="$https_url"
local proj_path
proj_path="${https_url#https://gitlab.com/}"
REPO_ZIP_URL="https://gitlab.com/${proj_path}/-/archive/main/${proj_path##*/}-main.zip"
REPO_RELEASE_URL="${https_url}/-/releases"
elif [[ "$https_url" =~ codeberg\.org ]]; then
REPO_PLATFORM="gitea"
REPO_URL="$https_url"
REPO_ZIP_URL="${https_url}/archive/main.zip"
REPO_RELEASE_URL="${https_url}/releases/latest"
printf "%-12s %s\n" "Forgejo:" "$REPO_URL"
_check_release
return
else
local forge_base="${FORGE_URL:-}"
if [ -n "$forge_base" ]; then
_b "FORGE_URL override: $forge_base"
REPO_PLATFORM="gitea"
elif _is_gitea "$base_url"; then
printf "%-12s %s\n" "Gitea:" "$base_url"
forge_base="$base_url"
REPO_PLATFORM="gitea"
else
_y "Unknown platform — only source link will be shown"
REPO_PLATFORM="other"
REPO_URL="$https_url"
REPO_ZIP_URL=""
REPO_RELEASE_URL=""
_check_release
return
fi
REPO_URL="$https_url"
REPO_ZIP_URL="${forge_base}/${slug}/archive/main.zip"
REPO_RELEASE_URL="${https_url}/releases/latest"
fi
printf "%-12s %s\n" "${REPO_PLATFORM}:" "$slug"
_check_release
}
_check_release() {
REPO_HAS_RELEASE=0
[ -z "$REPO_URL" ] && return
local base_url slug http_code body
base_url=$(echo "$REPO_URL" | sed 's|\(https\?://[^/]*\).*|\1|')
slug="${REPO_URL#"${base_url}"/}"
case "$REPO_PLATFORM" in
github)
http_code=$(curl -sf -o /dev/null -w "%{http_code}" \
-H "Accept: application/vnd.github+json" \
${GITHUB_TOKEN:+-H "Authorization: Bearer ${GITHUB_TOKEN}"} \
"https://api.github.com/repos/${slug}/releases/latest" 2>/dev/null)
[ "$http_code" = "200" ] && REPO_HAS_RELEASE=1
;;
gitlab)
local encoded_slug
encoded_slug="${slug//\//%2F}"
body=$(curl -sf \
"https://gitlab.com/api/v4/projects/${encoded_slug}/releases?per_page=1" 2>/dev/null)
[ -n "$body" ] && [ "$body" != "[]" ] && REPO_HAS_RELEASE=1
;;
gitea)
body=$(curl -sf --max-time 5 \
"${base_url}/api/v1/repos/${slug}/releases?limit=1" 2>/dev/null)
[ -n "$body" ] && [ "$body" != "[]" ] && [ "$body" != "null" ] && REPO_HAS_RELEASE=1
;;
*)
REPO_HAS_RELEASE=0
;;
esac
if [ "$REPO_HAS_RELEASE" = "1" ]; then
printf "%-12s %s\n" "Release:" "found"
else
printf "%-12s ${RED}%s${NC}\n" "Release:" "No"
fi
}
# ---------------------------------------------------------------------------
# HTML builders
# ---------------------------------------------------------------------------
add_validation() {
echo '
<p>
<a href="https://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
src="https://jigsaw.w3.org/css-validator/images/vcss-blue"
alt="Valid CSS!" />
</a>
</p>
' >> "$output"
}
# Build main nav for root pages
# Includes links to subdirs defined in SUBDIRS
_build_nav() {
local current="$1"
local nav_file="$2"
echo '<nav><ul>' > "$nav_file"
if [ -n "${NAV_EXTRA_LINK_URL:-}" ]; then
echo " <li><a href=\"${NAV_EXTRA_LINK_URL}\">${NAV_EXTRA_LINK_TEXT:-${NAV_EXTRA_LINK_URL}}</a></li>" >> "$nav_file"
fi
echo " <li>⏮️</li>" >> "$nav_file"
local home_active=""
[ "$current" = "index" ] && home_active=' class="active"'
echo " <li><a href=\"index.html\"${home_active}>Home</a></li>" >> "$nav_file"
if [ -n "$REPO_RELEASE_URL" ]; then
if [ "${REPO_HAS_RELEASE:-0}" = "1" ]; then
echo " <li><a href=\"${REPO_RELEASE_URL}\">⏬ release</a></li>" >> "$nav_file"
else
echo " <li><a class=\"no-release\" href=\"${REPO_RELEASE_URL}\">⏬ release</a></li>" >> "$nav_file"
fi
fi
[ -n "$REPO_ZIP_URL" ] && echo " <li><a href=\"${REPO_ZIP_URL}\">📦repo zip</a></li>" >> "$nav_file"
[ -n "$REPO_URL" ] && echo " <li><a href=\"${REPO_URL}\">🔗git</a></li>" >> "$nav_file"
echo " <li>⏭️</li>" >> "$nav_file"
# Root .md pages
for md in *.md; do
[ -f "$md" ] || continue
[ "$md" = "README.md" ] && continue
[ "$md" = "test.md" ] && continue
local slug label active
slug="${md%.md}"
label="${slug//_/ }"
active=""
[ "$slug" = "$current" ] && active=' class="active"'
echo " <li><a href=\"${slug}.html\"${active}>${label}</a></li>" >> "$nav_file"
done
# Add static links to Distros, Rosette, and All pages
local distros_active rosette_active all_active
[ "$current" = "distros" ] && distros_active=' class="active"'
[ "$current" = "rosette" ] && rosette_active=' class="active"'
[ "$current" = "all" ] && all_active=' class="active"'
echo " <li><a href=\"distros.html\"${distros_active}>Distros</a></li>" >> "$nav_file"
echo " <li><a href=\"rosette.html\"${rosette_active}>Rosette</a></li>" >> "$nav_file"
echo " <li><a href=\"all.html\"${all_active}>All</a></li>" >> "$nav_file"
echo '</ul></nav>' >> "$nav_file"
}
_build_goatcounter_snippet() {
local url="$1"
url=$(echo "$url" | rev | cut -d'/' -f1 | rev)
local file="${OUT_DIR}/_goatcounter.html"
cat > "$file" <<EOF
<script data-goatcounter="https://${url}/count"
async src="//gc.zgo.at/count.js"></script>
EOF
echo "$file"
}
_build_giscus_snippet() {
local repo="$1" repo_id="$2" category="$3" category_id="$4"
local file="${OUT_DIR}/_giscus.html"
cat > "$file" <<EOF
<script src="https://giscus.app/client.js"
data-repo="${repo}"
data-repo-id="${repo_id}"
data-category="${category}"
data-category-id="${category_id}"
data-mapping="pathname"
data-strict="0"
data-reactions-enabled="1"
data-emit-metadata="0"
data-input-position="bottom"
data-theme="preferred_color_scheme"
data-lang="cs"
crossorigin="anonymous"
async></script>
EOF
echo "$file"
}
# Recursively build all .md files in a subdir
_build_subdir() {
local subdir="$1"
local title="$2"
shift 2
local extra_after=("$@")
local out_dir="${OUT_DIR}/${subdir}"
mkdir -p "$out_dir"
# Copy src assets into subdir output
cp ${SRC_DIR}/style.css "$out_dir/" 2>/dev/null
for md in "${subdir}"/*.md; do
[ -f "$md" ] || continue
local file slug output meta_title nav_file
file="${md##*/}"
slug="${file%.md}"
output="${out_dir}/${slug}.html"
meta_title="${slug//_/ }"
nav_file="${out_dir}/_nav_${slug}.html"
_build_subnav "$slug" "$subdir" "$nav_file"
printf "${YELLOW}%-12s${NC} %s\n" "processing:" "$md → $output"
pandoc "$md" -f gfm -s \
--css=style.css \
--toc \
--toc-depth=3 \
--include-before-body=${SRC_DIR}/toggle.html \
--include-before-body=${SRC_DIR}/toc.html \
--include-before-body="$nav_file" \
--include-after-body=${SRC_DIR}/svg-color.html \
"${extra_after[@]}" \
--metadata title="$meta_title" \
-o "$output"
rm -f "$nav_file"
done
# Recurse into nested subdirs
for d in "${subdir}"/*/; do
[ -d "$d" ] || continue
_build_subdir "${d%/}" "$title" "${extra_after[@]}"
done
}
# ---------------------------------------------------------------------------
# Argument definitions
# format: "short|long|value|description|action"
# action: variable name to store value in, or "target" to set target
# ---------------------------------------------------------------------------
ARGS=(
"h|help||Show this help message|target"
"b|build||Build the website|target"
"s|serve||Serve site locally|target"
"t|title|<title>|Set website title|title"
"g|goatcounter|<url>|GoatCounter analytics URL|goatcounter_url"
"r|giscus-repo|<repo>|Giscus repo (user/repo)|giscus_repo"
"i|giscus-repo-id|<id>|Giscus repo ID|giscus_repo_id"
"c|giscus-category|<n>|Giscus category name|giscus_category"
"C|giscus-cat-id|<id>|Giscus category ID|giscus_category_id"
"d|subdir|<dir>|Add subdir to build|subdir_arg"
)
_build_optstring() {
local optstring=""
for entry in "${ARGS[@]}"; do
local short value
short=$(echo "$entry" | cut -d'|' -f1)
value=$(echo "$entry" | cut -d'|' -f3)
optstring+="$short"
[ -n "$value" ] && optstring+=":"
done
echo "$optstring"
}
# ---------------------------------------------------------------------------
# Distro card generators
# ---------------------------------------------------------------------------
_icon_color() {
local name="$1"
local -a colors=('#E95420' '#3C3B37' '#A80030' '#41B549' '#87CF3E' '#2F2F2F' '#178CDA' '#1d6fa4')
local code
printf -v code '%d' "'${name:0:1}" 2>/dev/null || code=63
echo "${colors[$((code % 8))]}"
}
_icon_html() {
local osname="$1" pretty="$2" icon_hint="$3" icon_online="${4:-}"
local color initial src
color=$(_icon_color "$pretty")
initial="${pretty:0:1}"
initial="${initial^^}"
src=""
local icon_base="${icon_hint%.*}"
# Priority: local icon_hint → local osname → ICON_ONLINE → colored placeholder
if [ -n "$icon_base" ] && [ -f "icons/${icon_base}.svg" ]; then src="icons/${icon_base}.svg"
elif [ -n "$icon_base" ] && [ -f "icons/${icon_base}.png" ]; then src="icons/${icon_base}.png"
elif [ -f "icons/${osname}.svg" ]; then src="icons/${osname}.svg"
elif [ -f "icons/${osname}.png" ]; then src="icons/${osname}.png"
fi
if [ -n "$src" ]; then
printf '<img src="%s" alt="%s" class="distro-icon-large" width="128" height="128" loading="lazy" onerror="this.style.display='"'"'none'"'"';this.nextElementSibling.style.display='"'"'flex'"'"'"><div class="distro-icon-fallback-large" style="width:128px;height:128px;background:%s;display:none">%s</div>' \
"$src" "$pretty" "$color" "$initial"
elif [ -n "$icon_online" ]; then
printf '<img src="%s" alt="%s" class="distro-icon-large" width="128" height="128" loading="lazy" onerror="this.style.display='"'"'none'"'"';this.nextElementSibling.style.display='"'"'flex'"'"'"><div class="distro-icon-fallback-large" style="width:128px;height:128px;background:%s;display:none">%s</div>' \
"$icon_online" "$pretty" "$color" "$initial"
else
printf '<div class="distro-icon-fallback-large" style="width:128px;height:128px;background:%s">%s</div>' \
"$color" "$initial"
fi
}
_card_html() {
local osname="$1" pretty="$2" basedof="$3" description="$4"
local homepage="$5" categories="$6" supported="$7" icon_hint="${8}" icon_online="${9:-}"
local meta_html=""
local osname_safe
osname_safe="${osname//\'/\\\'}"
if [ "$supported" = "true" ]; then
meta_html+='<span class="supported-badge">supported</span>'
fi
# Show first two DistroWatch category tags
if [ -n "$categories" ]; then
local IFS_old=$IFS
IFS=','
local c i=0
for c in $categories; do
c="${c# }"
c="${c% }"
[ -z "$c" ] && continue
[ "$c" = "other" ] && continue
meta_html+="<span class=\"category-badge\">${c}</span>"
(( i++ )); [ "$i" -ge 2 ] && break
done
IFS=$IFS_old
fi
local basedof_html=""
if [ -n "$basedof" ] && [ "$basedof" != "-" ]; then
local basedof_links="" basedof_word
for basedof_word in $basedof; do
[ -n "$basedof_links" ] && basedof_links+=" "
basedof_links+="<a href=\"#\" onclick=\"setSearch('${basedof_word}');return false;\">${basedof_word}</a>"
done
basedof_html=" <span class=\"basedof-inline\">Based on: ${basedof_links}</span>"
fi
local meta_row=""
[ -n "$meta_html" ] && meta_row="<div class=\"distro-meta\">${meta_html}</div>"
local inline_icon="" icon_hint_base="${icon_hint%.*}"
if [ -n "$icon_hint_base" ] && [ -f "icons/${icon_hint_base}.svg" ]; then
inline_icon="<img src=\"icons/${icon_hint_base}.svg\" alt=\"\" class=\"card-title-icon\" aria-hidden=\"true\" loading=\"lazy\">"
elif [ -n "$icon_hint_base" ] && [ -f "icons/${icon_hint_base}.png" ]; then
inline_icon="<img src=\"icons/${icon_hint_base}.png\" alt=\"\" class=\"card-title-icon\" aria-hidden=\"true\" loading=\"lazy\">"
elif [ -f "icons/${osname}.svg" ]; then
inline_icon="<img src=\"icons/${osname}.svg\" alt=\"\" class=\"card-title-icon\" aria-hidden=\"true\" loading=\"lazy\">"
elif [ -f "icons/${osname}.png" ]; then
inline_icon="<img src=\"icons/${osname}.png\" alt=\"\" class=\"card-title-icon\" aria-hidden=\"true\" loading=\"lazy\">"
elif [ -n "$icon_online" ]; then
inline_icon="<img src=\"${icon_online}\" alt=\"\" class=\"card-title-icon\" aria-hidden=\"true\" loading=\"lazy\" onerror=\"this.style.display='none'\">"
fi
cat <<EOF
<div class="distro-card" style="cursor:pointer" onclick="if(event.target.closest('a'))return;showDownloads('${osname_safe}')" data-categories="${categories}" data-supported="${supported}" data-osname="${osname}" data-basedof="${basedof}" data-pretty="${pretty,,}">
<div class="distro-card-icon-area">
$(_icon_html "$osname" "$pretty" "$icon_hint" "$icon_online")
</div>
<div class="distro-card-body">
<h3>${inline_icon}<a href="${homepage}" target="_blank" rel="noopener">${pretty}</a>${basedof_html}</h3>
<hr class="distro-divider">
${meta_row}
<p class="distro-description">${description}</p>
<div class="distro-actions">
<button class="download-btn"><img src="icons/floppy.svg" alt="Download"> Direct Download</button>
</div>
</div>
</div>
EOF
}
_read_pub_vars() {
local file="$1"
local _line _key _val
while IFS= read -r _line; do
_key="${_line%%=*}"
_val="${_line#*=}"
_val="${_val#\"}"; _val="${_val%\"}"
case "$_key" in
OSNAME|PRETTY|ICON|ICON_ONLINE|CATEGORY|BASEDOF|DESCRIPTION|HOMEPAGE|\
RELEASES|EDITIONS|QEMU_ARCH|MAGNET|CHAT|RSS|DW|\
DW_ARCHITECTURE|DW_DESKTOP|DW_CATEGORY|DW_URL)
printf -v "$_key" '%s' "$_val"
;;
esac
done < <(grep -E '^(OSNAME|PRETTY|ICON|ICON_ONLINE|CATEGORY|BASEDOF|DESCRIPTION|HOMEPAGE|RELEASES|EDITIONS|QEMU_ARCH|MAGNET|CHAT|RSS|DW|DW_ARCHITECTURE|DW_DESKTOP|DW_CATEGORY|DW_URL)=' "$file")
}
_generate_distro_cards() {
local supported="true"
for pub_file in ${PUBLIC_DIR}/*; do
[ -f "$pub_file" ] || continue
local OSNAME="" PRETTY="" ICON="" ICON_ONLINE="" CATEGORY="" BASEDOF="" DESCRIPTION="" HOMEPAGE=""
_read_pub_vars "$pub_file"
[ -z "$OSNAME" ] && continue
_card_html "$OSNAME" "$PRETTY" "$BASEDOF" "$DESCRIPTION" "$HOMEPAGE" "$CATEGORY" "$supported" "$ICON" "$ICON_ONLINE"
done
}
_generate_distro_data_js() {
echo 'window._distroData = {'
local first=1
for pub_file in ${PUBLIC_DIR}/*; do
[ -f "$pub_file" ] || continue
local OSNAME="" PRETTY="" ICON="" ICON_ONLINE="" CATEGORY="" BASEDOF="" DESCRIPTION="" HOMEPAGE="" RELEASES="" EDITIONS="" QEMU_ARCH="" MAGNET="" CHAT="" RSS="" DW="" DW_DESKTOP=""
_read_pub_vars "$pub_file"
[ -z "$OSNAME" ] && continue
local hp_esc releases_esc basedof_esc editions_esc archs_esc icon_online_esc magnet_esc chat_esc rss_esc dw_esc desc_esc cat_esc dw_desktop_esc
hp_esc="${HOMEPAGE//\"/\\\"}"
releases_esc="${RELEASES//\"/\\\"}"
basedof_esc="${BASEDOF//\"/\\\"}"
editions_esc="${EDITIONS//\"/\\\"}"
archs_esc="${QEMU_ARCH//\"/\\\"}"
icon_online_esc="${ICON_ONLINE//\"/\\\"}"
magnet_esc="${MAGNET//\"/\\\"}"
chat_esc="${CHAT//\"/\\\"}"
rss_esc="${RSS//\"/\\\"}"
dw_esc="${DW//\"/\\\"}"
desc_esc="${DESCRIPTION//\"/\\\"}"
cat_esc="${CATEGORY//\"/\\\"}"
dw_desktop_esc="${DW_DESKTOP//\"/\\\"}"
# Build URLs map from public/tmp_${OSNAME}.dat (Arch TAB Release TAB Edition TAB URL TAB Status)
local tmp_entries=""
declare -A _url_seen=()
local _dat_file="${PUBLIC_DIR}/tmp_${OSNAME}.dat"
while IFS=$'\t' read -r _arch _rel _ed _url _st; do
[[ "$_st" == "OK" || "$_st" == "PASS" ]] || continue
[[ "$_url" =~ ^https?:// ]] || continue
[ "$_ed" = "-" ] && _ed=""
local key="$_arch"
[ -n "$_rel" ] && key+=" $_rel"
[ -n "$_ed" ] && key+=" $_ed"
[[ "${_url_seen[$key]+_}" ]] && continue
_url_seen[$key]=1
key="${key//\"/\\\"}"
_url="${_url//\"/\\\"}"
[ -n "$tmp_entries" ] && tmp_entries+=","
tmp_entries+="\"${key}\":\"${_url}\""
done < <(cat "${_dat_file}" 2>/dev/null)
unset _url_seen
local urls_js=""
[ -n "$tmp_entries" ] && urls_js=",\"urls\":{${tmp_entries}}"
[ "$first" = "0" ] && echo ','
first=0
local extra_fields=""
[ -n "$desc_esc" ] && extra_fields+=",\"description\":\"${desc_esc}\""
[ -n "$cat_esc" ] && extra_fields+=",\"category\":\"${cat_esc}\""
[ -n "$dw_desktop_esc" ] && extra_fields+=",\"dw_desktop\":\"${dw_desktop_esc}\""
[ -n "$magnet_esc" ] && extra_fields+=",\"magnet\":\"${magnet_esc}\""
[ -n "$chat_esc" ] && extra_fields+=",\"chat\":\"${chat_esc}\""
[ -n "$rss_esc" ] && extra_fields+=",\"rss\":\"${rss_esc}\""
[ -n "$dw_esc" ] && extra_fields+=",\"dw\":\"${dw_esc}\""
printf ' "%s": {"homepage":"%s","releases":"%s","editions":"%s","basedof":"%s","architectures":"%s","icon_online":"%s"%s%s}' \
"$OSNAME" "$hp_esc" "$releases_esc" "${editions_esc:-}" "$basedof_esc" "$archs_esc" "$icon_online_esc" "$extra_fields" "$urls_js"
done
echo ''
echo '};'
# _dwData: DW metadata for ALL distros that have a TODO/distrowatch/ file
echo 'window._dwData = {'
first=1
for dw_file in TODO/distrowatch/*; do
[ -f "$dw_file" ] || continue
local OSNAME="" PRETTY="" BASEDOF="" HOMEPAGE="" DESCRIPTION=""
local DW_ARCHITECTURE="" DW_DESKTOP="" DW_CATEGORY="" DW_URL=""
_read_pub_vars "$dw_file"
[ -z "$OSNAME" ] && continue
local hp_esc basedof_esc desc_esc arch_esc desktop_esc cat_esc url_esc
hp_esc="${HOMEPAGE//\"/\\\"}"
basedof_esc="${BASEDOF//\"/\\\"}"
desc_esc="${DESCRIPTION//\"/\\\"}"
arch_esc="${DW_ARCHITECTURE//\"/\\\"}"
desktop_esc="${DW_DESKTOP//\"/\\\"}"
cat_esc="${DW_CATEGORY//\"/\\\"}"
url_esc="${DW_URL:-"https://distrowatch.com/${OSNAME}"}"
url_esc="${url_esc//\"/\\\"}"
[ "$first" = "0" ] && echo ','
first=0
printf ' "%s": {"pretty":"%s","homepage":"%s","basedof":"%s","description":"%s","dw_arch":"%s","dw_desktop":"%s","dw_category":"%s","dw_url":"%s"}' \
"$OSNAME" "${PRETTY//\"/\\\"}" "$hp_esc" "$basedof_esc" "$desc_esc" \
"$arch_esc" "$desktop_esc" "$cat_esc" "$url_esc"
done
echo ''
echo '};'
}
_generate_distros_data_js_file() {
local out="${OUT_DIR}/distros-data.js"
echo 'window.distrosData = [' > "$out"
local first=1
# Unsupported distros — from TODO/distrowatch/ (skip those already in ${PUBLIC_DIR}/)
for dw_file in TODO/distrowatch/*; do
[ -f "$dw_file" ] || continue
local OSNAME="" PRETTY="" BASEDOF="" HOMEPAGE="" DESCRIPTION=""
local DW_ARCHITECTURE="" DW_DESKTOP="" DW_CATEGORY="" DW_URL=""
_read_pub_vars "$dw_file"
[ -z "$OSNAME" ] && continue
[ -f "${PUBLIC_DIR}/${OSNAME}" ] && continue # skip supported
[ "$first" = "0" ] && echo ',' >> "$out"
first=0
local hp_esc basedof_esc desc_esc cat_esc arch_esc desktop_esc url_esc
hp_esc="${HOMEPAGE//\"/\\\"}"
basedof_esc="${BASEDOF//\"/\\\"}"
desc_esc="${DESCRIPTION//\"/\\\"}"
cat_esc="${DW_CATEGORY//\"/\\\"}"
arch_esc="${DW_ARCHITECTURE//\"/\\\"}"
desktop_esc="${DW_DESKTOP//\"/\\\"}"
url_esc="${DW_URL:-"https://distrowatch.com/${OSNAME}"}"
url_esc="${url_esc//\"/\\\"}"
printf ' {"id":"%s","name":"%s","basedof":"%s","description":"%s","homepage":"%s","dw_category":"%s","dw_arch":"%s","dw_desktop":"%s","dw_url":"%s"}' \
"$OSNAME" "${PRETTY//\"/\\\"}" "$basedof_esc" "$desc_esc" "$hp_esc" \
"$cat_esc" "$arch_esc" "$desktop_esc" "$url_esc" >> "$out"
done
echo '' >> "$out"
echo '];' >> "$out"
printf "${GREEN}%-12s${NC} %s\n" "generated:" "$out"
}
# Generate list of available icons at build time
_generate_icons_list_js() {
local out="${OUT_DIR}/icons-available.js"
echo 'window.iconsAvailable = {' > "$out"
local first=1
# Collect all icon files from icons/ directory; deduplicate by basename.
declare -A _icon_seen=()
for icon_file in icons/*; do
[ -f "$icon_file" ] || continue
local basename
basename="${icon_file##*/}"
local name="${basename%.*}"
[ "${_icon_seen[$name]+x}" ] && continue
_icon_seen[$name]=1
local has_svg=0 has_png=0
[ -f "icons/${name}.svg" ] && has_svg=1
[ -f "icons/${name}.png" ] && has_png=1
[ "$first" = "0" ] && echo ',' >> "$out"
first=0
if [ "$has_svg" = 1 ] && [ "$has_png" = 1 ]; then
printf ' "%s": {"svg":true,"png":true}' "$name" >> "$out"
elif [ "$has_svg" = 1 ]; then
printf ' "%s": {"svg":true}' "$name" >> "$out"
else
printf ' "%s": {"png":true}' "$name" >> "$out"
fi
done
echo '};' >> "$out"
printf "${GREEN}%-12s${NC} %s\n" "generated:" "$out"
}
_generate_distros_page() {
local type="$1"
local giscus_repo="$2"
local giscus_repo_id="$3"
local giscus_category="$4"
local giscus_category_id="$5"
local title h1 desc support_filter_html
if [ "$type" = "distros" ]; then
title="Distros — DistroHopper"
h1="Supported Distributions"
desc="All distributions directly supported by DistroHopper."
support_filter_html=''
else
title="All Distributions — DistroHopper"
h1="All Distributions"
desc='All distributions (from DistroWatch). Supported ones <span class="supported-badge">supported</span> show version &amp; edition details.'
support_filter_html='
<button class="filter-btn" data-filter-support="supported">Supported</button>
<button class="filter-btn" data-filter-support="unsupported">Unsupported</button>'
fi
local nav_file="${OUT_DIR}/_nav_${type}.html"
_build_nav "$type" "$nav_file"
local nav_html
nav_html=$(cat "$nav_file")
rm -f "$nav_file"
local toggle_html svg_color_html particles_init_html floppy_inline
toggle_html=$(cat ${SRC_DIR}/toggle.html)
svg_color_html=$(cat ${SRC_DIR}/svg-color.html)
particles_init_html=$(cat ${SRC_DIR}/particles-config.html)
floppy_inline=$(sed 's/ width="[0-9]*"//; s/ height="[0-9]*"//' icons/floppy.svg | tr -d '\n' | tr -s ' ')
local data_js
data_js=$(_generate_distro_data_js)
local cards
cards=$(_generate_distro_cards "$type")
local unsupported_section=""
if [ "$type" = "all" ]; then
unsupported_section='<script src="distros-data.js"></script>
<script>
(function(){
if (!window.distrosData) return;
var grid = document.getElementById("distroGrid");
var colors = ["#E95420","#3C3B37","#A80030","#41B549","#87CF3E","#2F2F2F","#178CDA","#1d6fa4"];
window.distrosData.forEach(function(d) {
if (window._distroData && window._distroData[d.id||d.name]) return;
var nm = d.name || "?";
var oid = d.id || nm;
var bg = colors[nm.charCodeAt(0) % 8];
var cats = d.dw_category || "";
var catBadges = "";
cats.split(",").slice(0,2).forEach(function(c){
c = c.trim();
if (c) catBadges += "<span class=\"category-badge\">"+c+"</span>";
});
var card = document.createElement("div");
card.className = "distro-card";
card.dataset.categories = cats;
card.dataset.supported = "false";
card.dataset.osname = oid;
card.dataset.basedof = d.basedof || "";
var iconSrc = d.icon_online || "";
var largeIconHtml =
"<img src=\""+iconSrc+"\" alt=\""+nm+"\" class=\"distro-icon-large\" width=\"128\" height=\"128\" loading=\"lazy\" onerror=\"this.style.display=\x27none\x27;this.nextElementSibling.style.display=\x27flex\x27\">"
+ "<div class=\"distro-icon-fallback-large\" style=\"width:128px;height:128px;background:"+bg+";display:none\">"+nm.charAt(0).toUpperCase()+"</div>";
var titleIconHtml = "<img src=\""+iconSrc+"\" alt=\"\" class=\"card-title-icon\" aria-hidden=\"true\" loading=\"lazy\" onerror=\"this.style.display=\x27none\x27\">";
card.style.cursor = "pointer";
card.onclick = function(e) { if (e.target.closest('a')) return; showDownloads(oid); };
card.innerHTML =
"<div class=\"distro-card-icon-area\">" + largeIconHtml + "</div>"
+ "<div class=\"distro-card-body\">"
+ "<h3>" + titleIconHtml + (d.homepage?"<a href=\""+d.homepage+"\" target=\"_blank\" rel=\"noopener\">"+nm+"</a>":nm)+"</h3>"
+ "<hr class=\"distro-divider\">"
+ "<div class=\"distro-meta\">"+catBadges+"</div>"
+ "<p class=\"distro-description\">"+(d.description||"")+"</p>"
+ "<div class=\"distro-actions\">"
+ "<button class=\"download-btn\">&#x2139; Info</button>"
+ "</div>"
+ "</div>";
grid.appendChild(card);
});
_buildCategoryFilters();
if (typeof filterDistros === "function") filterDistros();
})();
</script>'
fi
cat > "${OUT_DIR}/${type}.html" <<HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>${title}</title>
<link rel="stylesheet" href="style.css">
<script src="https://cdn.jsdelivr.net/npm/js-yaml@4/dist/js-yaml.min.js"></script>
<style>
.rosette-section { margin: 1rem 0; border: 1px solid var(--border-color); border-radius: 4px; overflow: hidden; }
.rosette-header { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; background: var(--bg-light); border-bottom: 1px solid var(--border-color); font-size: 0.85rem; font-weight: bold; }
.rosette-link { font-size: 0.8rem; font-weight: normal; color: var(--link-color); text-decoration: none; }
.rosette-link:hover { text-decoration: underline; }
.rosette-table { width: 100%; border-collapse: collapse; font-family: "Courier New", monospace; font-size: 0.78rem; }
.rosette-table tr { border-bottom: 1px solid var(--border-color); }
.rosette-table tr:last-child { border-bottom: none; }
.rosette-table td { padding: 4px 10px; vertical-align: top; }
.r-action { color: var(--accent-color); white-space: nowrap; width: 70px; }
.r-cmd { color: var(--text-color); }
.r-desc { color: var(--text-color); opacity: 0.55; font-size: 0.72rem; }
</style>
</head>
<body>
<div id="particles-js" style="position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none"></div>
<div style="position:relative;z-index:1">
${toggle_html}
${nav_html}
<main class="container distros-container">
<div class="page-header">
<h1>${h1}</h1>
<p>${desc}</p>
</div>
<div class="distros-filters">
<input type="text" id="distroSearch" class="distros-search" placeholder="Search distributions...">
<div class="filter-buttons">
<button class="filter-btn active" data-filter-support="all">All</button>
${support_filter_html}
</div>
<div class="filter-buttons filter-buttons-categories" id="catFilters"></div>
</div>
<div class="distros-grid" id="distroGrid">
${cards}
</div>
</main>
<footer class="site-footer">
<p>Data for unsupported distributions provided by <a href="https://distrowatch.com" target="_blank" rel="noopener">DistroWatch.com</a>. Page design inspired by <a href="https://github.com/ufuayk" target="_blank" rel="noopener">ufuayk</a>.</p>
</footer>
</div>
<div class="modal-overlay" id="modalOverlay">
<div class="modal-content">
<button class="modal-close" onclick="closeModal()" style="float:right;margin:-0.5rem -0.5rem 0 0">&times;</button>
<div id="modalBody"></div>
</div>
</div>
<script src="icons-available.js"></script>
<script>
${data_js}
var _giscusRepo = '${giscus_repo}';
var _giscusRepoId = '${giscus_repo_id}';
var _giscusCategory = '${giscus_category}';
var _giscusCategoryId = '${giscus_category_id}';
function _dwInfoHtml(dw, showSource) {
if (!dw) return '';
var rows = '';
if (dw.dw_desktop) rows += '<tr><th>Desktop</th><td>'+dw.dw_desktop+'</td></tr>';
if (dw.dw_arch) rows += '<tr><th>Architecture</th><td>'+dw.dw_arch+'</td></tr>';
if (dw.dw_category) rows += '<tr><th>Category</th><td>'+dw.dw_category+'</td></tr>';
if (dw.basedof && dw.basedof !== '-') rows += '<tr><th>Based on</th><td>'+dw.basedof+'</td></tr>';
var html = '';
if (rows) html += '<table class="dw-meta-table">'+rows+'</table>';
if (dw.description) html += '<p class="distro-description">'+dw.description+'</p>';
if (showSource && dw.dw_url) html += '<p class="modal-note">Source: <a href="'+dw.dw_url+'" target="_blank" rel="noopener">DistroWatch.com</a></p>';
return html;
}
function _distroInfoHtml(d) {
if (!d) return '';
var rows = '';
if (d.dw_desktop) rows += '<tr><th>Desktop</th><td>'+d.dw_desktop+'</td></tr>';
if (d.architectures) rows += '<tr><th>Architecture</th><td>'+d.architectures+'</td></tr>';
if (d.category) rows += '<tr><th>Category</th><td>'+d.category+'</td></tr>';
if (d.basedof && d.basedof !== '-') rows += '<tr><th>Based on</th><td>'+d.basedof+'</td></tr>';
var html = '';
if (rows) html += '<table class="dw-meta-table">'+rows+'</table>';
if (d.description) html += '<p class="distro-description">'+d.description+'</p>';
return html;
}
var _rosetteCache = {};
var _rosetteKnown = ['alpine','arch','debian','fedora','opensuse','void','nix','macos','gentoo','slackware'];
var _rosetteMap = {'ubuntu':'debian','nixos':'nix','suse':'opensuse'};
function _getRosetteId(osname, basedof) {
if (_rosetteKnown.indexOf(osname) !== -1) return osname;
if (_rosetteMap[osname]) return _rosetteMap[osname];
if (basedof) {
var parts = basedof.toLowerCase().split(/[\s,]+/);
for (var i = 0; i < parts.length; i++) {
var p = parts[i].trim();
if (_rosetteKnown.indexOf(p) !== -1) return p;
if (_rosetteMap[p]) return _rosetteMap[p];
}
}
return null;
}
async function _fetchRosette(rosetteId) {
if (_rosetteCache[rosetteId] !== undefined) return _rosetteCache[rosetteId];
try {
var txt = await fetch('./data/rosette/' + rosetteId + '.yaml').then(function(r){ return r.text(); });
_rosetteCache[rosetteId] = jsyaml.load(txt);
} catch(e) {
_rosetteCache[rosetteId] = null;
}
return _rosetteCache[rosetteId];
}
function _rosetteEsc(s) {
return (s||'').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');
}
function _rosettePreviewHtml(data, rosetteId) {
var pkg = data && data.commands && data.commands.package;
if (!pkg) return '';
var keyActions = ['install','remove','search','update','list'];
var rows = '';
keyActions.forEach(function(a) {
if (pkg[a]) rows += '<tr><td class="r-action">'+a+'</td><td class="r-cmd">'+_rosetteEsc(pkg[a].cmd)+'</td><td class="r-desc">'+_rosetteEsc(pkg[a].desc)+'</td></tr>';
});
if (!rows) return '';
return '<div class="rosette-section">'
+ '<div class="rosette-header"><span>\u{1F4E6} Package Manager (' + _rosetteEsc(data.name||rosetteId) + ')</span>'
+ '<a href="rosette.html?os='+rosetteId+'" class="rosette-link">full rosette →</a></div>'
+ '<table class="rosette-table">' + rows + '</table>'
+ '</div>';
}
function showDownloads(osname) {
var d = window._distroData && window._distroData[osname];
var dw = window._dwData && window._dwData[osname];
var card = document.querySelector('[data-osname="'+osname+'"]');
var pretty = card ? card.querySelector('h3 a, h3') : null;
var name = pretty ? (pretty.textContent.trim()||osname) : osname;
if (dw && dw.pretty && name === osname) name = dw.pretty;
var colors = ['#E95420','#3C3B37','#A80030','#41B549','#87CF3E','#2F2F2F','#178CDA','#1d6fa4'];
var bg = colors[name.charCodeAt(0) % 8];
var dwBase = 'https://distrowatch.com/images/yvzhuwbpy/';
var iconsAvailable = window.iconsAvailable || {};
// Get icon src based on build-time availability
var iconSrc;
var info = iconsAvailable[osname];
if (info && info.svg) iconSrc = 'icons/'+osname+'.svg';
else if (info && info.png) iconSrc = 'icons/'+osname+'.png';
else iconSrc = dwBase + osname + '.png';
var isDwIcon = iconSrc.indexOf(dwBase) === 0;
var iconHtml = isDwIcon
? '<img class="modal-distro-icon" src="'+iconSrc+'" alt="'+name+'" onerror="this.style.display=\'none\';this.nextElementSibling.style.display=\'flex\'">'
+ '<div class="modal-distro-icon-fallback" style="background:'+bg+';display:none">'+name.charAt(0).toUpperCase()+'</div>'
: '<img class="modal-distro-icon" src="'+iconSrc+'" alt="'+name+'">'
+ '<div class="modal-distro-icon-fallback" style="background:'+bg+';display:none">'+name.charAt(0).toUpperCase()+'</div>';
var hp = (dw && dw.homepage) || (d && d.homepage) || '';
var basedof = (dw && dw.basedof) || (d && d.basedof) || '';
var html = '<div class="modal-distro-header">'
+ iconHtml
+ '<div class="modal-distro-title"><h2>'+name+'</h2>'
+ (basedof && basedof !== '-' ? '<div class="modal-basedof">Based on: '+basedof+'</div>' : '')
+ (hp ? '<a href="'+hp+'" target="_blank" rel="noopener" class="modal-homepage-link">&#x1f310; '+hp+'</a>' : '')
+ '</div></div>';
if (d) {
html += _distroInfoHtml(d);
html += '<div id="modal-rosette-placeholder"></div>';
var rels = d.releases ? d.releases.trim().split(/\s+/).filter(Boolean) : [];
var eds = d.editions ? d.editions.trim().split(/\s+/).filter(Boolean) : [];
var archs = d.architectures ? d.architectures.trim().split(/\s+/).filter(Boolean) : [];
var urls = d.urls || {};
function _buildMatrix(filterArch) {
var urlsForArch = {};
if (filterArch) {
Object.keys(urls).forEach(function(k) {
var parts = k.split(' ');
var archIdx = parts.indexOf(filterArch);
if (archIdx !== -1) {
var stripped = parts.filter(function(_,i){ return i !== archIdx; }).join(' ');
urlsForArch[stripped] = urls[k];
}
});
} else {
urlsForArch = urls;
}
function dlCell(key) {
var url = urlsForArch[key];
return url
? '<td><a href="'+url+'" target="_blank" rel="noopener" class="dl-link" title="'+key+'">${floppy_inline}</a></td>'
: '<td><span class="dl-disabled">&#x2717;</span></td>';
}
var t = '';
if (rels.length && eds.length) {
t += '<div class="table-wrap"><table class="release-table"><tr><th>Version</th>';
eds.forEach(function(e){ t += '<th class="th-edition"><span>'+e+'</span></th>'; });
t += '<th class="th-spacer"></th></tr>';
rels.forEach(function(r){
t += '<tr><td>'+r+'</td>';
eds.forEach(function(e){ t += dlCell(r+' '+e); });
t += '<td class="th-spacer"></td></tr>';
});
t += '</table></div>';
} else if (rels.length) {
t += '<table class="release-table"><tr><th>Version</th><th>Download</th></tr>';
rels.forEach(function(r){
t += '<tr><td>'+r+'</td>'+dlCell(r)+'</tr>';
});
t += '</table>';
}
return t;
}
var archesInUrls = archs.filter(function(a){ return Object.keys(urls).some(function(k){ return k.split(' ').indexOf(a) !== -1; }); });
if (archesInUrls.length > 1) {
html += '<div class="filter-buttons arch-switcher">';
archesInUrls.forEach(function(a, i) {
html += '<button class="filter-btn'+(i===0?' active':'')+'" data-arch-btn="'+a+'" onclick="_switchArch(this)">'+a+'</button>';
});
html += '</div>';
archesInUrls.forEach(function(a, i) {
html += '<div data-arch-matrix="'+a+'"'+(i===0?'':' style="display:none"')+'>';
html += _buildMatrix(a);
html += '</div>';
});
} else {
html += _buildMatrix(archesInUrls[0] || null);
}
html += '<p class="modal-note">Or <a href="https://github.com/oSoWoSo/DistroHopper" target="_blank" rel="noopener">install DistroHopper</a> and quickly try any supported OS</p>';
} else {
html += _dwInfoHtml(dw, true);
html += '<div id="modal-rosette-placeholder"></div>';
if (!dw) html += '<p style="opacity:0.6;font-size:0.9rem">No data available.</p>';
}
document.getElementById('modalBody').innerHTML = html;
document.getElementById('modalOverlay').classList.add('active');
var _rosetteId = _getRosetteId(osname, basedof);
if (_rosetteId) {
_fetchRosette(_rosetteId).then(function(data) {
var ph = document.getElementById('modal-rosette-placeholder');
if (ph) ph.outerHTML = _rosettePreviewHtml(data, _rosetteId);
});
}
document.querySelectorAll('#modalBody .release-table').forEach(function(tbl) {
tbl.addEventListener('mouseover', function(e) {
var cell = e.target.closest('td,th');
if (!cell || cell.classList.contains('th-spacer')) return;
var idx = cell.cellIndex;
tbl.querySelectorAll('.col-hover').forEach(function(c){ c.classList.remove('col-hover'); });
tbl.querySelectorAll('tr').forEach(function(row){
var c = row.cells[idx];
if (c && !c.classList.contains('th-spacer')) c.classList.add('col-hover');
});
});
tbl.addEventListener('mouseleave', function() {
tbl.querySelectorAll('.col-hover').forEach(function(c){ c.classList.remove('col-hover'); });
});
});
// Add giscus comments to modal
if (_giscusRepo && _giscusCategoryId) {
_loadGiscus(osname);
}
}
function _loadGiscus(osname) {
// Remove existing giscus if present
var existing = document.getElementById('giscus-root');
if (existing) existing.remove();
var container = document.createElement('div');
container.id = 'giscus-root';
container.className = 'giscus-container';
container.style.marginTop = '2rem';
document.getElementById('modalBody').appendChild(container);
var script = document.createElement('script');
script.src = 'https://giscus.app/client.js';
script.setAttribute('data-repo', _giscusRepo);
script.setAttribute('data-repo-id', _giscusRepoId);
script.setAttribute('data-category', _giscusCategory);
script.setAttribute('data-category-id', _giscusCategoryId);
script.setAttribute('data-mapping', 'pathname');
script.setAttribute('data-term', osname);
script.setAttribute('data-strict', '0');
script.setAttribute('data-reactions-enabled', '1');
script.setAttribute('data-emit-metadata', '0');
script.setAttribute('data-input-position', 'bottom');
script.setAttribute('data-theme', 'preferred_color_scheme');
script.setAttribute('data-lang', 'cs');
script.crossorigin = 'anonymous';
script.async = true;
container.appendChild(script);
}
function _switchArch(btn) {
var arch = btn.dataset.archBtn;
var modal = document.getElementById('modalBody');
modal.querySelectorAll('[data-arch-btn]').forEach(function(b) {
b.classList.toggle('active', b.dataset.archBtn === arch);
});
modal.querySelectorAll('[data-arch-matrix]').forEach(function(m) {
m.style.display = m.dataset.archMatrix === arch ? '' : 'none';
});
}
function closeModal() {
document.getElementById('modalOverlay').classList.remove('active');
}
document.getElementById('modalOverlay').addEventListener('click', function(e) {
if (e.target === this) closeModal();
});
function setSearch(q) {
var inp = document.getElementById('distroSearch');
if (inp) { inp.value = q; filterDistros(); }
}
// Category filter buttons — built dynamically from cards present in the DOM
function _buildCategoryFilters() {
var catCount = {};
document.querySelectorAll('.distro-card').forEach(function(card) {
(card.dataset.categories || '').split(',').forEach(function(c) {
c = c.trim();
if (c) catCount[c] = (catCount[c]||0) + 1;
});
});
var container = document.getElementById('catFilters');
if (!container) return;
container.innerHTML = '';
Object.keys(catCount).sort().forEach(function(cat) {
var btn = document.createElement('button');
btn.className = 'filter-btn';
btn.dataset.filterCat = cat;
btn.textContent = cat;
btn.addEventListener('click', function() {
var active = _activeFilters.category === cat;
_activeFilters.category = active ? null : cat;
document.querySelectorAll('[data-filter-cat]').forEach(function(b) {
b.classList.toggle('active', b.dataset.filterCat === _activeFilters.category);
});
filterDistros();
});
container.appendChild(btn);
});
}
var _activeFilters = { support: null, category: null };
function filterDistros() {
var q = ((document.getElementById('distroSearch')||{}).value || '').toLowerCase();
document.querySelectorAll('.distro-card').forEach(function(card) {
var text = (card.dataset.osname||'') + ' '
+ ((card.querySelector('h3 a,h3')||{textContent:''}).textContent||'') + ' '
+ (card.dataset.basedof||'') + ' '
+ (card.dataset.categories||'');
var nameMatch = !q || text.toLowerCase().includes(q);
var isSupported = card.dataset.supported === 'true';
var supportMatch = !_activeFilters.support
|| (_activeFilters.support === 'supported' && isSupported)
|| (_activeFilters.support === 'unsupported' && !isSupported);
var catMatch = !_activeFilters.category
|| (card.dataset.categories || '').split(',').some(function(c) {
return c.trim() === _activeFilters.category;
});
card.style.display = (nameMatch && supportMatch && catMatch) ? '' : 'none';
});
}
document.getElementById('distroSearch').addEventListener('input', filterDistros);
document.querySelectorAll('[data-filter-support]').forEach(function(btn) {
btn.addEventListener('click', function() {
var f = this.dataset.filterSupport;
if (f === 'all') {
_activeFilters.support = null;
_activeFilters.category = null;
var inp = document.getElementById('distroSearch');
if (inp) inp.value = '';
document.querySelectorAll('[data-filter-cat]').forEach(function(b) { b.classList.remove('active'); });
document.querySelectorAll('[data-filter-support]').forEach(function(b) {
b.classList.toggle('active', b.dataset.filterSupport === 'all');
});
} else {
_activeFilters.support = f;
document.querySelectorAll('[data-filter-support]').forEach(function(b) {
b.classList.toggle('active', b.dataset.filterSupport === f);
});
}
filterDistros();
});
});
_buildCategoryFilters();
</script>
${unsupported_section}
${svg_color_html}
<script src="particles.min.js"></script>
${particles_init_html}
</body>
</html>
HTML
printf "${GREEN}%-12s${NC} %s\n" "generated:" "${OUT_DIR}/${type}.html"
}
# ---------------------------------------------------------------------------
# Targets
# ---------------------------------------------------------------------------
target_build() { ## Builds the website
local title="$1"
local goatcounter_url="$2"
local giscus_repo="$3"
local giscus_repo_id="$4"
local giscus_category="$5"
local giscus_category_id="$6"
local subdir_arg="$7"
local count cname
count=$(find ./ -maxdepth 1 -name '*.md' | wc -l)
_detect_repo
if [ -z "$title" ]; then
_r "No website title provided — using generated one!"
title=$(basename "$(pwd)" | sed 's/_/ /g')
fi
_g "Creating: $title"
[ -f ${OUT_DIR}/CNAME ] && cp ${OUT_DIR}/CNAME ${SRC_DIR}/
rm -rf "${OUT_DIR}" && mkdir -p "${OUT_DIR}"
cp -r ${SRC_DIR}/* ${OUT_DIR}/
rm -f ${OUT_DIR}/toggle.html ${OUT_DIR}/toc.html ${OUT_DIR}/svg-color.html
# Inject dynamic nav into rosette.html
if [ -f "${OUT_DIR}/rosette.html" ]; then
local rosette_nav="${OUT_DIR}/_nav_rosette.html"
_build_nav "rosette" "$rosette_nav"
python3 -c "
import sys
with open('${OUT_DIR}/rosette.html') as f:
content = f.read()
with open('$rosette_nav') as f:
nav = f.read()
content = content.replace('<!--NAV-->', nav)
with open('${OUT_DIR}/rosette.html', 'w') as f:
f.write(content)
"
rm -f "$rosette_nav"
fi
cname=$(cat ${OUT_DIR}/CNAME 2>/dev/null)
[ -n "$cname" ] && printf "%-12s ${GREEN}%s${NC}\n" "CNAME:" "$cname"
local extra_after=()
if [ -n "$goatcounter_url" ]; then
echo "GoatCounter: $goatcounter_url"
extra_after+=("--include-after-body=$(_build_goatcounter_snippet "$goatcounter_url")")
fi
if [ -n "$giscus_repo" ]; then
echo "Giscus: $giscus_repo"
extra_after+=("--include-after-body=$(_build_giscus_snippet \
"$giscus_repo" "$giscus_repo_id" "$giscus_category" "$giscus_category_id")")
fi
# Build root pages
if [ "$count" = 1 ]; then
for file in *.md; do
[ -f "$file" ] || continue
local nav_file="${OUT_DIR}/_nav.html"
_build_nav "index" "$nav_file"
printf "${YELLOW}%-12s${NC} %s\n" "processing:" "$file → index.html"
pandoc "$file" -f gfm -s \
--css=style.css \
--toc \
--toc-depth=3 \
--include-before-body=${SRC_DIR}/particles-loader.html \
--include-before-body=${SRC_DIR}/toggle.html \
--include-before-body=${SRC_DIR}/toc.html \
--include-before-body="$nav_file" \
--include-after-body=${SRC_DIR}/svg-color.html \
--include-after-body=${SRC_DIR}/particles-config.html \
"${extra_after[@]}" \
--metadata title="$title" \
-o ${OUT_DIR}/index.html
rm -f "$nav_file"
done
elif [ "$count" -gt 1 ]; then
for file in *.md; do
[ -f "$file" ] || continue
[ "$file" = "test.md" ] && continue
local output meta_title current
if [ "$file" = "README.md" ]; then
output="${OUT_DIR}/index.html"
meta_title="$title"
current="index"
else
output="${OUT_DIR}/${file%.md}.html"
meta_title="${file%.md}"
meta_title="${meta_title//_/ }"
current="${file%.md}"
fi
local nav_file="${OUT_DIR}/_nav_${current}.html"
_build_nav "$current" "$nav_file"
printf "${YELLOW}%-12s${NC} %s\n" "processing:" "$file → $output"
pandoc "$file" -f gfm -s \
--css=style.css \
--toc \
--toc-depth=3 \
--include-before-body=${SRC_DIR}/particles-loader.html \
--include-before-body=${SRC_DIR}/toggle.html \
--include-before-body=${SRC_DIR}/toc.html \
--include-before-body="$nav_file" \
--include-after-body=${SRC_DIR}/svg-color.html \
--include-after-body=${SRC_DIR}/particles-config.html \
"${extra_after[@]}" \
--metadata title="$meta_title" \
-o "$output"
rm -f "$nav_file"
done
else
_re "ERROR: No .md files found!"
fi
# Build subdirs — from .env SUBDIRS array + --subdir argument
local all_subdirs=("${SUBDIRS[@]:-}")
[ -n "$subdir_arg" ] && all_subdirs+=("$subdir_arg")
for subdir in "${all_subdirs[@]:-}"; do
[ -d "$subdir" ] || { _y "Subdir not found: $subdir"; continue; }
_g "Building subdir: $subdir"
_build_subdir "$subdir" "$title" "${extra_after[@]}"
done
# Copy icons
cp -r icons ${OUT_DIR}/
# Copy rosette data
if [ -d "data/rosette" ]; then
mkdir -p ${OUT_DIR}/data/rosette
cp -r data/rosette/* ${OUT_DIR}/data/rosette/
_g "Copied rosette data"
fi
# Generate icons-available.js (list of icons present at build time)
_generate_icons_list_js
# Generate distros-data.js from ${PUBLIC_DIR}/
_generate_distros_data_js_file
# Generate distros pages
_generate_distros_page distros "$giscus_repo" "$giscus_repo_id" "$giscus_category" "$giscus_category_id"
_generate_distros_page all "$giscus_repo" "$giscus_repo_id" "$giscus_category" "$giscus_category_id"
rm -f ${OUT_DIR}/_goatcounter.html ${OUT_DIR}/_giscus.html
}
errorMessage='ERROR: No functions found!
Create a target function with the format:
target_name() { ## Description here'
target_help() { ## Show this help message
_b "Website Build System
v$BUILD_VERSION
by oSoWoSo"
echo -e "\nUsage: $0 [target] [arguments]\n\nAvailable targets:\n"
awk 'BEGIN {FS = "## "} /^target_[a-zA-Z_-]+\(\).*## / {
sub(/target_/, "", $1)
sub(/\(\) \{/, "", $1)
gsub(/^[ \t]+/, "", $1)
printf " \033[36m%-15s\033[0m %s\n", $1, $2
}' "$0" | sort || _re "$errorMessage"
echo -e "\nAvailable arguments:\n"
for entry in "${ARGS[@]}"; do
local short long value desc
short=$(echo "$entry" | cut -d'|' -f1)
long=$(echo "$entry" | cut -d'|' -f2)
value=$(echo "$entry" | cut -d'|' -f3)
desc=$(echo "$entry" | cut -d'|' -f4)
printf " \033[33m%-32s\033[0m %s\n" "-${short}, --${long} ${value}" "$desc"
done
echo -e "\nScript will use .env file if found\n"
}
target_serve() { ## Serve site locally out of website folder
local title="$1"
local goatcounter_url="$2"
local giscus_repo="$3"
local giscus_repo_id="$4"
local giscus_category="$5"
local giscus_category_id="$6"
local subdir_arg="$7"
if [ ! -f ${OUT_DIR}/index.html ]; then
_r "Site not built!"
if _confirm 'Build first?'; then
target_build "$title" "$goatcounter_url" \
"$giscus_repo" "$giscus_repo_id" \
"$giscus_category" "$giscus_category_id" \
"$subdir_arg"
else
_re "Exiting"
fi
fi
_g 'Press Ctrl+C to stop'
python3 -m http.server -d "${OUT_DIR}" 8000
}
# ---------------------------------------------------------------------------
# Main
# ---------------------------------------------------------------------------
main() {
# Convert long arguments to short for getopts
local args=()
while [[ $# -gt 0 ]]; do
local matched=0
for entry in "${ARGS[@]}"; do
local short long value
short=$(echo "$entry" | cut -d'|' -f1)
long=$(echo "$entry" | cut -d'|' -f2)
value=$(echo "$entry" | cut -d'|' -f3)
if [[ "$1" == "--${long}" ]]; then
args+=("-${short}")
[ -n "$value" ] && { args+=("$2"); shift; }
matched=1
break
fi
done
[ "$matched" = 0 ] && args+=("$1")
shift
done
set -- "${args[@]}"
# Default values (overridden by .env)
local target="help"
local title="${TITLE:-}"
local goatcounter_url="${GOATCOUNTER_URL:-}"
local giscus_repo="${GISCUS_REPO:-}"
local giscus_repo_id="${GISCUS_REPO_ID:-}"
local giscus_category="${GISCUS_CATEGORY:-}"
local giscus_category_id="${GISCUS_CATEGORY_ID:-}"
local subdir_arg=""
while getopts "$(_build_optstring)" opt; do
for entry in "${ARGS[@]}"; do
local short long action
short=$(echo "$entry" | cut -d'|' -f1)
long=$(echo "$entry" | cut -d'|' -f2)
action=$(echo "$entry" | cut -d'|' -f5)
if [[ "$opt" == "$short" ]]; then
if [[ "$action" == "target" ]]; then
target="$long"
else
printf -v "$action" '%s' "$OPTARG"
fi
break
fi
done
done
shift $((OPTIND - 1))
# Positional argument as target (backwards compatibility: ./web-create build)
if [[ "$target" == "help" && -n "${1:-}" ]]; then
target="${1}"
shift
fi
local func_name="target_${target//-/_}"
declare -f "$func_name" > /dev/null || _re "Unknown target: $target. Run $0 --help for available targets."
case "$target" in
build|serve)
"$func_name" "${title:-}" "$goatcounter_url" \
"$giscus_repo" "$giscus_repo_id" \
"$giscus_category" "$giscus_category_id" \
"$subdir_arg" ;;
*)
"$func_name" "$@" ;;
esac
}
main "$@"
Reference in a new issue View git blame Copy permalink