0.1.23 - Multiple Fixes for DX #26
10 changed files with 73 additions and 42 deletions
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "@firq/fgosite",
|
||||
"type": "module",
|
||||
"version": "0.1.22",
|
||||
"version": "0.1.23",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "astro dev",
|
||||
|
|
|
@ -1,29 +1,26 @@
|
|||
---
|
||||
import type { ImageMetadata } from 'astro'
|
||||
import { Image } from 'astro:assets'
|
||||
import mlb_ce from '../assets/ce/mlb.webp'
|
||||
import type { GlobImage } from '../types/generic'
|
||||
import { plsLoadImage } from '../utils/tools'
|
||||
|
||||
export interface Props {
|
||||
name: string
|
||||
imageFile: string
|
||||
mlb: string
|
||||
mlb: boolean
|
||||
}
|
||||
|
||||
const { mlb, imageFile, name } = Astro.props
|
||||
const imagePath = `/src/assets/ce/${imageFile}`
|
||||
const images_ces = import.meta.glob<{ default: ImageMetadata }>(
|
||||
'/src/assets/ce/*.png'
|
||||
)
|
||||
const images_ces = import.meta.glob<GlobImage>('/src/assets/ce/*.png')
|
||||
const loadedCEImage = plsLoadImage(images_ces, imagePath)
|
||||
|
||||
let mlb_image: string = 'mlbalign'
|
||||
if (mlb === 'false') {
|
||||
mlb_image = 'hidemlb'
|
||||
}
|
||||
const mlb_image = mlb ? 'mlbalign' : 'hidemlb'
|
||||
---
|
||||
|
||||
<article>
|
||||
<div>
|
||||
<Image src={images_ces[imagePath]()} alt={name} class="ce-crop" />
|
||||
<Image src={loadedCEImage} alt={name} class="ce-crop" />
|
||||
</div>
|
||||
<div class={mlb_image}>
|
||||
<Image src={mlb_ce} alt="Max-limit broken" class="mlb" />
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
---
|
||||
import type { ImageMetadata } from 'astro'
|
||||
import { Image } from 'astro:assets'
|
||||
import type { GlobImage } from '../types/generic'
|
||||
import { plsLoadImage } from '../utils/tools'
|
||||
|
||||
export interface Props {
|
||||
site: string
|
||||
|
@ -11,14 +12,20 @@ export interface Props {
|
|||
const { imageFile, link, site } = Astro.props
|
||||
const logoAltText = `${site} Logo`
|
||||
const imagePath = `/src/assets/social/${imageFile}`
|
||||
const images_logos = import.meta.glob<{ default: ImageMetadata }>(
|
||||
const images_logos = import.meta.glob<GlobImage>(
|
||||
'/src/assets/social/*.{png,webp}'
|
||||
)
|
||||
const loadedLogoImage = plsLoadImage(images_logos, imagePath)
|
||||
---
|
||||
|
||||
<a href={link} target="_blank" rel="noopener noreferrer" aria-label=`${site} - new window`>
|
||||
<a
|
||||
href={link}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
aria-label=`${site} - new window`
|
||||
>
|
||||
<article class="contact do-hover">
|
||||
<Image src={images_logos[imagePath]()} alt={logoAltText} />
|
||||
<Image src={loadedLogoImage} alt={logoAltText} />
|
||||
<div>
|
||||
<h2>{site}</h2>
|
||||
</div>
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
---
|
||||
import type { ImageMetadata } from 'astro';
|
||||
import { Image } from 'astro:assets';
|
||||
import type { GlobImage } from '../types/generic'
|
||||
import { plsLoadImage } from '../utils/tools'
|
||||
|
||||
export interface Props {
|
||||
name: string
|
||||
|
@ -11,12 +12,13 @@ export interface Props {
|
|||
|
||||
const { link, imageFile, origin, name } = Astro.props
|
||||
const imagePath = `/src/assets/favourites/${imageFile}`
|
||||
const images = import.meta.glob<{ default: ImageMetadata }>('/src/assets/favourites/*.{png,webp}')
|
||||
const images = import.meta.glob<GlobImage>('/src/assets/favourites/*.{png,webp}')
|
||||
const loadedImage = plsLoadImage(images, imagePath)
|
||||
---
|
||||
|
||||
<a href={link} target="_blank" rel="noopener noreferrer" aria-label=`${name} - new window`>
|
||||
<div class="heading">{name}</div>
|
||||
<Image src={images[imagePath]()} alt={name} />
|
||||
<Image src={loadedImage} alt={name} />
|
||||
<h2 class="subtext">
|
||||
{origin}
|
||||
</h2>
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
---
|
||||
import type { ImageMetadata } from 'astro';
|
||||
import { Image } from 'astro:assets';
|
||||
import type { GlobImage } from '../types/generic'
|
||||
import { plsLoadImage } from '../utils/tools'
|
||||
|
||||
export interface Props {
|
||||
name: string
|
||||
|
@ -16,8 +17,10 @@ export interface Props {
|
|||
const { bond10, ml, bondceImageFile, servantImageFile, np, skills, level, name } = Astro.props
|
||||
const servantImagePath = `/src/assets/servant/${servantImageFile}`
|
||||
const bondceImagePath = `/src/assets/ce/bond-ce/${bondceImageFile}`
|
||||
const images_servants = import.meta.glob<{ default: ImageMetadata }>('/src/assets/servant/*.{png,webp}')
|
||||
const images_bond_ces = import.meta.glob<{ default: ImageMetadata }>('/src/assets/ce/bond-ce/*.{png,webp}')
|
||||
const images_servants = import.meta.glob<GlobImage>('/src/assets/servant/*.{png,webp}')
|
||||
const images_bond_ces = import.meta.glob<GlobImage>('/src/assets/ce/bond-ce/*.{png,webp}')
|
||||
const loadedServantImage = plsLoadImage(images_servants, servantImagePath)
|
||||
const loadedBondCEImage = plsLoadImage(images_bond_ces, bondceImagePath)
|
||||
|
||||
let bondce_css: string = 'bond-ce'
|
||||
|
||||
|
@ -27,14 +30,14 @@ if (bond10 === false) {
|
|||
---
|
||||
|
||||
<article>
|
||||
<Image src={images_servants[servantImagePath]()} alt={name} />
|
||||
<Image src={loadedServantImage} alt={name} />
|
||||
<h2 class="subtext">
|
||||
Level {level}<br />
|
||||
{skills}<br />
|
||||
NP {np}
|
||||
</h2>
|
||||
<div class="expand-on-hover">
|
||||
<Image src={images_bond_ces[bondceImagePath]()} alt="" class={bondce_css}/>
|
||||
<Image src={loadedBondCEImage} alt="" class={bondce_css}/>
|
||||
<h2 class="subtext">Mana Loading: {ml === 'Not Unlocked' && <br />}{ml}</h2>
|
||||
</div>
|
||||
</article>
|
||||
|
|
|
@ -1,6 +1,8 @@
|
|||
---
|
||||
import type { ImageMetadata } from 'astro'
|
||||
import { Image } from 'astro:assets'
|
||||
import type { GlobImage } from '../types/generic'
|
||||
import { plsLoadImage } from '../utils/tools'
|
||||
|
||||
export interface Props {
|
||||
date: string
|
||||
title: string
|
||||
|
@ -24,13 +26,16 @@ const targetImagePath = `/src/assets/ta_icons/${targetImageFile}`
|
|||
const servantImagePath = `/src/assets/ta_icons/ta_servants/${servantImageFile}`
|
||||
|
||||
const formatted_date = new Date(date).toLocaleDateString('de-DE', options_date)
|
||||
const target_images = import.meta.glob<{ default: ImageMetadata }>(
|
||||
const target_images = import.meta.glob<GlobImage>(
|
||||
'/src/assets/ta_icons/*.{png,webp}'
|
||||
)
|
||||
const servant_images = import.meta.glob<{ default: ImageMetadata }>(
|
||||
const servant_images = import.meta.glob<GlobImage>(
|
||||
'/src/assets/ta_icons/ta_servants/*.{png,webp}'
|
||||
)
|
||||
|
||||
const loadedServantImage = plsLoadImage(servant_images, servantImagePath)
|
||||
const loadedTargetImage = plsLoadImage(target_images, targetImagePath)
|
||||
|
||||
let hasuser = ''
|
||||
if (user !== undefined) {
|
||||
hasuser = 'hasuser'
|
||||
|
@ -39,7 +44,7 @@ if (user !== undefined) {
|
|||
|
||||
<a href={link} target="_blank" rel="noopener noreferrer" aria-label={title}>
|
||||
<article>
|
||||
<Image src={target_images[targetImagePath]()} alt={title} class="icon" />
|
||||
<Image src={loadedTargetImage} alt={title} class="icon" />
|
||||
<div class="title">
|
||||
<h2>{title}</h2>
|
||||
</div>
|
||||
|
@ -50,7 +55,7 @@ if (user !== undefined) {
|
|||
{formatted_date}
|
||||
</p>
|
||||
<div class="expand-on-hover">
|
||||
<Image src={servant_images[servantImagePath ?? 'undefined']()} alt="" />
|
||||
<Image src={loadedServantImage} alt="" />
|
||||
<h2>{turns}</h2>
|
||||
</div>
|
||||
</article>
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
---
|
||||
import type { ImageMetadata } from 'astro'
|
||||
import { Image } from 'astro:assets'
|
||||
import type { GlobImage } from '../types/generic'
|
||||
import { plsLoadImage } from '../utils/tools'
|
||||
|
||||
export interface Props {
|
||||
title: string
|
||||
|
@ -11,14 +12,15 @@ export interface Props {
|
|||
const { imageFile, link, title } = Astro.props
|
||||
const logoAltText = `${title} Logo`
|
||||
const imagePath = `/src/assets/technologies/${imageFile}`
|
||||
const images_logos = import.meta.glob<{ default: ImageMetadata }>(
|
||||
const images_logos = import.meta.glob<GlobImage>(
|
||||
'/src/assets/technologies/*.{png,webp}'
|
||||
)
|
||||
const loadedImage = plsLoadImage(images_logos, imagePath)
|
||||
---
|
||||
|
||||
<a href={link} target="_blank" rel="noopener noreferrer" aria-label={title}>
|
||||
<article>
|
||||
<Image src={images_logos[imagePath]()} alt={logoAltText} />
|
||||
<Image src={loadedImage} alt={logoAltText} />
|
||||
<div>
|
||||
<h2>{title}</h2>
|
||||
</div>
|
||||
|
|
10
src/types/generic.ts
Normal file
10
src/types/generic.ts
Normal file
|
@ -0,0 +1,10 @@
|
|||
export interface IconsLookup {
|
||||
[key: string]: ImageMetadata
|
||||
}
|
||||
|
||||
interface GlobGeneric<T> {
|
||||
default: T
|
||||
}
|
||||
|
||||
export type GlobAny = GlobGeneric<any>
|
||||
export type GlobImage = GlobGeneric<ImageMetadata>
|
5
src/utils/tools.ts
Normal file
5
src/utils/tools.ts
Normal file
|
@ -0,0 +1,5 @@
|
|||
export function plsLoadImage(record: Record<string, () => Promise<{default: ImageMetadata}>>, path: string) {
|
||||
const loadedImage = record[path]?.();
|
||||
if (!loadedImage) throw new Error("Asset was not found:" + path);
|
||||
return loadedImage;
|
||||
}
|
|
@ -2,56 +2,56 @@
|
|||
{
|
||||
"name": "The Merciless One",
|
||||
"imageFile": "merciless_one.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "Ox-Demon King",
|
||||
"imageFile": "ox-demon.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "Holy Maiden's Teachings",
|
||||
"imageFile": "maidens_teachings.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "Kaleidoscope",
|
||||
"imageFile": "kaleidoscope.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "The Black Grail",
|
||||
"imageFile": "black_grail.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "A Fragment Of 2030",
|
||||
"imageFile": "2030.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "Outrage",
|
||||
"imageFile": "outrage.png",
|
||||
"mlb": "false"
|
||||
"mlb": false
|
||||
},
|
||||
{
|
||||
"name": "Vessel of the Saint",
|
||||
"imageFile": "vessel.png",
|
||||
"mlb": "false"
|
||||
"mlb": false
|
||||
},
|
||||
{
|
||||
"name": "Devilish Bodhisattva",
|
||||
"imageFile": "devilish_bodhisattva.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "500-Year Obsession",
|
||||
"imageFile": "500.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
},
|
||||
{
|
||||
"name": "Prisma Cosmos",
|
||||
"imageFile": "prisma_cosmos.png",
|
||||
"mlb": "true"
|
||||
"mlb": true
|
||||
}
|
||||
]
|
||||
|
|
Loading…
Reference in a new issue