commit 3c440a82d824baca022f730e666a1ea5875befe3 · veryroundbird.house/fixao3

+15

baseFonts.js

···

       1
       1
       +
       const baseFonts = {

     

       2
       2
       +
         georgia: 'Georgia',

     

       3
       3
       +
         verdana: 'Verdana',

     

       4
       4
       +
         opensans: 'Open Sans',

     

       5
       5
       +
         bricolage: 'Bricolage Grotesque',

     

       6
       6
       +
         spacemono: 'Space Mono',

     

       7
       7
       +
         inconsolata: 'Inconsolata',

     

       8
       8
       +
         bitter: 'Bitter',

     

       9
       9
       +
         archivo: 'Archivo',

     

       10
       10
       +
         outfit: 'Outfit',

     

       11
       11
       +
         notosans: 'Noto Sans',

     

       12
       12
       +
         librebaskerville: 'Libre Baskerville'

     

       13
       13
       +
       }

     

       14
       14
       +
       

     

       15
       15
       +
       export default baseFonts

+66 -61

main.jsx

···

       1
       1
       -
       import { getSeries, getUser, getWork } from "@fujocoded/ao3.js";

     

       2
       2
       -
       import { Hono } from "hono";

     

       3
       3
       -
       import PageSkeleton from "./pages/PageSkeleton.jsx";

     

       4
       4
       -
       import Home from "./pages/Home.jsx";

     

       5
       5
       -
       import Image from "./pages/Image.jsx";

     

       1
       1
       +
       import { getSeries, getUser, getWork } from "@fujocoded/ao3.js"

     

       2
       2
       +
       import { Hono } from "hono"

     

       3
       3
       +
       import PageSkeleton from "./pages/PageSkeleton.jsx"

     

       4
       4
       +
       import Home from "./pages/Home.jsx"

     

       5
       5
       +
       import Image from "./pages/Image.jsx"

     

       6
       6
       +
       import Generator from "./pages/Generator.jsx"

     

       6
       7
        
       

     

       7
       7
       -
       const app = new Hono();

     

       8
       8
       +
       const app = new Hono()

     

       8
       9
        
       

     

       9
       10
        
       app.get("/", (c) => {

     

       10
       10
       -
         return c.html(<Home />);

     

       11
       11
       -
       });

     

       11
       11
       +
         return c.html(<Home />)

     

       12
       12
       +
       })

     

       13
       13
       +
       

     

       14
       14
       +
       app.get("/generator", (c) => {

     

       15
       15
       +
         return c.html(<Generator />)

     

       16
       16
       +
       })

     

       12
       17
        
       

     

       13
       18
        
       app.get("/works/:workId", async (c) => {

     

       14
       14
       -
         const workId = c.req.param("workId");

     

       19
       19
       +
         const workId = c.req.param("workId")

     

       15
       20
        
         const work = await getWork({

     

       16
       21
        
           workId: c.req.param("workId"),

     

       17
       22
        
           chapterId: c.req.param("chapterId"),

     

       18
       18
       -
         });

     

       23
       23
       +
         })

     

       19
       24
        
         const authorsFormatted = work.authors.map((a) => {

     

       20
       20
       -
           if (a.anonymous) return "Anonymous";

     

       21
       21
       -
           if (a.pseud !== a.username) return `${a.pseud} (${a.username})`;

     

       22
       22
       -
           return a.username;

     

       23
       23
       -
         });

     

       25
       25
       +
           if (a.anonymous) return "Anonymous"

     

       26
       26
       +
           if (a.pseud !== a.username) return `${a.pseud} (${a.username})`

     

       27
       27
       +
           return a.username

     

       28
       28
       +
         })

     

       24
       29
        
         const authors = authorsFormatted.length > 1

     

       25
       30
        
           ? authorsFormatted.slice(0, -1).join(", ") + " & " +

     

       26
       31
        
             authorsFormatted.slice(-1)

     

       27
       27
       -
           : authorsFormatted[0];

     

       28
       28
       -
         const title = `${work.title} by ${authors} - ${work.fandoms.join(", ")}`;

     

       32
       32
       +
           : authorsFormatted[0]

     

       33
       33
       +
         const title = `${work.title} by ${authors} - ${work.fandoms.join(", ")}`

     

       29
       34
        
         const desc = `Rating: ${work.rating} | ${work.category} | Updated ${

     

       30
       35
        
           work.updatedAt ? work.updatedAt : work.publishedAt

     

       31
       36
        
         } | Words: ${work.words} | ${

     

       32
       37
        
           work.complete ? "Complete | " : ""

     

       33
       33
       -
         } ${work.summary}`;

     

       38
       38
       +
         } ${work.summary}`

     

       34
       39
        
         return c.html(

     

       35
       40
        
           <PageSkeleton title={title} description={desc} addr={`works/${workId}`} />,

     

       36
       36
       -
         );

     

       37
       37
       -
       });

     

       41
       41
       +
         )

     

       42
       42
       +
       })

     

       38
       43
        
       

     

       39
       44
        
       app.get("/works/:workId/chapters/:chapterId", async (c) => {

     

       40
       40
       -
         const workId = c.req.param("workId");

     

       41
       41
       -
         const chapterId = c.req.param("chapterId");

     

       45
       45
       +
         const workId = c.req.param("workId")

     

       46
       46
       +
         const chapterId = c.req.param("chapterId")

     

       42
       47
        
         const work = await getWork({

     

       43
       48
        
           workId: c.req.param("workId"),

     

       44
       49
        
           chapterId: c.req.param("chapterId"),

     

       45
       45
       -
         });

     

       50
       50
       +
         })

     

       46
       51
        
         const authorsFormatted = work.authors.map((a) => {

     

       47
       47
       -
           if (a.anonymous) return "Anonymous";

     

       48
       48
       -
           if (a.pseud !== a.username) return `${a.pseud} (${a.username})`;

     

       49
       49
       -
           return a.username;

     

       50
       50
       -
         });

     

       52
       52
       +
           if (a.anonymous) return "Anonymous"

     

       53
       53
       +
           if (a.pseud !== a.username) return `${a.pseud} (${a.username})`

     

       54
       54
       +
           return a.username

     

       55
       55
       +
         })

     

       51
       56
        
         const authors = authorsFormatted.length > 1

     

       52
       57
        
           ? authorsFormatted.slice(0, -1).join(", ") + " & " +

     

       53
       58
        
             authorsFormatted.slice(-1)

     

       54
       54
       -
           : authorsFormatted[0];

     

       59
       59
       +
           : authorsFormatted[0]

     

       55
       60
        
         const title =

     

       56
       61
        
           `${work.title} by ${authors}, Chapter ${work.chapterInfo.index}${

     

       57
       62
        
             work.chapterInfo.name ? `: ${work.chapterInfo.name}` : ""

     

       58
       58
       -
           } - ${work.fandoms.join(", ")}`;

     

       63
       63
       +
           } - ${work.fandoms.join(", ")}`

     

       59
       64
        
         const desc = `Rating: ${work.rating} | ${work.category} | Updated ${

     

       60
       65
        
           work.updatedAt ? work.updatedAt : work.publishedAt

     

       61
       66
        
         } | Words: ${work.words} | ${work.complete ? "Complete | " : ""} ${

     

       62
       67
        
           work.chapterInfo.summary ? work.chapterInfo.summary : work.summary

     

       63
       63
       -
         }`;

     

       68
       68
       +
         }`

     

       64
       69
        
         return c.html(

     

       65
       70
        
           <PageSkeleton

     

       66
       71
        
             title={title}

     

       67
       72
        
             description={desc}

     

       68
       73
        
             addr={`works/${workId}/chapters/${chapterId}`}

     

       69
       74
        
           />,

     

       70
       70
       -
         );

     

       71
       71
       -
       });

     

       75
       75
       +
         )

     

       76
       76
       +
       })

     

       72
       77
        
       

     

       73
       78
        
       app.get("/series/:seriesId", async (c) => {

     

       74
       74
       -
         const seriesId = c.req.param("seriesId");

     

       75
       75
       -
         const series = await getSeries({ seriesId: seriesId });

     

       79
       79
       +
         const seriesId = c.req.param("seriesId")

     

       80
       80
       +
         const series = await getSeries({ seriesId: seriesId })

     

       76
       81
        
         const authorsFormatted = series.authors.map((a) => {

     

       77
       77
       -
           if (a.anonymous) return "Anonymous";

     

       78
       78
       -
           if (a.pseud !== a.username) return `${a.pseud} (${a.username})`;

     

       79
       79
       -
           return a.username;

     

       80
       80
       -
         });

     

       82
       82
       +
           if (a.anonymous) return "Anonymous"

     

       83
       83
       +
           if (a.pseud !== a.username) return `${a.pseud} (${a.username})`

     

       84
       84
       +
           return a.username

     

       85
       85
       +
         })

     

       81
       86
        
         const authors = authorsFormatted.length > 1

     

       82
       87
        
           ? authorsFormatted.slice(0, -1).join(", ") + " & " +

     

       83
       88
        
             authorsFormatted.slice(-1)

     

       84
       84
       -
           : authorsFormatted[0];

     

       85
       85
       -
         const title = `${series.name} by ${authors}`;

     

       89
       89
       +
           : authorsFormatted[0]

     

       90
       90
       +
         const title = `${series.name} by ${authors}`

     

       86
       91
        
         const desc = ` Updated ${

     

       87
       92
        
           series.updatedAt ? series.updatedAt : series.publishedAt

     

       88
       93
        
         } | Works: ${series.worksCount} | ${

     

       89
       94
        
           series.complete ? "Complete | " : ""

     

       90
       90
       -
         } ${series.notes}`;

     

       95
       95
       +
         } ${series.notes}`

     

       91
       96
        
         return c.html(

     

       92
       97
        
           <PageSkeleton

     

       93
       98
        
             title={title}

     

       94
       99
        
             description={desc}

     

       95
       100
        
             addr={`series/${seriesId}`}

     

       96
       101
        
           />,

     

       97
       97
       -
         );

     

       98
       98
       -
       });

     

       102
       102
       +
         )

     

       103
       103
       +
       })

     

       99
       104
        
       

     

       100
       105
        
       app.get("/users/:username", async (c) => {

     

       101
       101
       -
         const username = c.req.param("username");

     

       102
       102
       -
         const user = await getUser({ username: username });

     

       106
       106
       +
         const username = c.req.param("username")

     

       107
       107
       +
         const user = await getUser({ username: username })

     

       103
       108
        
         return c.html(

     

       104
       109
        
           <PageSkeleton

     

       105
       110
        
             title={`${username}`}

     

       106
       111
        
             description={user.header}

     

       107
       112
        
             addr={`users/${username}`}

     

       108
       113
        
           />,

     

       109
       109
       -
         );

     

       110
       110
       -
       });

     

       114
       114
       +
         )

     

       115
       115
       +
       })

     

       111
       116
        
       

     

       112
       117
        
       app.get("/users/:username/pseuds/:pseud", async (c) => {

     

       113
       113
       -
         const username = c.req.param("username");

     

       114
       114
       -
         const pseud = c.req.param("pseud");

     

       115
       115
       -
         const user = await getUser({ username: username });

     

       118
       118
       +
         const username = c.req.param("username")

     

       119
       119
       +
         const pseud = c.req.param("pseud")

     

       120
       120
       +
         const user = await getUser({ username: username })

     

       116
       121
        
         return c.html(

     

       117
       122
        
           <PageSkeleton

     

       118
       123
        
             title={`${pseud} (${username})`}

     

       119
       124
        
             description={user.header}

     

       120
       125
        
             addr={`users/${username}`}

     

       121
       126
        
           />,

     

       122
       122
       -
         );

     

       123
       123
       -
       });

     

       127
       127
       +
         )

     

       128
       128
       +
       })

     

       124
       129
        
       

     

       125
       130
        
       app.get("/preview/works/:workId", async (c) => {

     

       126
       126
       -
         const workId = c.req.param("workId");

     

       131
       131
       +
         const workId = c.req.param("workId")

     

       127
       132
        
         const work = await getWork({

     

       128
       133
        
           workId: workId,

     

       129
       129
       -
         });

     

       130
       130
       -
         const addr = `works/${workId}`;

     

       131
       131
       -
         return Image({ data: work, addr: addr });

     

       132
       132
       -
       });

     

       134
       134
       +
         })

     

       135
       135
       +
         const addr = `works/${workId}`

     

       136
       136
       +
         return Image({ data: work, addr: addr })

     

       137
       137
       +
       })

     

       133
       138
        
       

     

       134
       139
        
       app.get("/preview/works/:workId/chapters/:chapterId", async (c) => {

     

       135
       135
       -
         const workId = c.req.param("workId");

     

       136
       136
       -
         const chapterId = c.req.param("chapterId");

     

       140
       140
       +
         const workId = c.req.param("workId")

     

       141
       141
       +
         const chapterId = c.req.param("chapterId")

     

       137
       142
        
         const work = await getWork({

     

       138
       143
        
           workId: workId,

     

       139
       144
        
           chapterId: chapterId,

     

       140
       140
       -
         });

     

       141
       141
       -
         const addr = `works/${workId}/chapters/${chapterId}`;

     

       145
       145
       +
         })

     

       146
       146
       +
         const addr = `works/${workId}/chapters/${chapterId}`

     

       142
       147
        
         return Image({ data: work, addr: addr })

     

       143
       148
        
       })

     

       144
       149
        
       

     

       145
       145
       -
       export default app;
     

       150
       150
       +
       export default app

+138

pages/Generator.jsx

···

       1
       1
       +
       import { raw } from "hono/html"

     

       2
       2
       +
       import { getSeries, getWork } from "@fujocoded/ao3.js"

     

       3
       3
       +
       import { useEffect, useState, useRef } from "hono/jsx/dom"

     

       4
       4
       +
       import Image from './Image.jsx'

     

       5
       5
       +
       import themes from '../themes.js'

     

       6
       6
       +
       import baseFonts from '../baseFonts.js'

     

       7
       7
       +
       import titleFonts from '../titleFonts.js'

     

       8
       8
       +
       

     

       9
       9
       +
       const Generator = ({ title, description, addr }) => {

     

       10
       10
       +
         const [url, setUrl] = useState('')

     

       11
       11
       +
         const [workData, setWorkData] = useState(null)

     

       12
       12
       +
         const [theme, setTheme] = useState('ao3')

     

       13
       13
       +
         const [baseFont, setBaseFont] = useState('verdana')

     

       14
       14
       +
         const [titleFont, setTitleFont] = useState('georgia')

     

       15
       15
       +
         const [props, setProps] = useState({

     

       16
       16
       +
           category: true,

     

       17
       17
       +
           rating: true,

     

       18
       18
       +
           warnings: false,

     

       19
       19
       +
           charTags: false,

     

       20
       20
       +
           relTags: false,

     

       21
       21
       +
           freeTags: false,

     

       22
       22
       +
           summary: true,

     

       23
       23
       +
           wordcount: true,

     

       24
       24
       +
           chapters: true

     

       25
       25
       +
           summaryType: 'basic',

     

       26
       26
       +
           customSummary: ''

     

       27
       27
       +
         })

     

       28
       28
       +
         

     

       29
       29
       +
         const updateProp = (name, value) => {

     

       30
       30
       +
           const newProps = props

     

       31
       31
       +
           newProps[name] = value

     

       32
       32
       +
           setProps(newProps)

     

       33
       33
       +
         }

     

       34
       34
       +
         

     

       35
       35
       +
         useEffect(async () => {

     

       36
       36
       +
           const workMatch = /\/works\/(?<workId>[0-9]+)(?\/chapters\/(?<chapterId>[0-9]+))?$/g

     

       37
       37
       +
           const seriesMatch = /\/series\/(?<seriesId>[0-9]+)$/g

     

       38
       38
       +
           if (workMatch.test(url)) {

     

       39
       39
       +
             const match = url.match(workMatch)

     

       40
       40
       +
             const data = match.groups.chapterId ? await getWork({workId: match.groups.workId, chapterId: match.groups.chapterId}) : await getWork({workId: match.groups.workId})

     

       41
       41
       +
             setWorkData(data)

     

       42
       42
       +
           } else if (seriesMatch.test(url)) {

     

       43
       43
       +
             const match = url.match(seriesMatch)

     

       44
       44
       +
             const data = await getSeries({seriesId: match.groups.seriesId})

     

       45
       45
       +
             setWorkData(data)

     

       46
       46
       +
           }

     

       47
       47
       +
           // otherwise do nothing

     

       48
       48
       +
         }, [url])

     

       49
       49
       +
         

     

       50
       50
       +
         useEffect(async () => {

     

       51
       51
       +
           const image = await Image(workData, props);

     

       52
       52
       +
         }, [workData])

     

       53
       53
       +
         

     

       54
       54
       +
         return (

     

       55
       55
       +
           <html lang="en">

     

       56
       56
       +
             <head>

     

       57
       57
       +
               <title>fixAO3 | embed card generator</title>

     

       58
       58
       +
               <link

     

       59
       59
       +
                 rel="favicon"

     

       60
       60
       +
                 href="https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/e1bf3632-3127-4828-0e01-47af78b4c200/public"

     

       61
       61
       +
               />

     

       62
       62
       +
               

     

       63
       63
       +
             </head>

     

       64
       64
       +
             <body>

     

       65
       65
       +
               <form id="generator">

     

       66
       66
       +
                 <div class="input-field">

     

       67
       67
       +
                   <label htmlFor="url">Work/Series URL</label>

     

       68
       68
       +
                   <input type="text" name="url" id="url" onChange={e => setUrl(e.target.value)} />

     

       69
       69
       +
                 </div>

     

       70
       70
       +
                 <details><summary>Style Settings</summary>

     

       71
       71
       +
                   <div class="input-field">

     

       72
       72
       +
                     <label htmlFor="theme">Theme</label>

     

       73
       73
       +
                     <select name="theme" id="theme" onChange={e => setTheme(e.target.value)}>

     

       74
       74
       +
                       {Object.keys(themes).map((th) => {

     

       75
       75
       +
                         return (

     

       76
       76
       +
                           <option value={th}>{themes[th]}</option>

     

       77
       77
       +
                         )

     

       78
       78
       +
                       })}

     

       79
       79
       +
                     </select>

     

       80
       80
       +
                   </div>

     

       81
       81
       +
                   <div class="input-field">

     

       82
       82
       +
                     <label htmlFor="baseFont">Base Font</label>

     

       83
       83
       +
                     <select name="baseFont" id="baseFont" onChange={e => setTheme(e.target.value)}>

     

       84
       84
       +
                       {Object.keys(baseFonts).sort().map((bf) => {

     

       85
       85
       +
                         return (

     

       86
       86
       +
                           <option value={bf}>{baseFonts[bf].displayName}</option>

     

       87
       87
       +
                         )

     

       88
       88
       +
                       })}

     

       89
       89
       +
                     </select>

     

       90
       90
       +
                   </div>

     

       91
       91
       +
                   <div class="input-field">

     

       92
       92
       +
                     <label htmlFor="titleFont">Title Font</label>

     

       93
       93
       +
                     <select name="titleFont" id="titleFont" onChange={e => setTheme(e.target.value)}>

     

       94
       94
       +
                       {Object.keys({...titleFonts, ...baseFonts}).sort().map((tf) => {

     

       95
       95
       +
                         return (

     

       96
       96
       +
                           <option value={tf}>{{...titleFonts, ...baseFonts}.displayName}</option>

     

       97
       97
       +
                         )

     

       98
       98
       +
                       })}

     

       99
       99
       +
                     </select>

     

       100
       100
       +
                   </div>

     

       101
       101
       +
                   <div class="input-field">

     

       102
       102
       +
                     <label htmlFor="features">Features:</label>

     

       103
       103
       +
                     <ul>

     

       104
       104
       +
                       <li><label><input type="checkbox" name="features[]" value="category" onChange={e => updateProps()} /> Category</label></li>

     

       105
       105
       +
                       <li><label><input type="checkbox" name="features[]" value="rating" /> Rating</label></li>

     

       106
       106
       +
                       <li><label><input type="checkbox" name="features[]" value="warnings" /> Archive Warnings</label></li>

     

       107
       107
       +
                       <li><label><input type="checkbox" name="features[]" value="chartags" /> Character Tags</label></li>

     

       108
       108
       +
                       <li><label><input type="checkbox" name="features[]" value="reltags" /> Relationship Tags</label></li>

     

       109
       109
       +
                       <li><label><input type="checkbox" name="features[]" value="freetags" /> Free Tags</label></li>

     

       110
       110
       +
                       <li><label><input type="checkbox" name="features[]" value="summary" /> Summary</label></li>

     

       111
       111
       +
                       <li><label><input type="checkbox" name="features[]" value="wordcount" /> Wordcount</label></li>

     

       112
       112
       +
                       <li><label><input type="checkbox" name="features[]" value="chapters" /> Chapters</label></li>

     

       113
       113
       +
                     </ul>

     

       114
       114
       +
                   </div>

     

       115
       115
       +
                   <div class="input-field">

     

       116
       116
       +
                     <label htmlFor="summaryOptions">Summary Type</label>

     

       117
       117
       +
                     <ul>

     

       118
       118
       +
                       <li><label><input type="radio" name="summaryType" value="basic" onChange={e => updateProp(e.target.name, e.target.value)} /> Story Summary</label></li>

     

       119
       119
       +
                       <li><label><input type="radio" name="summaryType" value="chapter" onChange={e => updateProp(e.target.name, e.target.value) /> Chapter Summary (if available)</label></li>

     

       120
       120
       +
                       <li><label><input type="radio" name="summaryType" value="custom" onChange={e => updateProp(e.target.name, e.target.value) /> Custom Summary</label></li>

     

       121
       121
       +
                     </ul>

     

       122
       122
       +
                   </div>

     

       123
       123
       +
                   {props.summaryType === 'custom' && (

     

       124
       124
       +
                     <div class="input-field">

     

       125
       125
       +
                       <label htmlFor="customSummary">Custom Summary</label>

     

       126
       126
       +
                       <textarea name="customSummary" id="customSummary" onChange={e => updateProp(e.target.name, e.target.value)}></textarea>

     

       127
       127
       +
                     </div>

     

       128
       128
       +
                   )}

     

       129
       129
       +
                 </details>

     

       130
       130
       +
               </form>

     

       131
       131
       +
               <div id="output">

     

       132
       132
       +
               </div>

     

       133
       133
       +
             </body>

     

       134
       134
       +
           </html>

     

       135
       135
       +
         )

     

       136
       136
       +
       }

     

       137
       137
       +
       

     

       138
       138
       +
       export default Generator

+1 -1

pages/Home.jsx

···

       40
       40
        
               <link rel="preconnect" href="https://fonts.googleapis.com" />

     

       41
       41
        
               <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

     

       42
       42
        
               <link

     

       43
       43
       -
                 href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&family=Momo+Signature&family=Parkinsans:wght@300..800&family=Stack+Sans+Notch:wght@200..700&display=swap"

     

       43
       43
       +
                 href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&family=Stack+Sans+Notch:wght@200..700&display=swap"

     

       44
       44
        
                 rel="stylesheet"

     

       45
       45
        
               />

     

       46
       46
        
               <link

+3 -54

pages/Image.jsx

···

       1
       1
        
       import { $ } from "bun"

     

       2
       2
        
       import DOM from "fauxdom"

     

       3
       3
       -
       

     

       4
       4
       -
       const themes = {

     

       5
       5
       -
         ao3: {

     

       6
       6
       -
           background: '#990000',

     

       7
       7
       -
           color: '#FFFFFF',

     

       8
       8
       -
           descBackground: '#FFFFFF',

     

       9
       9
       -
           descColor: '#000000',

     

       10
       10
       -
           accent: '#990000'

     

       11
       11
       -
         },

     

       12
       12
       -
         softEra: {

     

       13
       13
       -
           background: '#F9F5F5',

     

       14
       14
       -
           color: '#C8B3B3',

     

       15
       15
       -
           descBackground: '#F9F5F5',

     

       16
       16
       -
           descColor: '#414141',

     

       17
       17
       -
           accent: '#DB90A7'

     

       18
       18
       -
         },

     

       19
       19
       -
         wildCherry: {

     

       20
       20
       -
           

     

       21
       21
       -
         },

     

       22
       22
       -
         rosePine: {

     

       23
       23
       -
           background: '#191724',

     

       24
       24
       -
           color: '#e0def4',

     

       25
       25
       -
           descBackground: '#1f1d2e',

     

       26
       26
       -
           descColor: '#e0def4',

     

       27
       27
       -
           accent: '#eb6f92'

     

       28
       28
       -
         },

     

       29
       29
       -
         rosePineDawn: {

     

       30
       30
       -
           background: '#faf4ed',

     

       31
       31
       -
           color: '#575279',

     

       32
       32
       -
           descBackground: '#fffaf3',

     

       33
       33
       -
           descColor: '#575279',

     

       34
       34
       -
           accent: '#eb6f92'

     

       35
       35
       -
         },

     

       36
       36
       -
         rosePineMoon: {

     

       37
       37
       -
           background: '#232136',

     

       38
       38
       -
           color: '#e0def4',

     

       39
       39
       -
           descBackground: '#2a273f',

     

       40
       40
       -
           descColor: '#e0def4',

     

       41
       41
       -
           accent: '#b4637a'

     

       42
       42
       -
         },

     

       43
       43
       -
         solarizedLight: {

     

       44
       44
       -
         

     

       45
       45
       -
         },

     

       46
       46
       -
         solarizedDark: {

     

       47
       47
       -
         

     

       48
       48
       -
         },

     

       49
       49
       -
         squidgeworld: {

     

       50
       50
       -
         

     

       51
       51
       -
         },

     

       52
       52
       -
         superlove: {

     

       53
       53
       -
         

     

       54
       54
       -
         }

     

       55
       55
       -
       }

     

       3
       3
       +
       import themes from '../themes.js'

     

       4
       4
       +
       import baseFonts from '../baseFonts.js'

     

       56
       5
        
       

     

       57
       6
        
       async function Image ({ data, addr, opts = {} }) {

     

       58
       7
        
         const filename = addr.replaceAll("/", "-")

     
···

       96
       45
        
         const theme = opts.theme ? opts.theme : 'ao3'

     

       97
       46
        
         const baseFont = opts.baseFont ? opts.baseFont : 'Verdana'

     

       98
       47
        
         const titleFont = opts.titleFont ? opts.titleFont : 'Georgia'

     

       99
       99
       -
         await $`magick -size 1520x300 -background none -font ${titleFont} -pointsize 64 -fill ${theme.color} -gravity SouthWest pango:"<span size='16834'>${fandomString}</span>\n${titleString}${chapterString !== '' ? "\n<span size='36864'><i>"+chapterString+"</i></span>" : ''}" tmp/${filename}-title.png`

     

       48
       48
       +
         await $`magick -size 1520x300 -background none -font ${titleFont} -pointsize 64 -fill ${theme.color} pango:"<span gravity='south' gravity_hint='strong'><span size='16pt'>${fandomString}</span>\n${titleString}${chapterString !== '' ? "\n<span size='36pt'><i>"+chapterString+"</i></span></span>" : ''}" tmp/${filename}-title.png`

     

       100
       49
        
         await $`magick -size 1520x480 xc:${theme.descBackground} tmp/${filename}-box.png`

     

       101
       50
        
         await $`magick -size 1440x20 -background none -gravity East -font ${baseFont} -pointsize 18 -fill ${theme.descColor} caption:"https://archiveofourown.org/${addr}" tmp/${filename}-addr.png`

     

       102
       51
        
         await $`magick -size 1440x400 -background none -font ${baseFont} -pointsize 22 -fill ${theme.descColor} pango:"<b>Wordcount:</b> ${data.words}${chapterCountString} | <b>Rating:</b> ${data.rating}\n\n${summaryFormatted}" tmp/${filename}-desc.png`

+54

themes.js

···

       1
       1
       +
       const themes = {

     

       2
       2
       +
         ao3: {

     

       3
       3
       +
           background: '#990000',

     

       4
       4
       +
           color: '#FFFFFF',

     

       5
       5
       +
           descBackground: '#FFFFFF',

     

       6
       6
       +
           descColor: '#000000',

     

       7
       7
       +
           accent: '#990000'

     

       8
       8
       +
         },

     

       9
       9
       +
         softEra: {

     

       10
       10
       +
           background: '#F9F5F5',

     

       11
       11
       +
           color: '#C8B3B3',

     

       12
       12
       +
           descBackground: '#F9F5F5',

     

       13
       13
       +
           descColor: '#414141',

     

       14
       14
       +
           accent: '#DB90A7'

     

       15
       15
       +
         },

     

       16
       16
       +
         wildCherry: {

     

       17
       17
       +
           

     

       18
       18
       +
         },

     

       19
       19
       +
         rosePine: {

     

       20
       20
       +
           background: '#191724',

     

       21
       21
       +
           color: '#e0def4',

     

       22
       22
       +
           descBackground: '#1f1d2e',

     

       23
       23
       +
           descColor: '#e0def4',

     

       24
       24
       +
           accent: '#eb6f92'

     

       25
       25
       +
         },

     

       26
       26
       +
         rosePineDawn: {

     

       27
       27
       +
           background: '#faf4ed',

     

       28
       28
       +
           color: '#575279',

     

       29
       29
       +
           descBackground: '#fffaf3',

     

       30
       30
       +
           descColor: '#575279',

     

       31
       31
       +
           accent: '#eb6f92'

     

       32
       32
       +
         },

     

       33
       33
       +
         rosePineMoon: {

     

       34
       34
       +
           background: '#232136',

     

       35
       35
       +
           color: '#e0def4',

     

       36
       36
       +
           descBackground: '#2a273f',

     

       37
       37
       +
           descColor: '#e0def4',

     

       38
       38
       +
           accent: '#b4637a'

     

       39
       39
       +
         },

     

       40
       40
       +
         solarizedLight: {

     

       41
       41
       +
         

     

       42
       42
       +
         },

     

       43
       43
       +
         solarizedDark: {

     

       44
       44
       +
         

     

       45
       45
       +
         },

     

       46
       46
       +
         squidgeworld: {

     

       47
       47
       +
         

     

       48
       48
       +
         },

     

       49
       49
       +
         superlove: {

     

       50
       50
       +
         

     

       51
       51
       +
         }

     

       52
       52
       +
       }

     

       53
       53
       +
       

     

       54
       54
       +
       export default themes