colin/banzuke-sage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Adds functionality for drag and dropping from previous record.

Browse Source
This commit is contained in:
Colin Diem
2023-12-02 14:50:48 -05:00
parent 4c98cb7219
commit 06b29a52e6
3 changed files with 253 additions and 211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

167
src/components/FirstAttempt.vue
View File

@@ -1,137 +1,62 @@
<template> <template>
<v-container> <v-container>
<v-sheet max-width="600px" height="800px"> <v-row>
<v-row no-gutters> <v-col cols="4">
<v-col>East</v-col> <v-row>
<v-col>Rank</v-col> <v-col><h3>East</h3></v-col>
<v-col>West</v-col> <v-col><h3>Rank</h3></v-col>
<v-col><h3>West</h3></v-col>
</v-row> </v-row>
<v-row v-for="rank in ranks" :key="rank.name"> <v-row v-for="rank in ranks" :key="rank.name">
<v-col> <v-col>
<v-chip :color="rank.east.record.wins > rank.east.record.losses + rank.east.record.withdrawls ? 'green' : 'red'" v-if="rank.east" draggable>{{ rank.east.name }}: {{ rank.east.record.wins }}-{{ rank.east.record.losses }}-{{ rank.east.record.withdrawls }}</v-chip> <v-chip
:color="rank.east.record.wins > rank.east.record.losses + rank.east.record.withdrawls ? 'green' : 'red'"
v-if="rank.east" draggable @dragstart="dragStart" @dragend="dragEnd">
{{ rank.east.name }}: {{ rank.east.record.wins }}-{{
rank.east.record.losses }}-{{ rank.east.record.withdrawls }}
</v-chip>
</v-col> </v-col>
<v-col>{{ rank.name }}</v-col> <v-col>{{ rank.name }}</v-col>
<v-col> <v-col>
<v-chip :color="rank.west.record.wins > rank.west.record.losses + rank.west.record.withdrawls ? 'green' : 'red'" v-if="rank.west" draggable>{{ rank.west.name }}: {{ rank.west.record.wins }}-{{ rank.west.record.losses }}-{{ rank.west.record.withdrawls }}</v-chip> <v-chip
:color="rank.west.record.wins > rank.west.record.losses + rank.west.record.withdrawls ? 'green' : 'red'"
v-if="rank.west" draggable @dragstart="dragStart" @dragend="dragEnd">
{{ rank.west.name }}: {{ rank.west.record.wins }}-{{
rank.west.record.losses }}-{{ rank.west.record.withdrawls }}
</v-chip>
</v-col>
</v-row>
</v-col>
<v-col cols="4"></v-col>
<v-col cols="4">
<v-row>
<v-col><h3>East</h3></v-col>
<v-col><h3>Rank</h3></v-col>
<v-col><h3>West</h3></v-col>
</v-row>
<v-row v-for="rank in ranks" :key="rank.name">
<v-col><v-chip></v-chip></v-col>
<v-col>{{ rank.name }}</v-col>
<v-col><v-chip></v-chip></v-col>
</v-row>
</v-col> </v-col>
</v-row> </v-row>
</v-sheet>
</v-container> </v-container>
</template> </template>
<script setup> <script setup>
import rikishi from '@/components/rikishi.js'; import ranks from '@/components/ranks.js';
const ranks = [ let currentRikishi;
{
name: 'Yokozuna', function dragStart(event) {
east: rikishi.find(x => x.name === 'Terunofuji') currentRikishi = event.originalTarget.innerText;
},
{
name: 'Ozeki',
east: rikishi.find(x => x.name === 'Takakeisho'),
west: rikishi.find(x => x.name === 'Kirishima')
},
{
name: 'Ozeki',
west: rikishi.find(x => x.name === 'Hoshoryu'),
},
{
name: 'Sekiwake',
east: rikishi.find(x => x.name === 'Daieisho'),
west: rikishi.find(x => x.name === 'Wakamotoharu')
},
{
name: 'Sekiwake',
east: rikishi.find(x => x.name === 'Kotonowaka'),
},
{
name: 'Komosubi',
east: rikishi.find(x => x.name === 'Abi'),
west: rikishi.find(x => x.name === 'Hokutofuji')
},
{
name: 'Maegashira 1',
east: rikishi.find(x => x.name === 'Asanoyama'),
west: rikishi.find(x => x.name === 'Ura')
},
{
name: 'Maegashira 2',
east: rikishi.find(x => x.name === 'Shodai'),
west: rikishi.find(x => x.name === 'Meisei')
},
{
name: 'Maegashira 3',
east: rikishi.find(x => x.name === 'Takayasu'),
west: rikishi.find(x => x.name === 'Tobizaru')
},
{
name: 'Maegashira 4',
east: rikishi.find(x => x.name === 'Gonoyama'),
west: rikishi.find(x => x.name === 'Nishikigi')
},
{
name: 'Maegashira 5',
east: rikishi.find(x => x.name === 'Onosho'),
west: rikishi.find(x => x.name === 'Midorifuji')
},
{
name: 'Maegashira 6',
east: rikishi.find(x => x.name === 'Shonannoumi'),
west: rikishi.find(x => x.name === 'Takanosho')
},
{
name: 'Maegashira 7',
east: rikishi.find(x => x.name === 'Hokuseiho'),
west: rikishi.find(x => x.name === 'Kinbozan')
},
{
name: 'Maegashira 8',
east: rikishi.find(x => x.name === 'Endo'),
west: rikishi.find(x => x.name === 'Atamifuji')
},
{
name: 'Maegashira 9',
east: rikishi.find(x => x.name === 'Myogiryu'),
west: rikishi.find(x => x.name === 'Mitakeumi')
},
{
name: 'Maegashira 10',
east: rikishi.find(x => x.name === 'Ryuden'),
west: rikishi.find(x => x.name === 'Kotoeko')
},
{
name: 'Maegashira 11',
east: rikishi.find(x => x.name === 'Sadanoumi'),
west: rikishi.find(x => x.name === 'Hiradoumi')
},
{
name: 'Maegashira 12',
east: rikishi.find(x => x.name === 'Oho'),
west: rikishi.find(x => x.name === 'Tamawashi')
},
{
name: 'Maegashira 13',
east: rikishi.find(x => x.name === 'Takarafuji'),
west: rikishi.find(x => x.name === 'Tsurugisho')
},
{
name: 'Maegashira 14',
east: rikishi.find(x => x.name === 'Tomokaze'),
west: rikishi.find(x => x.name === 'Ichiyamamoto')
},
{
name: 'Maegashira 15',
east: rikishi.find(x => x.name === 'Tohakuryu'),
west: rikishi.find(x => x.name === 'Churanoumi')
},
{
name: 'Maegashira 16',
east: rikishi.find(x => x.name === 'Roga'),
west: rikishi.find(x => x.name === 'Nishikifuji')
},
{
name: 'Maegashira 17',
east: rikishi.find(x => x.name === 'Kitanowaka')
} }
];
function dragEnd(event) {
let newElement = document.elementFromPoint(event.x, event.y);
console.log(newElement);
let rikishiName = currentRikishi.split(':')[0];
newElement.children[1].innerText = rikishiName;
}
</script> </script>

117
src/components/ranks.js Normal file
View File

@@ -0,0 +1,117 @@
import rikishi from "./rikishi";
const ranks = [
{
name: 'Yokozuna',
east: rikishi.find(x => x.name === 'Terunofuji')
},
{
name: 'Ozeki',
east: rikishi.find(x => x.name === 'Takakeisho'),
west: rikishi.find(x => x.name === 'Kirishima')
},
{
name: 'Ozeki',
west: rikishi.find(x => x.name === 'Hoshoryu'),
},
{
name: 'Sekiwake',
east: rikishi.find(x => x.name === 'Daieisho'),
west: rikishi.find(x => x.name === 'Wakamotoharu')
},
{
name: 'Sekiwake',
east: rikishi.find(x => x.name === 'Kotonowaka'),
},
{
name: 'Komusubi',
east: rikishi.find(x => x.name === 'Abi'),
west: rikishi.find(x => x.name === 'Hokutofuji')
},
{
name: 'Maegashira 1',
east: rikishi.find(x => x.name === 'Asanoyama'),
west: rikishi.find(x => x.name === 'Ura')
},
{
name: 'Maegashira 2',
east: rikishi.find(x => x.name === 'Shodai'),
west: rikishi.find(x => x.name === 'Meisei')
},
{
name: 'Maegashira 3',
east: rikishi.find(x => x.name === 'Takayasu'),
west: rikishi.find(x => x.name === 'Tobizaru')
},
{
name: 'Maegashira 4',
east: rikishi.find(x => x.name === 'Gonoyama'),
west: rikishi.find(x => x.name === 'Nishikigi')
},
{
name: 'Maegashira 5',
east: rikishi.find(x => x.name === 'Onosho'),
west: rikishi.find(x => x.name === 'Midorifuji')
},
{
name: 'Maegashira 6',
east: rikishi.find(x => x.name === 'Shonannoumi'),
west: rikishi.find(x => x.name === 'Takanosho')
},
{
name: 'Maegashira 7',
east: rikishi.find(x => x.name === 'Hokuseiho'),
west: rikishi.find(x => x.name === 'Kinbozan')
},
{
name: 'Maegashira 8',
east: rikishi.find(x => x.name === 'Endo'),
west: rikishi.find(x => x.name === 'Atamifuji')
},
{
name: 'Maegashira 9',
east: rikishi.find(x => x.name === 'Myogiryu'),
west: rikishi.find(x => x.name === 'Mitakeumi')
},
{
name: 'Maegashira 10',
east: rikishi.find(x => x.name === 'Ryuden'),
west: rikishi.find(x => x.name === 'Kotoeko')
},
{
name: 'Maegashira 11',
east: rikishi.find(x => x.name === 'Sadanoumi'),
west: rikishi.find(x => x.name === 'Hiradoumi')
},
{
name: 'Maegashira 12',
east: rikishi.find(x => x.name === 'Oho'),
west: rikishi.find(x => x.name === 'Tamawashi')
},
{
name: 'Maegashira 13',
east: rikishi.find(x => x.name === 'Takarafuji'),
west: rikishi.find(x => x.name === 'Tsurugisho')
},
{
name: 'Maegashira 14',
east: rikishi.find(x => x.name === 'Tomokaze'),
west: rikishi.find(x => x.name === 'Ichiyamamoto')
},
{
name: 'Maegashira 15',
east: rikishi.find(x => x.name === 'Tohakuryu'),
west: rikishi.find(x => x.name === 'Churanoumi')
},
{
name: 'Maegashira 16',
east: rikishi.find(x => x.name === 'Roga'),
west: rikishi.find(x => x.name === 'Nishikifuji')
},
{
name: 'Maegashira 17',
east: rikishi.find(x => x.name === 'Kitanowaka')
}
];
export default ranks;

162
src/components/rikishi.js
View File

@@ -26,312 +26,312 @@ const rikishi = [
{ {
name: 'Hoshoryu', name: 'Hoshoryu',
record: { record: {
wins: 0, wins: 10,
losses: 0, losses: 5,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Daieisho', name: 'Daieisho',
record: { record: {
wins: 0, wins: 9,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Wakamotoharu', name: 'Wakamotoharu',
record: { record: {
wins: 0, wins: 6,
losses: 0, losses: 9,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Kotonowaka', name: 'Kotonowaka',
record: { record: {
wins: 0, wins: 11,
losses: 0, losses: 4,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Abi', name: 'Abi',
record: { record: {
wins: 0, wins: 6,
losses: 0, losses: 9,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Hokutofuji', name: 'Hokutofuji',
record: { record: {
wins: 0, wins: 5,
losses: 0, losses: 10,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Asanoyama', name: 'Asanoyama',
record: { record: {
wins: 0, wins: 4,
losses: 0, losses: 4,
withdrawls: 0 withdrawls: 7
} }
}, },
{ {
name: 'Ura', name: 'Ura',
record: { record: {
wins: 0, wins: 8,
losses: 0, losses: 7,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Shodai', name: 'Shodai',
record: { record: {
wins: 0, wins: 6,
losses: 0, losses: 9,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Meisei', name: 'Meisei',
record: { record: {
wins: 0, wins: 4,
losses: 0, losses: 11,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Takayasu', name: 'Takayasu',
record: { record: {
wins: 0, wins: 10,
losses: 0, losses: 5,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Tobizaru', name: 'Tobizaru',
record: { record: {
wins: 0, wins: 7,
losses: 0, losses: 8,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Gonoyama', name: 'Gonoyama',
record: { record: {
wins: 0, wins: 8,
losses: 0, losses: 7,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Nishikigi', name: 'Nishikigi',
record: { record: {
wins: 0, wins: 7,
losses: 0, losses: 8,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Onosho', name: 'Onosho',
record: { record: {
wins: 0, wins: 3,
losses: 0, losses: 12,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Midorifuji', name: 'Midorifuji',
record: { record: {
wins: 0, wins: 9,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Shonannoumi', name: 'Shonannoumi',
record: { record: {
wins: 0, wins: 7,
losses: 0, losses: 8,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Takanosho', name: 'Takanosho',
record: { record: {
wins: 0, wins: 5,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 4
} }
}, },
{ {
name: 'Hokuseiho', name: 'Hokuseiho',
record: { record: {
wins: 0, wins: 7,
losses: 0, losses: 8,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Kinbozan', name: 'Kinbozan',
record: { record: {
wins: 0, wins: 8,
losses: 0, losses: 7,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Endo', name: 'Endo',
record: { record: {
wins: 0, wins: 5,
losses: 0, losses: 10,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Atamifuji', name: 'Atamifuji',
record: { record: {
wins: 0, wins: 11,
losses: 0, losses: 4,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Myogiryu', name: 'Myogiryu',
record: { record: {
wins: 0, wins: 6,
losses: 0, losses: 9,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Mitakeumi', name: 'Mitakeumi',
record: { record: {
wins: 0, wins: 8,
losses: 0, losses: 7,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Ryuden', name: 'Ryuden',
record: { record: {
wins: 0, wins: 10,
losses: 0, losses: 5,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Kotoeko', name: 'Kotoeko',
record: { record: {
wins: 0, wins: 2,
losses: 0, losses: 8,
withdrawls: 0 withdrawls: 5
} }
}, },
{ {
name: 'Sadanoumi', name: 'Sadanoumi',
record: { record: {
wins: 0, wins: 8,
losses: 0, losses: 7,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Hiradoumi', name: 'Hiradoumi',
record: { record: {
wins: 0, wins: 9,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Oho', name: 'Oho',
record: { record: {
wins: 0, wins: 8,
losses: 0, losses: 7,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Tamawashi', name: 'Tamawashi',
record: { record: {
wins: 0, wins: 9,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Takarafuji', name: 'Takarafuji',
record: { record: {
wins: 0, wins: 6,
losses: 0, losses: 9,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Tsurugisho', name: 'Tsurugisho',
record: { record: {
wins: 0, wins: 9,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Tomokaze', name: 'Tomokaze',
record: { record: {
wins: 0, wins: 7,
losses: 0, losses: 8,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Ichiyamamoto', name: 'Ichiyamamoto',
record: { record: {
wins: 0, wins: 11,
losses: 0, losses: 4,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Tohakuryu', name: 'Tohakuryu',
record: { record: {
wins: 0, wins: 5,
losses: 0, losses: 10,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Churanoumi', name: 'Churanoumi',
record: { record: {
wins: 0, wins: 9,
losses: 0, losses: 6,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Roga', name: 'Roga',
record: { record: {
wins: 0, wins: 5,
losses: 0, losses: 10,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Nishikifuji', name: 'Nishikifuji',
record: { record: {
wins: 0, wins: 6,
losses: 0, losses: 9,
withdrawls: 0 withdrawls: 0
} }
}, },
{ {
name: 'Kitanowaka', name: 'Kitanowaka',
record: { record: {
wins: 0, wins: 5,
losses: 0, losses: 10,
withdrawls: 0 withdrawls: 0
} }
} }