feat(web): WIP registration page UI UX

This commit is contained in:
Zack Spear
2023-09-25 18:22:22 -07:00
committed by Zack Spear
parent 858a93ccd2
commit e04b619071
6 changed files with 46 additions and 254 deletions

View File

@@ -4,18 +4,7 @@ Title="Registration"
Icon="icon-registration"
Tag="pencil"
---
<?PHP
/* Copyright 2005-2023, Lime Technology
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License version 2,
* as published by the Free Software Foundation.
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*/
?>
<?
<?php
function my_time_any($time) {
return $time ? _(my_time($time),0) : _('Anytime');
}
@@ -25,238 +14,6 @@ function my_time_now($time) {
$regGen = (int)$var['regGen'] ?? 0;
$trialExtensionEligible = $regGen === 0 || $regGen === 1;
echo '<unraid-i18n-host><unraid-registration></unraid-registration></unraid-i18n-host>';
?>
<style>
span.thanks{padding-left:12px;color:#6FA239;font-weight:bold;}
span.thanks.red{color:#F0000C;}
div.device{padding:0 12px;font-weight:normal;font-style:italic;}
div.remark{padding:0 12px;text-align:justify;}
</style>
<?if ( (strstr($var['regTy'], "unregistered")) or ($var['regTy']=="Trial") or (strstr($var['regTy'], "no connection")) or (strstr($var['regTy'], "withdrawn")) or (strstr($var['regTy'], "expired")) ):?>
<span class="thanks">_(Thank you for trying Unraid OS)_!</span>
<?elseif ( ($var['regTy']=="Basic") or ($var['regTy']=="Plus") or ($var['regTy']=="Pro") ):?>
<span class="thanks">_(Thank you for choosing Unraid OS)_!</span>
<?endif;?>
<?if (strstr($var['regTy'], "unregistered")):?>
<div markdown="1" class="remark">
:registration_1_plug:
Your server will not be usable until you purchase a Registration key or install a free 30 day *Trial* key. A *Trial*
key provides all the functionality of a *Pro* Registration key.
Registration keys are bound to your USB Flash boot device serial number (GUID). Please use a high quality name brand device
at least 1GB in size (min 4GB recommended).
Note: USB memory card readers are generally **not** supported because most do not present unique serial numbers.
:end
</div>
<?endif;?>
<?if ($var['regTy']=="Trial"):?>
<div markdown="1" class="remark">
:registration_3_plug:
Your *Trial* key includes all the functionality and device support of a *Pro* Registration key.
After your *Trial* key has reached expiration, your server **still functions normally** until the next time you **Stop** the array.
At that point, you may either purchase a Registration key, or request a *Trial* extension.
:end
</div>
<?endif;?>
<?if (strstr($var['regTy'], "no connection")):?>
<div markdown="1" class="remark">
<span class='red-text'>_(Cannot connect to key-server)_!</span>
_(Your *Trial* key requires an internet connection)_. _(Please check your)_ [_(Network Settings)_](NetworkSettings).
</div>
<?endif;?>
<?if (strstr($var['regTy'], "withdrawn")):?>
<div markdown="1" class="remark">
<span class='red-text'>_(Release has been withdrawn)_!</span>
_(This release has been withdrawn for use with *Trial* keys)_.
</div>
<?endif;?>
<?if (strstr($var['regTy'], "expired")):?>
<div markdown="1" class="remark">
<span class='red-text'>_(Your *Trial* key has expired)_.</span>
<? if ($trialExtensionEligible): ?>
:registration_4_plug:
To continue using Unraid OS you may purchase a Registration key. Alternately, you may request a *Trial* extension key.
:end
<? else: ?>
:registration_trial_extension_ineligible_plug:
You have used all your Trial extensions. To continue using Unraid OS you may purchase a Registration key.
:end
<? endif; ?>
</div>
<?endif;?>
<?if (strstr($var['regTy'], "invalid installation")):?>
<span class='thanks red'>_(Invalid *Trial* Installation)_</span>
<div markdown="1" class="remark">
:registration_5_plug:
It is not possible to use a *Trial* key with an existing Unraid OS installation.
You may purchase a Registration key corresponding to this USB Flash device to continue using this installation.
For more information, please [Contact Support](https://lime-technology.com/contact).
:end
</div>
<?endif;?>
<?if (strstr($var['regTy'], "missing")):?>
<span class='thanks red'>_(Missing Key File)_</span>
<div markdown="1" class="remark">
:registration_6_plug:
It appears that your Registration key file is corrupted or missing. The key file should be located in the
[config](/Registration/Browse?dir&#61;/boot/config) directory on your USB Flash boot device.
If you do not have a backup copy of your Registration key file, [Contact Support](https://lime-technology.com/contact).
If this was a *Trial* installation, you may purchase a Registration key.
:end
</div>
<?endif;?>
<?if (strstr($var['regTy'], "invalid key")):?>
<span class='thanks red'>_(The registered GUID does not match the USB Flash boot device GUID)_</span>
<?if (strstr($var['regTy'], "Trial")):?>
<div markdown="1" class="remark">
:registration_7_plug:
*Trial* installations are only valid with the originally registered USB Flash device.
To continue using this installation with this USB Flash device, you may purchase a Registration key.
:end
</div>
<?else:?>
<div markdown="1" class="remark">
:registration_8_plug:
The Registration key file does not correspond to the USB Flash boot device.
Please copy the correct key file to the [config](/Registration/Browse?dir&#61;/boot/config) directory
on your USB Flash boot device. If you do not have a backup copy of your key file, [Contact Support](https://lime-technology.com/contact).
If you want to replace your Registration key with a new key bound to this USB Flash device, click Replace Key below. An original key may be
replaced anytime. Thereafter, a replacement key may be replaced again after one year has passed. If you require
another replacement key sooner, [Contact Support](https://lime-technology.com/contact).
**Note:** Replacing a Registration key results in permanently *blacklisting* the previous USB Flash GUID.
:end
</div>
<?endif;?>
<?endif;?>
<?if (strstr($var['regTy'], "blacklisted")):?>
<span class='thanks red'>_(Blacklisted USB Flash GUID)_</span>
<div markdown="1" class="remark">
:registration_9_plug:
This USB Flash boot device has been *blacklisted*. This can occur as a result of transfering your Registration key to
a replacement USB Flash device, and you are currently booted from your old USB Flash device.
A USB Flash device may also be *blacklisted* if there is no serial number, or if we discover the serial number
is not unique (this is common with USB card readers).
For more information, please [Contact Support](https://lime-technology.com/contact).
:end
</div>
<?endif;?>
<?if ( ( !(strstr($var['regTy'], "invalid key")) and ((strstr($var['regTy'], "Trial"))) ) || (strstr($var['regTy'], "no connection")) || (strstr($var['regTy'], "withdrawn")) ):?>
_(***Trial*** key expires on)_:
: <?=my_time_now($var['regTm2'])?>
<?endif;?>
<?if ( strstr($var['regTy'], "invalid installation") || ( (strstr($var['regTy'], "invalid key")) && (strstr($var['regTy'], "Trial")) )):?>
_(Expiration)_:
: <?=my_time_now($var['regTm2'])?>
<?endif;?>
<?if ( (strstr($var['regTy'], "invalid installation")) || (strstr($var['regTy'], "invalid key")) || ($var['regTy']=="Basic") || ($var['regTy']=="Plus") || ($var['regTy']=="Pro") ):?>
_(Registered to)_:
: <?=htmlspecialchars($var['regTo'])?>
_(Registered on)_:
: <?=my_time_now($var['regTm'])?>
<?endif;?>
<?if ( (strstr($var['regTy'], "invalid installation")) or ( (strstr($var['regTy'], "invalid key")) and (!(strstr($var['regTy'], "Trial")))) ):?>
_(Registered GUID)_:
: <?=$var['regGUID']?>
<?endif;?>
<?if (strstr($var['regTy'], "flash device error")):?>
<span class='thanks red'>_(Error accessing your physical USB Flash boot device)_</span>
<div markdown="1" class="remark">
_(There is a physical problem accessing your USB Flash boot device)_. _(Please)_ [Contact Support](https://lime-technology.com/contact).
_(Flash GUID)_:
: _(Error code)_: <?=$var['regCheck']?>
<?else:?>
_(Flash GUID)_:
: <?=$var['flashGUID']?>
<?endif;?>
_(Flash Vendor)_:
: <?=$var['flashVendor']?>
_(Flash Product)_:
: <?=$var['flashProduct']?>
<?if ( ((strstr($var['regTy'], "invalid key")) and !(strstr($var['regTy'], "Trial"))) || ($var['regTy']=="Basic") || ($var['regTy']=="Plus") || ($var['regTy']=="Pro") ):?>
_(Replaceable)_:
: <?=my_time_any($var['regTm2'])?>
<?endif;?>
<?if ( !(strstr($var['regTy'], "flash device error")) || !(strstr($var['regTy'], "blacklisted")) ):?>
<div class="device"><?=sprintf(_("This server has %s attached storage device".($var['deviceCount']==1?'.':'s.')),$var['deviceCount'])?></div>
<?endif;?>
&nbsp;
: <unraid-i18n-host><unraid-key-actions></unraid-key-actions></unraid-i18n-host>

View File

@@ -41,8 +41,10 @@ const {
guid,
flashVendor,
flashProduct,
regGuid,
regTm,
regTo,
state,
stateData,
stateDataError,
} = storeToRefs(serverStore);
@@ -61,6 +63,15 @@ const items = computed(() => {
label: 'Updates Expire:',
text: dayjs(regTm.value).format('YYYY-MM-DD HH:mm'),
},
...(state.value === 'EGUID'
? [
{
label: 'Registered GUID:',
text: regGuid.value,
},
]
: []
),
{
label: 'Flash GUID:',
text: guid.value,

View File

@@ -1,4 +1,7 @@
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { useThemeStore } from '~/store/theme';
export interface Props {
label?: string;
text?: number | string | undefined;
@@ -8,9 +11,16 @@ withDefaults(defineProps<Props>(), {
label: '',
text: '',
});
const { darkMode } = storeToRefs(useThemeStore());
const evenBgColor = computed(() => {
return darkMode.value ? 'even:bg-grey-darkest' : 'even:bg-black/5';
});
</script>
<template>
<div class="text-16px p-16px sm:px-20px sm:grid sm:grid-cols-3 sm:gap-16px even:bg-gray-200/50">
<div :class="evenBgColor" class="text-16px p-16px sm:px-20px sm:grid sm:grid-cols-3 sm:gap-16px">
<dt class="font-semibold">{{ t(label) }}</dt>
<dd class="mt-4px leading-normal sm:col-span-2 sm:mt-0">
<span v-if="text" class="opacity-75">{{ text }}</span>

View File

@@ -1,19 +1,22 @@
<script setup lang="ts">
withDefaults(defineProps<{
hover?: boolean;
increasedPadding?: boolean;
noPadding?: boolean;
padding?: boolean;
}>(), {
hover: true,
increasedPadding: false,
noPadding: false,
padding: true,
});
</script>
<template>
<div
class="group/card text-left relative flex flex-col flex-1 text-beta bg-alpha border-2 border-solid border-gamma-opaque rounded-md shadow-md hover:shadow-orange/50 transition-all"
class="group/card text-left relative flex flex-col flex-1 text-beta bg-alpha border-2 border-solid border-gamma-opaque rounded-md shadow-md "
:class="[
!noPadding && 'p-4',
padding && 'p-4',
increasedPadding && 'md:p-6',
hover && 'hover:shadow-orange/50 transition-all',
]"
>
<slot></slot>

View File

@@ -1,5 +1,16 @@
<script setup lang="ts">
withDefaults(defineProps<{
maxWidth?: string;
}>(), {
maxWidth: 'max-w-1024px',
});
</script>
<template>
<div class="grid gap-y-24px max-w-1024px mx-auto px-16px">
<div
class="grid gap-y-24px mx-auto px-16px"
:class="maxWidth"
>
<slot></slot>
</div>
</template>

View File

@@ -39,7 +39,7 @@ const { rebootType } = storeToRefs(updateOsActionsStore);
</script>
<template>
<PageContainer>
<UiPageContainer>
<UpdateOsStatus :t="t" />
<UpdateOsUpdate
v-if="rebootType === ''"
@@ -52,7 +52,7 @@ const { rebootType } = storeToRefs(updateOsActionsStore);
<UpdateOsThirdPartyDrivers
v-if="rebootType === 'thirdPartyDriversDownloading'"
:t="t" />
</PageContainer>
</UiPageContainer>
</template>
<style lang="postcss">