btclock/web-flasher-ng
3
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity Actions

Initial commit

Browse source
This commit is contained in:
Djuri 2024-12-07 17:48:13 +01:00
commit a892dfb3ba
27 changed files with 6607 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

79
components/AdvancedSettings.vue Normal file
View file

@ -0,0 +1,79 @@
<template>
<div class="card bg-base-100 shadow-xl">
<div class="card-body">
<div class="">
<div class="flex justify-between items-center">
<h2 class="card-title">Customize settings</h2>
<!-- <button class="btn btn-ghost btn-sm" @click="isExpanded = !isExpanded">
<span class="text-lg">{{ isExpanded ? '↑' : '↓' }}</span>
</button> -->
<div class="form-control">
<label class="label cursor-pointer p-0">
<span class="label-text">Enable</span>
&nbsp;
<input type="checkbox" v-model="localSettings.customize" class="checkbox" />
</label>
</div>
</div>
</div>
<div role="alert" class="alert alert-info">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="h-6 w-6 shrink-0 stroke-current">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
<span class="text-xs">If you customize settings, all existing settings including WiFi credentials will be overwritten. This is only
recommended for initial flashing.</span>
</div>
<div v-if="isExpanded" class="space-y-4 mt-4">
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Has Frontlight <small>Only Rev. B</small></span>
<input type="checkbox" class="toggle toggle-primary" :disabled="!localSettings.customize"
v-model="localSettings.hasFrontlight" @change="updateSettings" />
</label>
</div>
<div class="form-control">
<label class="label">
<span class="label-text">Display options</span>
</label>
<div class="space-y-2 ml-2">
<label class="label cursor-pointer">
<span class="label-text">White text on Black background</span>
<input type="radio" name="display-colors" class="radio radio-primary" value="white-on-black"
v-model="localSettings.displayColors" :disabled="!localSettings.customize" @change="updateSettings" />
</label>
<label class="label cursor-pointer">
<span class="label-text">Black text on White background</span>
<input type="radio" name="display-colors" class="radio radio-primary" value="black-on-white"
:disabled="!localSettings.customize" v-model="localSettings.displayColors" @change="updateSettings" />
</label>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
interface Settings {
hasFrontlight: boolean;
displayColors: string;
customize: boolean,
}
const emit = defineEmits(['update:settings']);
const isExpanded = ref(true);
const localSettings = reactive<Settings>({
customize: false,
hasFrontlight: false,
displayColors: 'black-on-white'
});
const updateSettings = () => {
emit('update:settings', { ...toRaw(localSettings) });
};
</script>

69
components/DeviceSelector.vue Normal file
View file

@ -0,0 +1,69 @@
<template>
<div class="card bg-base-100 shadow-xl">
<div class="card-body">
<div class="">
<h2 class="card-title">Device Selection</h2>
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Rev. A (2.13 inch)</span>
<input
type="radio"
name="device-type"
class="radio"
value="lolin_s3_mini-213epd"
v-model="selectedDevice"
/>
</label>
</div>
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Rev. A (2.9 inch) <small>unsupported</small></span>
<input
type="radio"
name="device-type"
class="radio"
value="lolin_s3_mini-29epd"
v-model="selectedDevice"
/>
</label>
</div>
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Rev. B (2.13 inch)</span>
<input
type="radio"
name="device-type"
class="radio"
value="btclock_rev_b-213epd"
v-model="selectedDevice"
/>
</label>
</div>
<div class="w-full md:flex hidden">
<div class=" grid flex-grow place-items-center">
<img src="/rev_b.png" class="max-w-none">
</div>
<div class="grid flex-grow p-5 text-sm">
<p>If you are unsure about which version you have, check the back of the BTClock.</p>
<p>The Rev. B has "Rev. B" written on the backside and two buttons on the back (Reset and Boot).</p>
<small>All versions before block #841273 (2024-04-28) are rev. A.<br>The 2.9 inch version is offered as a courtesy, you most likely have the 2.13 inch version.</small>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
const selectedDevice = ref();
const emit = defineEmits<{
(e: 'update:device', value: string): void;
}>();
watch(selectedDevice, (newValue) => {
emit('update:device', newValue);
});
</script>

16
components/FlashProgress.vue Normal file
View file

@ -0,0 +1,16 @@
<template>
<div class="w-full">
<progress
class="progress progress-primary w-full"
:value="progress"
max="100"
></progress>
<div class="text-center mt-2">{{ progress }}%</div>
</div>
</template>
<script setup lang="ts">
defineProps<{
progress: number;
}>();
</script>

48
components/VersionInformation.vue Normal file
View file

@ -0,0 +1,48 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue'
const version = ref<string>('')
const commitHash = ref<string>('')
const buildDate = ref<string>('')
const fetchFirmwareData = async () => {
try {
const [tagResponse, commitResponse, dateResponse] = await Promise.all([
fetch('firmware_v3/tag.txt'),
fetch('firmware_v3/commit.txt'),
fetch('firmware_v3/date.txt')
])
version.value = await tagResponse.text()
commitHash.value = await commitResponse.text()
const dateText = await dateResponse.text()
buildDate.value = new Date(dateText.trim()).toLocaleString()
} catch (error) {
console.error('Error fetching firmware data:', error)
}
}
onMounted(() => {
fetchFirmwareData()
})
</script>
<template>
<div class="card bg-base-100 shadow-xl ">
<div class="card-body">
<h2 class="card-title">Version information</h2>
<ul class="text-sm">
<li>Version {{ version }}</li>
<li>Commit hash: <a :href="'https://git.btclock.dev/btclock/btclock_v3/commit/' + commitHash "><code>{{ commitHash }}</code></a></li>
<li>Build date: <code>{{ buildDate }}</code></li>
<li><a href="https://git.btclock.dev/btclock/btclock_v3/src/branch/main/.forgejo/workflows/push.yaml">CI
script
compiling the
V3
firmware</a> | <a href="https://git.btclock.dev/btclock/btclock_v3/releases/latest">Release to be flashed</a> |
<a href="https://git.btclock.dev/btclock/btclock_v3">git repository</a></li>
</ul>
</div>
</div>
</template>