From 15a30a21f35ce709803a6d8d3a33caa555d79ba1 Mon Sep 17 00:00:00 2001 From: Sparrow Date: Thu, 28 Sep 2023 13:06:12 +0900 Subject: [PATCH] Delete src directory --- src/App.css | 10 --- src/App.jsx | 195 ------------------------------------------------- src/index.css | 33 --------- src/localdb.js | 112 ---------------------------- src/main.jsx | 8 -- 5 files changed, 358 deletions(-) delete mode 100644 src/App.css delete mode 100644 src/App.jsx delete mode 100644 src/index.css delete mode 100644 src/localdb.js delete mode 100644 src/main.jsx diff --git a/src/App.css b/src/App.css deleted file mode 100644 index 28f01c5..0000000 --- a/src/App.css +++ /dev/null @@ -1,10 +0,0 @@ -#root { - position: relative; - max-width: 1280px; - min-width: 360px; - - margin: auto; - padding: 2rem; - text-align: center; -} - diff --git a/src/App.jsx b/src/App.jsx deleted file mode 100644 index 6e9e238..0000000 --- a/src/App.jsx +++ /dev/null @@ -1,195 +0,0 @@ -import { useState, useEffect, useCallback } from 'react'; -import './App.css'; -import JSZip from 'jszip'; -import {bookListDB} from './localdb'; -import styled,{keyframes,css} from "styled-components"; -import { Input, Button, Icon } from 'semantic-ui-react' - - - -const AppWrapper = styled.div` - position: relative; - margin: auto; - display: flex; - flex-flow: column nowrap; - transition: all 1s; - - h2{ - font-size: 24px; - font-weight: 700; - font-style: italic !important; - } - -`; - - -const InputBox = styled.div` - position: relative; - display: flex; - flex-flow: row nowrap; - gap: 4px; - font-size: 16px; - - >div.input{ - flex: 1; - } - - >button{ - width: 50px; - } -`; - - -const BookList = styled.div` - position: relative; - display: flex; - flex-flow: column nowrap; - - border-radius: 4px; - gap: 20px; - - &.hasMarginTop{ - margin-top: 20px; - } - - >div.item{ - position: relative; - - display: flex; - flex-flow: row nowrap; - justify-content: space-between; - border-radius: 5px; - padding: 12px 14px; - - font-size: 16px; - font-weight: 700; - - word-break: break-word; - background-color: rgba(0,0,0,0.068); - gap: 10px; - - >span{ - text-align: left; - - >span{ - &.size{ - position: relative; - background-color: rgba(0,0,0,0.3); - color: #fff; - border-radius: 5px; - font-size: 12px; - padding: 2px 5px; - margin-left: 10px; - user-select: none; - } - } - } - - &:hover{ - background-color: rgba(255,255,0,0.08); - box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.25); - } - } -`; - -const Loading = styled.div` - position: fixed; - top: 0; - left: 0; - z-index: 999; - - display: flex; - justify-content: center; - align-items: center; - - width: 100%; - height: 100%; - background-color: rgba(0,0,0,0.3); - color: #fff; - font-size: 32px; - font-weight: bold; - - opacity: 0; - pointer-events: none; - transition: all 0.18s; - - &.loading{ - opacity: 1; - } -`; - - - -function App() { - const [count, setCount] = useState(0); - const [isReady, setReady] = useState(false); - const [booklist, setBooklist] = useState([]); - const [value, setValue] = useState(''); - const [loading, setLoading] = useState(false); - - - useEffect(() => { - const zip = new JSZip(); - fetch('/ebook-list.json.zip').then((res) => res.arrayBuffer()).then((abb) => { - const oldSize = +localStorage.getItem('size'); - return bookListDB.count().then((count)=>{ - if(oldSize !== +abb.byteLength || count === 0) { - localStorage.setItem('size', abb.byteLength); - return zip.loadAsync(abb).then((z)=>{ - return z.file('ebook-list.json').async('string').then((data)=>{ - const jsonData = JSON.parse(data); - return bookListDB.putAll(jsonData).then((res)=>true); - }); - }); - } - return true; - }); - }).then(setReady).catch((err)=>{ - console.error('Error:', err); - }); - }, []); - - - const search = useCallback((v)=>{ - const keyword = v?.trim()??''; - if(keyword === '') return; - setLoading(true); - bookListDB.search(keyword) - .then(setBooklist) - .catch(console.error).finally(()=>{ - setLoading(false); - }); - }, []); - - - return - - setValue(e.target.value)} - onKeyUp={e=>e.keyCode===13 && search(value)} - icon='search' - /> - - 0 ? 'hasMarginTop' : ''}> - { - booklist.map((v,i)=>{ - return
- - {v.name} - {Number(v.size / 1024**2).toFixed(2)} MB - - -
- }) - } - - - Loading... - - - -} - -export default App diff --git a/src/index.css b/src/index.css deleted file mode 100644 index d2be72a..0000000 --- a/src/index.css +++ /dev/null @@ -1,33 +0,0 @@ -:root { - font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; - line-height: 1.5; - font-weight: 400; - - color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); - - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -webkit-text-size-adjust: 100%; -} - -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - -body { - margin: 0; - padding: 0; - min-width: 320px; - min-height: 100vh; - position: relative; - display: flex; - background-color: #eee; -} diff --git a/src/localdb.js b/src/localdb.js deleted file mode 100644 index 1be5f23..0000000 --- a/src/localdb.js +++ /dev/null @@ -1,112 +0,0 @@ -import Dexie from "dexie"; -const db = new Dexie('my-million-ebook'); - -/* -{ - "kind": "drive#file", - "fileExtension": "epub", - "mimeType": "application/epub+zip", - "webViewLink": "https://drive.google.com/file/d/145q4HOgucYg4K3WMsW0ilzZ2vBzg48_r/view?usp=drivesdk", - "webContentLink": "https://drive.google.com/uc?id=145q4HOgucYg4K3WMsW0ilzZ2vBzg48_r&export=download", - "size": "8506621", - "id": "145q4HOgucYg4K3WMsW0ilzZ2vBzg48_r", - "name": "세이노의 가르침.epub", - "createdTime": "2023-09-03T13:49:07.467Z", - "modifiedTime": "2023-09-03T13:23:38.000Z" -} -*/ - - -function createStore(collection, keyNames){ - db.version(1).stores({[collection]: keyNames}); - - return { - 'db': ()=>db[collection], - "setItem": (key, value) => { - if(value?.constructor?.name?.toLowerCase() !== 'object'){ - console.error('Not A plain object.'); - return false; - } - return db[collection].put({ - key, - ...value, - timestamp: Date.now(), - }).then(()=>true); - }, - "getItem": (key) => { - return new Promise((resolve)=>{ - return db[collection].get(key).then((res)=>{ - resolve(res) - }).catch((err)=>{ - resolve(null); - }) - }); - }, - "upsertItem": (key,value) => { - if(value?.constructor?.name?.toLowerCase() !== 'object'){ - console.error('Not A plain object.'); - return false; - } - return db[collection].update(key,{ - ...value, - timestamp: Date.now() - }).then((updatedCount)=>{ - if(updatedCount===0){ - return db[collection].put({ - key:key, - ...value, - timestamp: Date.now(), - //updateTimestamp: Date.now() - }).then(()=>true); - }else{ - return true; - } - }); - }, - "getLastMany": (limit=3, offset=0) => { - return db[collection] - .orderBy('timestamp') - .reverse() - .offset(offset) - .limit(limit) - .toArray(); - }, - "getFollowingMany": (reqkey, limit=1, includeSpecReqkey=false) => { - let count = 0; - return db[collection].orderBy('timestamp').reverse().filter((item)=>{ - if(item.key === reqkey){ - count++; - return includeSpecReqkey; - } - if(count> 0 && count <= limit){ - count++; - return true; - } - return false; - }).toArray(); - }, - "getAll": ()=> db[collection].orderBy('timestamp').toArray(), - "count": () => db[collection].count(), - "deleteByKey": (key) => db[collection].where('key').equals(key).delete(), - "primaryKeys": () => db[collection].orderBy('timestamp').reverse().primaryKeys(), - "putAll": (value) => { - if(!!value && value.constructor === Array){ - return db[collection].bulkPut(value); - } - if(!!value && value.constructor === Object){ - return db[collection].add(value); - } - }, - "search": (keyword) => { - return db[collection] - .orderBy('name') - .filter((list) => { - const escape = (txt) => txt.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'); - return new RegExp(escape(`${keyword}`),'gi').test(list.name) - }) - .toArray(); - } - } -} - -export const bookListDB = createStore('book-list', 'id, name, fileExtension, size, createdTime, modifiedTime'); \ No newline at end of file diff --git a/src/main.jsx b/src/main.jsx deleted file mode 100644 index 087ac25..0000000 --- a/src/main.jsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './App.jsx' - -import 'semantic-ui-css/semantic.min.css' -import './index.css' - -ReactDOM.createRoot(document.getElementById('root')).render()