diff --git a/images/card-frame.svg b/images/card-frame.svg new file mode 100644 index 00000000..56ea647d --- /dev/null +++ b/images/card-frame.svg @@ -0,0 +1,57 @@ + + + + + + card-frame-sub-0 + + + + + card-frame-sub-1 + + + + + card-frame-sub-2 + + + + + card-frame-sub-3 + + + + + card-frame-sub-4 + + + + + card-frame-main-0 + + + + + card-frame-main-1 + + + + + card-frame-main-2 + + + + + card-frame-main-3 + + + + + card-frame-main-4 + + + + + card-frame-main-6 + \ No newline at end of file diff --git a/images/icon-awoken-count.svg b/images/icon-awoken-count.svg index 35e6b4e7..35522998 100644 --- a/images/icon-awoken-count.svg +++ b/images/icon-awoken-count.svg @@ -1,24 +1,4 @@ - @@ -79,4 +59,30 @@ + + awoken-count-bg(由外部CSS来改变颜色) + + + + + + + + awoken-count-common + + + + + + + + awoken-count-can-assist + + + + + + + + awoken-count-latent diff --git a/images/icon-awoken.svg b/images/icon-awoken.svg new file mode 100644 index 00000000..6b26f9f5 --- /dev/null +++ b/images/icon-awoken.svg @@ -0,0 +1,557 @@ + + + + + + awoken-0 + + + + + awoken-1 + + + + + awoken-2 + + + + + awoken-3 + + + + + awoken-4 + + + + + awoken-5 + + + + + awoken-6 + + + + + awoken-7 + + + + + awoken-8 + + + + + awoken-9 + + + + + awoken-10 + + + + + awoken-11 + + + + + awoken-12 + + + + + awoken-13 + + + + + awoken-14 + + + + + awoken-15 + + + + + awoken-16 + + + + + awoken-17 + + + + + awoken-18 + + + + + awoken-19 + + + + + awoken-20 + + + + + awoken-21 + + + + + awoken-22 + + + + + awoken-23 + + + + + awoken-24 + + + + + awoken-25 + + + + + awoken-26 + + + + + awoken-27 + + + + + awoken-28 + + + + + awoken-29 + + + + + awoken-30 + + + + + awoken-31 + + + + + awoken-32 + + + + + awoken-33 + + + + + awoken-34 + + + + + awoken-35 + + + + + awoken-36 + + + + + awoken-37 + + + + + awoken-38 + + + + + awoken-39 + + + + + awoken-40 + + + + + awoken-40-en + + + + + awoken-41 + + + + + awoken-42 + + + + + awoken-43 + + + + + awoken-44 + + + + + awoken-45 + + + + + awoken-46 + + + + + awoken-46-en + + + + + awoken-46-zh + + + + + awoken-47 + + + + + awoken-47-en + + + + + awoken-47-zh + + + + + awoken-48 + + + + + awoken-48-en + + + + + awoken-49 + + + + + awoken-50 + + + + + awoken-51 + + + + + awoken-52 + + + + + awoken-53 + + + + + awoken-54 + + + + + awoken-55 + + + + + awoken-56 + + + + + awoken-57 + + + + + awoken-58 + + + + + awoken-59 + + + + + awoken-60 + + + + + awoken-61 + + + + + awoken-62 + + + + + awoken-63 + + + + + awoken-64 + + + + + awoken-65 + + + + + awoken-66 + + + + + awoken-67 + + + + + awoken-68 + + + + + awoken-69 + + + + + awoken-70 + + + + + awoken-71 + + + + + awoken-72 + + + + + awoken-73 + + + + + awoken-74 + + + + + awoken-75 + + + + + awoken-76 + + + + + awoken-77 + + + + + awoken-78 + + + + + awoken-79 + + + + + awoken-80 + + + + + awoken-81 + + + + + awoken-82 + + + + + awoken-83 + + + + + awoken-84 + + + + + awoken-85 + + + + + awoken-86 + + + + + awoken-87 + + + + + awoken-88 + + + + + awoken-89 + + + + + awoken-90 + + + + + awoken-91 + + + + + awoken-92 + + + + + awoken-93 + + + + + awoken-94 + + + + + awoken-95 + + + + + awoken-96 + + + + + awoken-97 + + + + + awoken-98 + + + + + awoken-99 + + + + + awoken-100 + + + + + awoken-101 + + + + + awoken-102 + + + + + awoken-103 + + + + + awoken-104 + \ No newline at end of file diff --git a/images/icon-latent-block-bg.svg b/images/icon-latent-block-bg.svg index 8532d33f..832b9c4e 100644 --- a/images/icon-latent-block-bg.svg +++ b/images/icon-latent-block-bg.svg @@ -1,4 +1,4 @@ - + diff --git a/images/icon-type.svg b/images/icon-type.svg new file mode 100644 index 00000000..3537cf6c --- /dev/null +++ b/images/icon-type.svg @@ -0,0 +1,77 @@ + + + + + + type-0 + + + + + type-1 + + + + + type-2 + + + + + type-3 + + + + + type-4 + + + + + type-5 + + + + + type-6 + + + + + type-7 + + + + + type-8 + + + + + type-9 + + + + + type-9-en + + + + + type-12 + + + + + type-12-en + + + + + type-14 + + + + + type-15 + \ No newline at end of file diff --git a/images/project file/build symble svgs.js b/images/project file/build symble svgs.js index 7e329fc9..99e2433f 100644 --- a/images/project file/build symble svgs.js +++ b/images/project file/build symble svgs.js @@ -37,41 +37,64 @@ class Icon { //const dt = new DOMImplementation().createDocumentType('svg:svg', '-//W3C//DTD SVG 1.1//EN', 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'); //const svg = new DOMImplementation().createDocument(svgNS, 'svg', dt); -async function main({directory, idPre, svgFilename}) { +async function main({directory, idPre, svgFilename, rectFunc}) { const files = fs.readdirSync(directory); - const iconArr = []; - for (const file of files) - { - const icon = new Icon(file, directory); + const iconArr = files.map(file=>new Icon(file, directory)); + + for (const icon of iconArr) { await icon.init(); - iconArr.push(icon); } + iconArr.sort((a,b)=>{ - function nameNum(fileName){return parseInt(/^\d+/.exec(fileName)[0] || 0)} + function nameNum(fileName){return parseInt(/^\d+/.exec(fileName)?.[0] || 0)} return (nameNum(a.fileName) - nameNum(b.fileName)) || //先判断数字 (a.fileName.length - b.fileName.length); //然后判断文件名长度 }); + const svgDoc = new DOMImplementation().createDocument(svgNS, 'svg'); - for (const icon of iconArr) + let heightSum = 0; + for (let i = 0; i < iconArr.length; i++) { + const icon = iconArr[i]; console.log('正在处理 %s %s', directory, icon.fileName); - const symbol = svgDoc.createElement('symbol'); const parseName = path.parse(icon.fileName); - const regRes = /^(\d+)(.*)$/ig.exec(parseName.name); - let aid = regRes ? `${parseInt(regRes[1])}${regRes[2]}` : parseName.name; - symbol.setAttribute('id', `${idPre}-${aid}`); - symbol.setAttribute('viewBox', `0 0 32 32`); - svgDoc.documentElement.appendChild(symbol); + const iconId = regRes ? `${parseInt(regRes[1])}${regRes[2]}` : parseName.name; + const symbolId = `${idPre}-${iconId}`; + + const imgWidth = icon.webpInfo.width, imgHeight = icon.webpInfo.height; + const {x=0, y=0, width=imgWidth, height=imgHeight} = rectFunc ? rectFunc(imgWidth, imgHeight, parseName.name) : {}; const image = svgDoc.createElement('image'); - image.setAttribute('width', icon.webpInfo.width); - image.setAttribute('height', icon.webpInfo.height); + image.setAttribute('width', imgWidth); + image.setAttribute('height', imgHeight); image.setAttribute('href', icon.webpBase64()); + const symbol = svgDoc.createElement('symbol'); + symbol.setAttribute('id', symbolId); + symbol.setAttribute('viewBox', `${x} ${y} ${width} ${height}`); symbol.appendChild(image); + svgDoc.documentElement.appendChild(symbol); + + const use = svgDoc.createElement('use'); + use.setAttribute('href',`#${symbolId}`); + use.setAttribute('width', width); + use.setAttribute('height', height); + use.setAttribute('y', heightSum); + svgDoc.documentElement.appendChild(use); + + const text = svgDoc.createElement('text'); + text.textContent = symbolId; + text.setAttribute('dominant-baseline', "hanging"); + text.setAttribute('x', width); + text.setAttribute('y', heightSum); + svgDoc.documentElement.appendChild(text); + + heightSum += height; } + svgDoc.documentElement.setAttribute('height', heightSum); + const serialized = new XMLSerializer().serializeToString(svgDoc); const formattedXml = xmlFormatter(serialized, { indentation: '\t', @@ -85,6 +108,9 @@ async function main({directory, idPre, svgFilename}) { const tasks = [ {directory: './awokens', idPre: 'awoken', svgFilename: '../icon-awoken.svg'}, {directory: './types', idPre: 'type', svgFilename: '../icon-type.svg'}, + {directory: './card-frame', idPre: 'card-frame', svgFilename: '../card-frame.svg', rectFunc: (imgWidth, imgHeight, fileName)=>{ + return {x: fileName.includes("sub") ? -4 : 0, y: fileName.includes("sub") ? -4 : 0, width: 100, height: 100}; + }}, ]; tasks.forEach(main); \ No newline at end of file diff --git a/images/project file/card-frame/main-0.png b/images/project file/card-frame/main-0.png new file mode 100644 index 00000000..db640b2f Binary files /dev/null and b/images/project file/card-frame/main-0.png differ diff --git a/images/project file/card-frame/main-1.png b/images/project file/card-frame/main-1.png new file mode 100644 index 00000000..430c95da Binary files /dev/null and b/images/project file/card-frame/main-1.png differ diff --git a/images/project file/card-frame/main-2.png b/images/project file/card-frame/main-2.png new file mode 100644 index 00000000..6cf5c5fa Binary files /dev/null and b/images/project file/card-frame/main-2.png differ diff --git a/images/project file/card-frame/main-3.png b/images/project file/card-frame/main-3.png new file mode 100644 index 00000000..2e6d52aa Binary files /dev/null and b/images/project file/card-frame/main-3.png differ diff --git a/images/project file/card-frame/main-4.png b/images/project file/card-frame/main-4.png new file mode 100644 index 00000000..b18bd6b2 Binary files /dev/null and b/images/project file/card-frame/main-4.png differ diff --git a/images/project file/card-frame/main-6.png b/images/project file/card-frame/main-6.png new file mode 100644 index 00000000..797c1539 Binary files /dev/null and b/images/project file/card-frame/main-6.png differ diff --git a/images/project file/card-frame/sub-0.png b/images/project file/card-frame/sub-0.png new file mode 100644 index 00000000..1d66e22d Binary files /dev/null and b/images/project file/card-frame/sub-0.png differ diff --git a/images/project file/card-frame/sub-1.png b/images/project file/card-frame/sub-1.png new file mode 100644 index 00000000..e226f619 Binary files /dev/null and b/images/project file/card-frame/sub-1.png differ diff --git a/images/project file/card-frame/sub-2.png b/images/project file/card-frame/sub-2.png new file mode 100644 index 00000000..86a240d1 Binary files /dev/null and b/images/project file/card-frame/sub-2.png differ diff --git a/images/project file/card-frame/sub-3.png b/images/project file/card-frame/sub-3.png new file mode 100644 index 00000000..5d95b067 Binary files /dev/null and b/images/project file/card-frame/sub-3.png differ diff --git a/images/project file/card-frame/sub-4.png b/images/project file/card-frame/sub-4.png new file mode 100644 index 00000000..d2025a7c Binary files /dev/null and b/images/project file/card-frame/sub-4.png differ diff --git a/service-worker.js b/service-worker.js index a0746f68..fb2f23ce 100644 --- a/service-worker.js +++ b/service-worker.js @@ -6169,6 +6169,10 @@ const cachesMap = new Map([ "images/badge.png", "b0102fb737cfe9b6be6cf288f28950c7" ], + [ + "images/card-frame.svg", + "6138155bddb716d91ba0df6b17a8e876" + ], [ "images/CARDFRAME2.PNG", "2f744d67fba0e3fcfdcb1222daf2d95f" @@ -6191,11 +6195,11 @@ const cachesMap = new Map([ ], [ "images/icon-awoken-count.svg", - "c129f96e33314d17e849c64df5249474" + "1cdfd0cb59e447ad039446199e94ca7f" ], [ "images/icon-awoken.svg", - "13cecc7407f4d9af1d37118f5bed309b" + "3848e4f032573c3955adfd1187692302" ], [ "images/icon-bind.png", @@ -6215,7 +6219,7 @@ const cachesMap = new Map([ ], [ "images/icon-latent-block-bg.svg", - "8cd753af046ca4a333197afe3827fedc" + "bc557a806c57eec5fcccf0ef5a072e19" ], [ "images/icon-latent.png", @@ -6259,7 +6263,7 @@ const cachesMap = new Map([ ], [ "images/icon-type.svg", - "ba3f57a4b0ef72a91ffb15a460457397" + "e7925c55f255fd89c9df759144884ae7" ], [ "images/icon.png",