change categories to tags in frontend

src/server/Images.ts

@@ -47,7 +47,7 @@ async function getExifOrientation(imagePath: string) {
   })
 }
 
-const getCategories = (db: Db, imageId: number) => {
+const getTags = (db: Db, imageId: number) => {
   const query = `
 select * from categories c
 inner join image_x_category ixc on c.id = ixc.category_id
@@ -63,12 +63,12 @@ const imageFromDb = (db: Db, imageId: number) => {
     file: `${UPLOAD_DIR}/${i.filename}`,
     url: `${UPLOAD_URL}/${encodeURIComponent(i.filename)}`,
     title: i.title,
-    categories: getCategories(db, i.id) as any[],
+    tags: getTags(db, i.id) as any[],
     created: i.created * 1000,
   }
 }
 
-const allImagesFromDb = (db: Db, categorySlug: string, sort: string) => {
+const allImagesFromDb = (db: Db, tagSlugs: string[], sort: string) => {
   const sortMap = {
     alpha_asc: [{filename: 1}],
     alpha_desc: [{filename: -1}],
@@ -78,16 +78,18 @@ const allImagesFromDb = (db: Db, categorySlug: string, sort: string) => {
 
   // TODO: .... clean up
   const wheresRaw: Record<string, any> = {}
-  if (categorySlug !== '') {
-    const c = db.get('categories', {slug: categorySlug})
+  if (tagSlugs.length > 0) {
+    const c = db.getMany('categories', {slug: {'$in': tagSlugs}})
     if (!c) {
       return []
     }
+    const where = db._buildWhere({
+      'category_id': {'$in': c.map(x => x.id)}
+    })
     const ids = db._getMany(`
 select i.id from image_x_category ixc
-inner join images i on i.id = ixc.image_id
-where ixc.category_id = ?;
-`, [c.id]).map(img => img.id)
+inner join images i on i.id = ixc.image_id ${where.sql};
+`, where.values).map(img => img.id)
     if (ids.length === 0) {
       return []
     }
@@ -101,12 +103,12 @@ where ixc.category_id = ?;
     file: `${UPLOAD_DIR}/${i.filename}`,
     url: `${UPLOAD_URL}/${encodeURIComponent(i.filename)}`,
     title: i.title,
-    categories: getCategories(db, i.id) as any[],
+    tags: getTags(db, i.id) as any[],
     created: i.created * 1000,
   }))
 }
 
-const allImagesFromDisk = (category: string, sort: string) => {
+const allImagesFromDisk = (tags: string[], sort: string) => {
   let images = fs.readdirSync(UPLOAD_DIR)
     .filter(f => f.toLowerCase().match(/\.(jpe?g|webp|png)$/))
     .map(f => ({
@@ -115,7 +117,7 @@ const allImagesFromDisk = (category: string, sort: string) => {
       file: `${UPLOAD_DIR}/${f}`,
       url: `${UPLOAD_URL}/${encodeURIComponent(f)}`,
       title: f.replace(/\.[a-z]+$/, ''),
-      categories: [] as any[],
+      tags: [] as any[],
       created: fs.statSync(`${UPLOAD_DIR}/${f}`).mtime.getTime(),
     }))
 

src/server/main.ts

@@ -63,9 +63,10 @@ app.get('/api/conf', (req, res) => {
 
 app.get('/api/newgame-data', (req, res) => {
   const q = req.query as any
+  const tagSlugs: string[] = q.tags ? q.tags.split(',') : []
   res.send({
-    images: Images.allImagesFromDb(db, q.category, q.sort),
-    categories: db.getMany('categories', {}, [{ title: 1 }]),
+    images: Images.allImagesFromDb(db, tagSlugs, q.sort),
+    tags: db.getMany('categories', {}, [{ title: 1 }]),
   })
 })
 
@@ -93,8 +94,22 @@ app.get('/api/index-data', (req, res) => {
 interface SaveImageRequestData {
   id: number
   title: string
-  category: string
+  tags: string[]
 }
+
+const setImageTags = (db: Db, imageId: number, tags: string[]) => {
+  tags.forEach((tag: string) => {
+    const slug = Util.slug(tag)
+    const id = db.upsert('categories', { slug, title: tag }, { slug }, 'id')
+    if (id) {
+      db.insert('image_x_category', {
+        image_id: imageId,
+        category_id: id,
+      })
+    }
+  })
+}
+
 app.post('/api/save-image', bodyParser.json(), (req, res) => {
   const data = req.body as SaveImageRequestData
   db.update('images', {
@@ -105,16 +120,8 @@ app.post('/api/save-image', bodyParser.json(), (req, res) => {
 
   db.delete('image_x_category', { image_id: data.id })
 
-  if (data.category) {
-    const title = data.category
-    const slug = Util.slug(title)
-    const id = db.upsert('categories', { slug, title }, { slug }, 'id')
-    if (id) {
-      db.insert('image_x_category', {
-        image_id: data.id,
-        category_id: id,
-      })
-    }
+  if (data.tags) {
+    setImageTags(db, data.id, data.tags)
   }
 
   res.send({ ok: true })
@@ -140,16 +147,8 @@ app.post('/api/upload', (req, res) => {
       created: Time.timestamp(),
     })
 
-    if (req.body.category) {
-      const title = req.body.category
-      const slug = Util.slug(title)
-      const id = db.upsert('categories', { slug, title }, { slug }, 'id')
-      if (id) {
-        db.insert('image_x_category', {
-          image_id: imageId,
-          category_id: id,
-        })
-      }
+    if (req.body.tags) {
+      setImageTags(db, imageId as number, req.body.tags)
     }
 
     res.send(Images.imageFromDb(db, imageId as number))