add animations and future colors

This commit is contained in:
Julien Calixte
2023-07-22 19:39:46 +02:00
parent 82fc581b7a
commit 4d679b690d
7 changed files with 450 additions and 229 deletions

202
src/data/color.ts Normal file
View File

@@ -0,0 +1,202 @@
export const colors = [
'126,0.61,0.27',
'349,0.21,0.22',
'257,0.34,0.78',
'9,0.81,0.42',
'334,0.39,0.99',
'46,0.41,0.77',
'21,0.59,0.83',
'213,0.41,0.8',
'41,0.24,0.41',
'90,0.53,0.78',
'144,0.03,0.58',
'6,0.61,0.61',
'299,0.52,0.57',
'274,0.53,0.49',
'339,0.41,0.31',
'235,0.92,1',
'41,0.85,0.81',
'39,0.66,0.44',
'330,0.02,0.4',
'141,0.21,0.62',
'158,0.64,0.75',
'176,0.55,0.44',
'105,0.32,0.4',
'67,0.72,0.3',
'92,0.99,0.77',
'205,0.13,0.6',
'114,0.58,0.98',
'176,0.92,0.51',
'62,0.05,0.02',
'157,0.44,0.22',
'130,0.63,0.45',
'0,0.61,0.83',
'311,0.22,0.43',
'199,0.33,0.55',
'58,0.63,0.29',
'46,0.81,0.93',
'234,0.55,0.1',
'76,0.77,0.41',
'310,0.03,0.01',
'192,0.02,0.95',
'246,0.69,0.99',
'128,0.76,0.75',
'9,0.53,0.92',
'307,0.35,0.48',
'129,0.58,0.8',
'264,0.31,0.95',
'303,0.35,0.11',
'1,0.66,0.53',
'228,0.9,0.49',
'208,0.99,0.82',
'336,0.43,0.85',
'294,0.26,0.18',
'275,0.79,0.02',
'48,0.04,0.26',
'183,0.8,0.65',
'69,0.12,0.43',
'123,0.87,0.88',
'116,0.04,0.26',
'329,0.68,0.47',
'314,0.52,0.14',
'154,0.21,0.47',
'233,0.9,0.81',
'76,0.64,0.87',
'102,0.37,0.08',
'107,0.91,0.76',
'134,0.06,0.95',
'33,0.32,0.43',
'146,0.28,1',
'95,0.34,0.25',
'203,0.28,0.23',
'24,0.18,0.8',
'44,0.03,0.36',
'149,0.03,0.36',
'32,0.07,0.67',
'280,0.92,0.44',
'182,0.81,0.57',
'232,0.54,0.61',
'152,0.29,0.78',
'299,0.71,0.52',
'198,0.37,0.22',
'56,0.99,0.49',
'281,0.05,0.62',
'155,0.87,0.16',
'8,0.19,0.2',
'3,0.64,0.66',
'213,0.37,0.29',
'52,0.8,0.41',
'39,0.05,0.71',
'121,0.01,0.01',
'31,0.82,0.97',
'252,0.51,0.01',
'116,0.66,0.82',
'183,1,0.25',
'235,0.55,0.1',
'170,0.71,0.28',
'229,0.38,0.92',
'248,0.73,0.04',
'59,0.44,0.36',
'257,0.07,0.3',
'316,0.24,0.64',
'337,0.02,0.23',
'235,0.72,0.2',
'176,0.73,0.87',
'125,0.47,0.24',
'217,0.2,0.62',
'174,0.21,0.88',
'222,0.19,0.87',
'76,0.43,0.63',
'303,0.13,0.34',
'333,0.83,0.72',
'178,0.08,0.96',
'34,0.12,0.84',
'154,0.2,0.42',
'91,0.48,0.76',
'225,0.78,0.41',
'346,0.21,0.78',
'303,0.26,0.18',
'282,0.51,0.3',
'195,0.55,0.43',
'116,0.98,0.04',
'126,0.41,0.05',
'136,0.1,0.81',
'250,0.41,1',
'135,0.28,0',
'251,0.12,0.13',
'61,0.13,0.78',
'93,0.85,0.98',
'4,0.16,0.09',
'270,0,0.54',
'239,0.42,0.56',
'51,0.8,0.83',
'207,0.15,0.62',
'126,0.29,0.09',
'39,0.54,0.13',
'291,0.71,0.27',
'220,0.5,0.51',
'218,0.32,0.44',
'287,0.85,0.89',
'325,0.75,0.49',
'37,0.27,0.87',
'20,0.16,0.3',
'247,0.95,0.17',
'31,0.04,0.58',
'313,0.38,0.6',
'217,0.89,0.1',
'80,0.84,0.5',
'332,0.13,0.93',
'226,0.77,0.68',
'284,0.66,0.1',
'151,0.9,0.33',
'346,0.58,0.43',
'253,0.59,0.49',
'259,0.31,0.35',
'120,0.93,0.64',
'13,0.76,0.36',
'302,0.85,0.4',
'314,0.44,0.95',
'165,0.28,0.48',
'201,0.33,1',
'50,0.37,0.06',
'276,0.06,0.48',
'100,0.54,0.16',
'303,0.84,0.34',
'271,0.61,0.68',
'13,0.53,0.9',
'15,0.85,0.05',
'204,0.79,0.67',
'196,0.3,0.7',
'93,0.18,0.8',
'131,0.8,0.43',
'127,0.75,0.62',
'110,0.28,0.67',
'265,0.79,0.16',
'132,0.61,0.29',
'15,0.82,0.6',
'275,0.65,0.02',
'194,0.51,0.85',
'267,0.16,0.81',
'168,0.72,0.46',
'240,0.25,0.24',
'189,0.55,0.98',
'75,0.83,0.22',
'352,0.22,0.03',
'172,0.19,0.99',
'328,0.32,0.9',
'272,0.63,0.96',
'25,0.76,0.14',
'241,0.88,0.21',
'151,0.61,0.16',
'274,0.05,0.55',
'138,0.62,0.49',
'270,0.15,0.64',
'104,0.44,0.94',
'179,0.53,0.35',
'51,0.56,0.02',
'356,0.97,0.6',
'131,0.09,0',
'153,0.07,0.18',
'226,0.94,0.57',
'139,0.99,0.2'
]

202
src/data/dog.ts Normal file
View File

@@ -0,0 +1,202 @@
export const dogs = [
'Dachshund',
'Jagdterrier',
'Chesapeake Bay Retriever',
'Cretan Hound',
'Bulldog',
'Lapponian Herder',
'Vizsla',
'Norwegian Elkhound',
'Rat Terrier',
'Kangal Shepherd Dog',
'English Foxhound',
'Kanni',
'Finnish Spitz',
'Bloodhound',
'Siberian Husky',
'Paisley Terrier',
'Cairn Terrier',
'Chortai',
'Bucovina Shepherd Dog',
'German Longhaired Pointer',
'Portuguese Water Dog',
'Aidi',
'Dunker',
'Slovenský Kopov',
'Kokoni',
'Pembroke Welsh Corgi',
'English Mastiff',
'Papillon',
'Blue Picardy Spaniel',
'Cursinu',
'Coton de Tulear',
'Akita',
'King Charles Spaniel',
'Mudhol Hound',
'Serrano Bulldog',
'Telomian',
'Komondor',
'Chinese Crested Dog',
'Banjara Hound',
'Jagdterrier',
'Australian Cattle Dog',
'Afghan Hound',
'King Shepherd',
'Boykin Spaniel',
'Hamiltonstövare',
'Bull Arab',
'Basque Shepherd Dog',
'East Siberian Laika',
'Australian Cattle Dog',
'German Hound',
'Scottish Terrier',
'Volpino Italiano',
'Sussex Spaniel',
'Kanni',
'Otterhound',
'Kintamani',
'Mudi',
'Pastore della Lessinia e del Lagorai',
'Danish-Swedish Farmdog',
'Basset Hound',
'McNab dog',
'Pungsan Dog',
'Bouvier des Flandres',
'Westphalian Dachsbracke',
'Slovenský Cuvac',
'Portuguese Water Dog',
'American English Coonhound',
'Old Croatian Sighthound',
'Affenpinscher',
'Karakachan dog',
'Hierran Wolfdog',
'Samoyed',
'Magyar agár',
'Sarabi dog',
'Cane Corso',
"Braque d'Auvergne",
'Volpino Italiano',
'Newfoundland',
'Chow Chow',
'East Siberian Laika',
'Shih Tzu',
'English Springer Spaniel',
'Ratonero Bodeguero Andaluz',
'Australian Kelpie',
'New Zealand Heading Dog',
'Burgos Pointer',
'German Wirehaired Pointer',
'Serrano Bulldog',
'King Shepherd',
'Norwegian Lundehund',
'Lagotto Romagnolo',
'Basset Bleu de Gascogne',
'Vikhan',
'Clumber Spaniel',
'Field Spaniel',
'Greater Swiss Mountain Dog',
'Boerboel',
'Basenji',
'Thai Ridgeback',
'Rottweiler',
'Slovakian Wirehaired Pointer',
'Brittany',
'Welsh Sheepdog',
'Tosa',
'Olde English Bulldogge',
'Galgo Español',
'Mudi',
'Smooth Fox Terrier',
'Bedlington Terrier',
'Picardy Spaniel',
'Chien Français Blanc et Orange',
'Kokoni',
'Gull Terrier',
'Redbone Coonhound',
'Rajapalayam',
'Perro de Presa Canario',
'Austrian Pinscher',
'Saluki',
'Kintamani',
'Galician Shepherd Dog',
'Standard Schnauzer',
'Cão de Gado Transmontano',
'American Staffordshire Terrier',
'Wirehaired Pointing Griffon',
'Galician Shepherd Dog',
'Transylvanian Hound',
'Chien Français Blanc et Noir',
'Taigan',
'Kombai',
'Saint Hubert Jura Hound',
'Swedish Vallhund',
'Dogo Sardesco',
'German Shorthaired Pointer',
'Pražský Krysařík',
'Airedale Terrier',
'Chortai',
'Bernese Mountain Dog',
'Drever',
'Estonian Hound',
'Dutch Smoushond',
'Wire Fox Terrier',
'Neapolitan Mastiff',
'Bearded Collie',
'Telomian',
'English Cocker Spaniel',
'Airedale Terrier',
'Mountain Feist',
'Treeing Tennessee Brindle',
'Garafian Shepherd',
'Grand Griffon Vendéen',
'Gull Terrier',
'Villano de Las Encartaciones',
'Russian Spaniel',
'Yakutian Laika',
'Curly-Coated Retriever',
'Rajapalayam',
'Sabueso Español',
'Hovawart',
'Peruvian Inca Orchid',
'Pekingese',
'Icelandic Sheepdog',
'Cairn Terrier',
'Glen of Imaal Terrier',
'Australian Shepherd',
'Dunker',
'Briquet Griffon Vendéen',
'Scottish Deerhound',
'Mudhol Hound',
'Danish-Swedish Farmdog',
'Australian Terrier',
'Chinese Chongqing Dog',
'Irish Red and White Setter',
'Podenco Valenciano',
"Cirneco dell'Etna",
'German Shepherd Dog',
'Levriero Sardo',
'Romanian Mioritic Shepherd Dog',
'Finnish Hound',
'Segugio Maremmano',
'Andalusian Hound',
'Swedish White Elkhound',
'Tenterfield Terrier',
'Wirehaired Pointing Griffon',
'Cão Fila de São Miguel',
'Italian Greyhound',
'Jindo',
'Pyrenean Mountain Dog',
'Field Spaniel',
'Alaskan Klee Kai',
'Lupo Italiano',
'Silken Windhound',
'Cavalier King Charles Spaniel',
'Spanish Mastiff',
'Sinhala Hound',
'Grand Griffon Vendéen',
'Shiloh Shepherd',
'Sarabi dog',
'Cane Corso',
'Japanese Spitz',
'Dogue de Bordeaux'
]

View File

@@ -2,12 +2,15 @@
import { Feature } from '@/modules/feature/feature' import { Feature } from '@/modules/feature/feature'
import { computed } from 'vue' import { computed } from 'vue'
const props = defineProps<{ feature: Feature }>() const props = withDefaults(
defineProps<{ feature: Feature; isLive?: boolean }>(),
{ isLive: false }
)
const hasQualityIssues = computed(() => props.feature.qualityIssue > 0) const hasQualityIssues = computed(() => props.feature.qualityIssue > 0)
</script> </script>
<template> <template>
<div class="feature-item bin"> <div class="feature-item bin" :class="{ live: isLive }">
<div> <div>
{{ feature.name }} {{ feature.name }}
<span class="numeric">({{ feature.complexity }})</span> <span class="numeric">({{ feature.complexity }})</span>
@@ -21,6 +24,16 @@ const hasQualityIssues = computed(() => props.feature.qualityIssue > 0)
<style scoped lang="scss"> <style scoped lang="scss">
.feature-item { .feature-item {
transition-property: opacity, visibility;
transition-duration: 0.8s;
transition-timing-function: ease-out;
transition-delay: 1s 2s;
&.live {
visibility: hidden;
opacity: 0;
}
.red-bin { .red-bin {
border: 2px solid #ff7979; border: 2px solid #ff7979;
padding: 0 0.5rem 0.1rem; padding: 0 0.5rem 0.1rem;

View File

@@ -13,7 +13,9 @@ const featuresInProgress = computed(() =>
props.features.filter((feature) => feature.status === 'doing') props.features.filter((feature) => feature.status === 'doing')
) )
const featuresDone = computed(() => const featuresDone = computed(() =>
props.features.filter((feature) => feature.status === 'done') props.features
.filter((feature) => feature.status === 'done')
.sort((a, b) => (a.leadTime > b.leadTime ? -1 : 1))
) )
const remainingBlueBuckets = computed(() => const remainingBlueBuckets = computed(() =>
@@ -46,6 +48,8 @@ const isLive = computed(
</section> </section>
<section class="done"> <section class="done">
<h5>📝 ({{ featuresDone.length }})</h5> <h5>📝 ({{ featuresDone.length }})</h5>
<div>
<div class="blue-bin-container">
<div <div
v-for="blueBucket in remainingBlueBuckets" v-for="blueBucket in remainingBlueBuckets"
:key="blueBucket" :key="blueBucket"
@@ -53,19 +57,21 @@ const isLive = computed(
> >
Blue bucket Blue bucket
</div> </div>
</div>
<div v-if="isLive" class="live"> <div v-if="isLive" class="live">
{{ featuresDone.length }} features live! {{ featuresDone.length }} features live!
</div> </div>
<ul class="done-list" v-else-if="hasFeaturesDone"> <ul class="done-list">
<li v-for="feature in featuresDone" :key="feature.name"> <li v-for="feature in featuresDone" :key="feature.name">
<Starport <Starport
:port="feature.name" :port="feature.name"
style="height: calc(var(--feature-item-height) + 0.2rem)" style="height: calc(var(--feature-item-height) + 0.2rem)"
> >
<FeatureItem :feature="feature" /> <FeatureItem :feature="feature" :is-live="isLive" />
</Starport> </Starport>
</li> </li>
</ul> </ul>
</div>
</section> </section>
</li> </li>
</template> </template>

View File

@@ -21,9 +21,9 @@ export const featureSteps: FeatureStep[] = [
blueBuckets: 2 blueBuckets: 2
}, },
{ {
title: 'UAT', title: 'Test',
stepIndex: 1, stepIndex: 1,
blueBuckets: 3 blueBuckets: 2
}, },
{ {
title: 'Release', title: 'Release',

View File

@@ -4,7 +4,7 @@ import { describe, it } from 'vitest'
describe('feature fixture', () => { describe('feature fixture', () => {
it('creates lots of animals', () => { it('creates lots of animals', () => {
for (let i = 0; i < 200; i++) { for (let i = 0; i < 200; i++) {
console.log(`"${faker.animal.dog()}", `) console.log(`"${faker.color.hsl()}", `)
} }
}) })
}) })

View File

@@ -1,209 +1,7 @@
import { dogs } from '@/data/dog'
import { Feature } from '@/modules/feature/feature' import { Feature } from '@/modules/feature/feature'
const featureNames = [ export const features: Feature[] = dogs.map((name) => ({
'Dachshund',
'Jagdterrier',
'Chesapeake Bay Retriever',
'Cretan Hound',
'Bulldog',
'Lapponian Herder',
'Vizsla',
'Norwegian Elkhound',
'Rat Terrier',
'Kangal Shepherd Dog',
'English Foxhound',
'Kanni',
'Finnish Spitz',
'Bloodhound',
'Siberian Husky',
'Paisley Terrier',
'Cairn Terrier',
'Chortai',
'Bucovina Shepherd Dog',
'German Longhaired Pointer',
'Portuguese Water Dog',
'Aidi',
'Dunker',
'Slovenský Kopov',
'Kokoni',
'Pembroke Welsh Corgi',
'English Mastiff',
'Papillon',
'Blue Picardy Spaniel',
'Cursinu',
'Coton de Tulear',
'Akita',
'King Charles Spaniel',
'Mudhol Hound',
'Serrano Bulldog',
'Telomian',
'Komondor',
'Chinese Crested Dog',
'Banjara Hound',
'Jagdterrier',
'Australian Cattle Dog',
'Afghan Hound',
'King Shepherd',
'Boykin Spaniel',
'Hamiltonstövare',
'Bull Arab',
'Basque Shepherd Dog',
'East Siberian Laika',
'Australian Cattle Dog',
'German Hound',
'Scottish Terrier',
'Volpino Italiano',
'Sussex Spaniel',
'Kanni',
'Otterhound',
'Kintamani',
'Mudi',
'Pastore della Lessinia e del Lagorai',
'Danish-Swedish Farmdog',
'Basset Hound',
'McNab dog',
'Pungsan Dog',
'Bouvier des Flandres',
'Westphalian Dachsbracke',
'Slovenský Cuvac',
'Portuguese Water Dog',
'American English Coonhound',
'Old Croatian Sighthound',
'Affenpinscher',
'Karakachan dog',
'Hierran Wolfdog',
'Samoyed',
'Magyar agár',
'Sarabi dog',
'Cane Corso',
"Braque d'Auvergne",
'Volpino Italiano',
'Newfoundland',
'Chow Chow',
'East Siberian Laika',
'Shih Tzu',
'English Springer Spaniel',
'Ratonero Bodeguero Andaluz',
'Australian Kelpie',
'New Zealand Heading Dog',
'Burgos Pointer',
'German Wirehaired Pointer',
'Serrano Bulldog',
'King Shepherd',
'Norwegian Lundehund',
'Lagotto Romagnolo',
'Basset Bleu de Gascogne',
'Vikhan',
'Clumber Spaniel',
'Field Spaniel',
'Greater Swiss Mountain Dog',
'Boerboel',
'Basenji',
'Thai Ridgeback',
'Rottweiler',
'Slovakian Wirehaired Pointer',
'Brittany',
'Welsh Sheepdog',
'Tosa',
'Olde English Bulldogge',
'Galgo Español',
'Mudi',
'Smooth Fox Terrier',
'Bedlington Terrier',
'Picardy Spaniel',
'Chien Français Blanc et Orange',
'Kokoni',
'Gull Terrier',
'Redbone Coonhound',
'Rajapalayam',
'Perro de Presa Canario',
'Austrian Pinscher',
'Saluki',
'Kintamani',
'Galician Shepherd Dog',
'Standard Schnauzer',
'Cão de Gado Transmontano',
'American Staffordshire Terrier',
'Wirehaired Pointing Griffon',
'Galician Shepherd Dog',
'Transylvanian Hound',
'Chien Français Blanc et Noir',
'Taigan',
'Kombai',
'Saint Hubert Jura Hound',
'Swedish Vallhund',
'Dogo Sardesco',
'German Shorthaired Pointer',
'Pražský Krysařík',
'Airedale Terrier',
'Chortai',
'Bernese Mountain Dog',
'Drever',
'Estonian Hound',
'Dutch Smoushond',
'Wire Fox Terrier',
'Neapolitan Mastiff',
'Bearded Collie',
'Telomian',
'English Cocker Spaniel',
'Airedale Terrier',
'Mountain Feist',
'Treeing Tennessee Brindle',
'Garafian Shepherd',
'Grand Griffon Vendéen',
'Gull Terrier',
'Villano de Las Encartaciones',
'Russian Spaniel',
'Yakutian Laika',
'Curly-Coated Retriever',
'Rajapalayam',
'Sabueso Español',
'Hovawart',
'Peruvian Inca Orchid',
'Pekingese',
'Icelandic Sheepdog',
'Cairn Terrier',
'Glen of Imaal Terrier',
'Australian Shepherd',
'Dunker',
'Briquet Griffon Vendéen',
'Scottish Deerhound',
'Mudhol Hound',
'Danish-Swedish Farmdog',
'Australian Terrier',
'Chinese Chongqing Dog',
'Irish Red and White Setter',
'Podenco Valenciano',
"Cirneco dell'Etna",
'German Shepherd Dog',
'Levriero Sardo',
'Romanian Mioritic Shepherd Dog',
'Finnish Hound',
'Segugio Maremmano',
'Andalusian Hound',
'Swedish White Elkhound',
'Tenterfield Terrier',
'Wirehaired Pointing Griffon',
'Cão Fila de São Miguel',
'Italian Greyhound',
'Jindo',
'Pyrenean Mountain Dog',
'Field Spaniel',
'Alaskan Klee Kai',
'Lupo Italiano',
'Silken Windhound',
'Cavalier King Charles Spaniel',
'Spanish Mastiff',
'Sinhala Hound',
'Grand Griffon Vendéen',
'Shiloh Shepherd',
'Sarabi dog',
'Cane Corso',
'Japanese Spitz',
'Dogue de Bordeaux'
]
export const features: Feature[] = featureNames.map((name) => ({
name, name,
complexity: Math.floor(Math.random() * 6), complexity: Math.floor(Math.random() * 6),
leadTime: 0, leadTime: 0,