klemek/coverify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: eslinit errors

Browse Source
This commit is contained in:
klemek
2025-12-20 19:10:29 +01:00
parent de96412248
commit a79f66d761
1 changed files with 115 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+115 -109
View File
@@ -101,12 +101,17 @@ function newImage() {
function download() { function download() {
const link = document.createElement("a"); const link = document.createElement("a");
link.download = `coverify-${new Date().getTime()}.png`; link.download = `coverify-${new Date().getTime().toString()}.png`;
link.href = canvas.value?.toDataURL() ?? "#"; link.href = canvas.value?.toDataURL() ?? "#";
link.click(); link.click();
} }
function applyFilter(f: Filter, r: number, g: number, b: number): [number, number, number] { function applyFilter(
f: Filter,
r: number,
g: number,
b: number,
): [number, number, number] {
switch (f) { switch (f) {
case Filter.Gray: case Filter.Gray:
const gray = 0.21 * r + 0.72 * g + 0.07 * b; const gray = 0.21 * r + 0.72 * g + 0.07 * b;
@@ -147,11 +152,12 @@ function draw() {
targetSize.value, targetSize.value,
targetSize.value, targetSize.value,
); );
const pixelData = imageData.data; // @ts-expect-error: safer to cast
const pixelData = imageData.data as number[];
for (let i = 0; i < pixelData.length; i += 4) { for (let i = 0; i < pixelData.length; i += 4) {
const r1 = (pixelData[i] as number); const r1 = pixelData[i];
const g1 = (pixelData[i + 1] as number); const g1 = pixelData[i + 1];
const b1 = (pixelData[i + 2] as number); const b1 = pixelData[i + 2];
const [r2, g2, b2] = applyFilter(filter.value, r1, g1, b1); const [r2, g2, b2] = applyFilter(filter.value, r1, g1, b1);
@@ -249,109 +255,109 @@ onMounted(() => {
<col style="width: 10%" /> <col style="width: 10%" />
</colgroup> </colgroup>
<tbody> <tbody>
<tr> <tr>
<td><label for="center-x">Center X:</label></td> <td><label for="center-x">Center X:</label></td>
<td> <td>
<input <input
id="center-x" id="center-x"
v-model="centerX" v-model="centerX"
type="range" type="range"
min="0" min="0"
max="1" max="1"
step="0.01" step="0.01"
@input="draw" @input="draw"
/> />
</td> </td>
<td>{{ (centerX * 100).toFixed(0) }}%</td> <td>{{ (centerX * 100).toFixed(0) }}%</td>
</tr> </tr>
<tr> <tr>
<td><label for="center-y">Center Y:</label></td> <td><label for="center-y">Center Y:</label></td>
<td> <td>
<input <input
id="center-y" id="center-y"
v-model="centerY" v-model="centerY"
type="range" type="range"
min="0" min="0"
max="1" max="1"
step="0.01" step="0.01"
@input="draw" @input="draw"
/> />
</td> </td>
<td>{{ (centerY * 100).toFixed(0) }}%</td> <td>{{ (centerY * 100).toFixed(0) }}%</td>
</tr> </tr>
<tr> <tr>
<td><label for="zoom">Zoom:</label></td> <td><label for="zoom">Zoom:</label></td>
<td> <td>
<input <input
id="zoom" id="zoom"
v-model="zoom" v-model="zoom"
type="range" type="range"
min="1" min="1"
max="4" max="4"
step="0.01" step="0.01"
@input="draw" @input="draw"
/> />
</td> </td>
<td>{{ (zoom * 100).toFixed(0) }}%</td> <td>{{ (zoom * 100).toFixed(0) }}%</td>
</tr> </tr>
<tr> <tr>
<td><label for="filter">Filter:</label></td> <td><label for="filter">Filter:</label></td>
<td> <td>
<select id="filter" v-model="filter" @change="draw"> <select id="filter" v-model="filter" @change="draw">
<option <option
v-for="value in Object.values(Filter)" v-for="value in Object.values(Filter)"
:key="`filter-${value}`" :key="`filter-${value}`"
> >
{{ value }} {{ value }}
</option> </option>
</select> </select>
</td> </td>
<td></td> <td></td>
</tr> </tr>
<tr> <tr>
<td><label for="pa-pos">Sticker Position:</label></td> <td><label for="pa-pos">Sticker Position:</label></td>
<td> <td>
<select id="pa-pos" v-model="paPos" @change="draw"> <select id="pa-pos" v-model="paPos" @change="draw">
<option <option
v-for="value in Object.values(PAPosition)" v-for="value in Object.values(PAPosition)"
:key="`pa-pos-${value}`" :key="`pa-pos-${value}`"
> >
{{ value }} {{ value }}
</option> </option>
</select> </select>
</td> </td>
<td></td> <td></td>
</tr> </tr>
<tr v-if="paPos !== PAPosition.None"> <tr v-if="paPos !== PAPosition.None">
<td><label for="pa-scale">Sticker Scale:</label></td> <td><label for="pa-scale">Sticker Scale:</label></td>
<td> <td>
<input <input
id="pa-scale" id="pa-scale"
v-model="paScale" v-model="paScale"
type="range" type="range"
min="0.10" min="0.10"
max="0.30" max="0.30"
step="0.01" step="0.01"
@input="draw" @input="draw"
/> />
</td> </td>
<td>{{ (paScale * 100).toFixed(0) }}%</td> <td>{{ (paScale * 100).toFixed(0) }}%</td>
</tr> </tr>
<tr v-if="paPos !== PAPosition.None"> <tr v-if="paPos !== PAPosition.None">
<td><label for="pa-margin">Sticker Margin:</label></td> <td><label for="pa-margin">Sticker Margin:</label></td>
<td> <td>
<input <input
id="pa-margin" id="pa-margin"
v-model="paMargin" v-model="paMargin"
type="range" type="range"
min="0" min="0"
max="0.1" max="0.1"
step="0.01" step="0.01"
@input="draw" @input="draw"
/> />
</td> </td>
<td>{{ (paMargin * 100).toFixed(0) }}%</td> <td>{{ (paMargin * 100).toFixed(0) }}%</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</template> </template>