fix

readme.md

@@ -7,4 +7,3 @@ $ nvm use 16
 $ yarn install
 $ yarn dev
 ```
-

scpt/ogimage.zsh

@@ -26,7 +26,7 @@ do
 
 	if [ ! -f $oo ];then
 		echo $oo
-		magick convert $o -gravity center -extent 8000x4000 $oo
+		convert $o -gravity center -extent 8000x4000 $oo
 	fi
 
 #	mkdir -p $o_dir/$id

src/App.vue

@@ -1,14 +1,12 @@
 <template>
 	<div id="app">
-		<link rel="stylesheet" href="https://syui.ai/bower_components/icomoon/style.css" />
+		<link rel="stylesheet" href="https://yui.syui.ai/pkg/icomoon/css/icomoon.css" />
-		<link rel="stylesheet" href="https://syui.ai/bower_components/font-awesome/css/all.min.css" />
+		<link rel="stylesheet" href="https://yui.syui.ai/pkg/font-awesome/css/all.min.css" />
 		<div class="menu">
 			<a href="/" class="top-icon"><span class="icon-ai"></span></a> 
 			<code v-if="loc === 'te'"><a href="https://bsky.app/profile/yui.syui.ai" target="_blank">@yui.syui.ai</a> /ten</code>
 			<code v-else-if="loc === 'pr'"><a href="https://bsky.app/profile/yui.syui.ai" target="_blank">@yui.syui.ai</a> /fav 1234567</code>
 			<code v-else-if="loc === 'docs' || loc === 'en'"><a href="https://bsky.app/profile/yui.syui.ai" target="_blank">@yui.syui.ai</a> /help</code>
-			<code v-else-if="loc === 'di'"><a href="https://bsky.app/profile/yui.syui.ai" target="_blank">@yui.syui.ai</a> /did</code>
-			<code v-else-if="loc === 'svn'"><a href="https://bsky.app/profile/yui.syui.ai" target="_blank">@yui.syui.ai</a> /ten pay 7</code>
 			<code v-else><a href="https://bsky.app/profile/yui.syui.ai" target="_blank">@yui.syui.ai</a> /card</code>
 		</div>
 
@@ -24,7 +22,7 @@
 		</div>
 
 		<p>
-			<a href="/docs"><button>help</button></a> <a href="/en"><button>en</button></a> <a href="/pr"><button>fav</button></a> <a href="/te"><button>ten</button></a> <button v-if="loc.length == 0" v-on:click="did_enable = !did_enable">did</button> <a v-else href="/di"><button>did</button></a> <a href="/c"><button>all</button></a> <a href="/svn"><button>seven</button></a> 
+			<a href="/docs"><button>help</button></a> <a href="/en"><button>en</button></a> <a href="/pr"><button>fav</button></a> <a href="/te"><button>ten</button></a> <button v-if="loc.length == 0" v-on:click="did_enable = !did_enable">did</button> <a v-else href="/di"><button>did</button></a> 
 		</p>
 
 		<div v-if="loc.length > 1">
@@ -62,7 +60,7 @@
 				</div>
 
 				<div class="card_kira_center">
-					<button v-on:click="cardoriginstatus" class="card_origin_status"><span class="icon-ai"></span></button> <button v-if="cards.data.filter((v) => v.skill == '3d' && (v.card >= 0 && v.card <= 14 || v.card == 64))[0]" v-on:click="glb_status = !glb_status"  class="unity"><span class="icon-cube"></span></button> <button v-if="model == true || cards.data.filter((v) => v.skill == 'model').length >= 1" v-on:click="vrmviewer"><span class="icon-game"></span></button> <button v-if="game == true" v-on:click="term_status = !term_status"><span class="icon-aiterm"></span></button>
+					<button v-on:click="cardoriginstatus" class="card_origin_status"><span class="icon-ai"></span></button> <button v-if="cards.data.filter((v) => v.skill == '3d' && (v.card >= 0 && v.card <= 14 || v.card == 64))[0]" v-on:click="glb_status = !glb_status"  class="unity"><i class="fa-solid fa-cube" id="vrm_button"></i></button> <button v-if="model == true || cards.data.filter((v) => v.skill == 'model').length >= 1" v-on:click="vrmviewer"><i class="fa-solid fa-gamepad"></i></button> <button v-if="game == true" v-on:click="term_status = !term_status"><i class="fa-solid fa-terminal"></i></button>
 				</div>
 
 				<!--
@@ -78,7 +76,7 @@
 
 				<span class="card-fav" v-if="card_origin_status">
 					<span class="card-fav" v-for="k in cards.data">
-						<tr class="card-status-first" v-if="k.status == 'yui' || k.status == 'first' || k.status == 'second' || k.status == 'second' || k.status == 'third' || k.status == 'fourth' || k.status == 'fifth' || k.status == 'sixth' || k.status == 'seven'" >
+						<tr class="card-status-first" v-if="k.status == 'first' || k.status == 'second' || k.status == 'second' || k.status == 'third' || k.status == 'fourth' || k.status == 'fifth' || k.status == 'sixth' || k.status == 'yui'" >
 							<span class="card-wrapper">
 								<span class="reflection">
 									<img :src='"/card/card_" + k.card + ".webp"' class="card">
@@ -90,9 +88,9 @@
 						</tr>
 					</span>
 				</span>
-				
+
 				<div class="vrm" v-if="iframe_status == true">
-					<iframe src="https://vrm.syui.ai" allowfullscreen frameborder="0" loading="lazy"></iframe>
+					<iframe src="https://vrm.syui.ai" allowfullscreen frameborder="0"></iframe>
 					<table>
 						<tbody>
 							<tr>
@@ -112,7 +110,6 @@
 				</div>
 
 				<div class="glb" v-if="glb_status == true">
-					<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>
 					<model-viewer v-if="glb_next !== 0" class="ar" :src="'/obj/card_' + glb_next + '.glb'" ar-modes="scene-viewer webxr quick-look" auto-rotate autoplay ar camera-controls></model-viewer>
 					<model-viewer v-else class="ar" :src="'/obj/card_' + cards.data.filter((v) => v.skill == '3d' && (v.card >= 1 && v.card <= 14 || v.card == 64))[0].card + '.glb'" ar-modes="scene-viewer webxr quick-look" auto-rotate autoplay ar camera-controls></model-viewer>
 					<span v-for="(ii, index) in cards.data.filter((v) => v.skill == '3d' && (v.card >= 1 && v.card <= 14 || v.card == 64))" class="glb">
@@ -126,7 +123,7 @@
 				</div>
 
 				<div class="term" v-if="term_status == true">
-					<iframe :src="'https://term.syui.ai?user=' + username + '&did=' + did + '&id=' + id" allowfullscreen frameborder="0" loading="lazy"></iframe>
+					<iframe :src="'https://term.syui.ai?user=' + username + '&did=' + did + '&id=' + id" allowfullscreen frameborder="0"></iframe>
 				</div>
 
 				<span class="menu-right-top" v-if="cards.data.find((v) => v.card == 43)">
@@ -152,7 +149,9 @@
 						<span class="card-fav-su">
 							{{ ii = cards.data.find((v) => v.id == user_fav) }}
 						</span>
-						<thead v-if="ii.status == 'yui' || ii.status == 'first' || ii.status == 'second' || ii.status == 'second' || ii.status == 'third' || ii.status == 'fourth' || ii.status == 'fifth' || ii.status == 'sixth' || ii.status == 'seven'" class="card-fav">
+
+
+						<thead v-if="ii.status == 'first' || ii.status == 'second' || ii.status == 'second' || ii.status == 'third' || ii.status == 'fourth' || ii.status == 'fifth' || ii.status == 'sixth' || ii.status == 'yui'" class="card-fav">
 							<tr class="card-status-first">
 								<span class="card-wrapper">
 									<span class="reflection">
@@ -184,94 +183,12 @@
 					</table>
 				</div>
 
-				<div class="card-planet" v-if="planet_status == true">
-					<table class="card-fav">
-						<thead>
-							<span class="card-planet" v-if="planet >= 1000000">
-								<iframe :src="planet_url + '?g=galaxy'" scrolling="no" frameborder="0" style="width:155px;height:200px;padding-bottom:14px;" loading="lazy"></iframe>
-							</span>
-							<span class="card-planet" v-else-if="planet >= 466666">
-								<iframe :src="planet_url + '?g=neutron'" scrolling="no" frameborder="0" style="width:155px;height:200px;padding-bottom:14px;" loading="lazy"></iframe>
-							</span>
-							<span class="card-planet" v-else-if="planet >= 333000">
-								<iframe :src="planet_url + '?g=sun'" scrolling="no" frameborder="0" style="width:155px;height:200px;padding-bottom:14px;" loading="lazy"></iframe>
-							</span>
-							<span class="card-planet" v-else-if="planet >= 1.0">
-								<iframe :src="planet_url + '?g=earth'" scrolling="no" frameborder="0" style="width:155px;height:200px;padding-bottom:14px;" loading="lazy"></iframe>
-							</span>
-							<span class="card-planet" v-else-if="planet > 0">
-								<iframe :src="planet_url + '?g=moon'" scrolling="no" frameborder="0" style="width:155px;height:200px;padding-bottom:14px;" loading="lazy"></iframe>
-							</span>
-
-						</thead>
-						<tbody><tr v-if="planet">M {{ planet }}</tr></tbody>
-						<tbody>
-							<tr v-if="planet >= 1000000"><span class="icon-ai"></span> galaxy</tr>
-							<tr v-else-if="planet >= 466666"><span class="icon-home"></span> neutron</tr>
-							<tr v-else-if="planet >= 333000"><span class="icon-ten"></span> sun</tr>
-							<tr v-else-if="planet >= 1"><i class="fa-solid fa-earth-americas"></i> earth</tr>
-							<tr v-else-if="planet > 0"><span class="icon-moon"></span> moon</tr>
-						</tbody>
-					</table>
-				</div>
-
-				<div class="game-card" v-if="game_login == true && game_screen == true">
-					<button v-on:click="gamescreen">min</button>
-					<iframe class="game-app" src="https://ue.syui.ai/?AutoConnect=true&hoveringMouse=true&MatchViewportRes=true&AutoPlayVideo=true&FakeMouseWithTouches=true" scrolling="no" frameborder="0" loading="lazy" allowfullscreen></iframe>
-			<table>
-				<tbody>
-					<tr>
-						<td>Lv0</td>
-						<td>space</td>
-						<td>jump</td>
-					</tr>
-					<tr>
-						<td>Lv0</td>
-						<td>w, s, a, d</td>
-						<td>move</td>
-					</tr>
-					<tr>
-						<td>Lv1</td>
-						<td>1</td>
-						<td class="blue">attack</td>
-					</tr>
-					<tr>
-						<td>Lv2</td>
-						<td>2</td>
-						<td class="green">skill</td>
-					</tr>
-					<tr>
-						<td>Lv3</td>
-						<td>3</td>
-						<td class="red">burst</td>
-					</tr>
-				</tbody>
-			</table>
-					<table class="card-fav">
-						<thead style="background-color:#fff;">
-						</thead>
-						<tbody><i class="fa-solid fa-keyboard"></i></tbody>
-					</table>
-				</div>
-				<div class="game-card" v-else-if="game_login == true && game_screen == false">
-					<table class="card-fav">
-						<thead style="background-color:#fff;">
-							<span class="card-planet">
-								<iframe class="game-app" src="https://ue.syui.ai/?AutoConnect=true&hoveringMouse=true&MatchViewportRes=true&AutoPlayVideo=true&FakeMouseWithTouches=true" scrolling="no" frameborder="0" loading="lazy" width="768" height="1024" style="width:160px; height:210px; padding-bottom:14px;"></iframe>
-							</span>
-						</thead>
-						<tbody><button v-on:click="gamescreen">full</button></tbody>
-						<tbody>E {{ game_exp }}</tbody>
-					</table>
-				</div>
-
 				<div class="card-button" >
 					<button v-on:click="cardtime">new</button> <button v-on:click="sort">cp</button> <button v-on:click="sortcard" >card</button> <button v-on:click="cardinfo">info</button>
 				</div>
-				<div class="menu-right"><code><strong>ID</strong> {{ id }}</code> <code><span class="icon-power"></span> {{ aiten }}</code> <code><i class="fa-solid fa-cube"></i> {{ cards.data.filter((v) => v.skill == 'lost').length }}</code> 
+				<div class="menu-right"><code><strong>ID</strong> {{ id }}</code> <code><span class="icon-power"></span> {{ aiten }}</code> <code><i class="fa-solid fa-cube"></i> {{ cards.data.filter((v) => v.skill == 'lost').length }}</code>
 					<code class="moji-comp" v-if="26 == (cards.data.filter((v) => v.card >= 96 && v.card <= 121).length)" v-on:click="background_change"><span class="icon-ai"></span> {{ (cards.data.filter((v) => v.card >= 96 && v.card <= 121).length) }}</code>
 					<code v-else><span class="icon-ai"></span> {{ (cards.data.filter((v) => v.card >= 96 && v.card <= 121).length) }}</code>
-					<code><i class="fa-solid fa-earth-americas"></i> {{ planet }}</code> 
 				</div>
 
 				<div class="moji" v-if="moji_status == true">
@@ -388,7 +305,7 @@
 		<div v-if="loc.length == 0">
 
 			<div v-if="cards" class="bluesky-card">
-				<p>user : <a :href='"/" + user.data.username'><code v-if="user.data.username">{{ user.data.username }}</code></a></p>
+				<p>user : <a :href='"/" + user.data.username'><code>{{ user.data.username }}</code></a></p>
 				<p>id : <code>{{ user.data.id }}</code></p>
 				<p>did : <code>{{ user.data.did }}</code></p>
 				<p>aiten : <code>{{ user.data.aiten }}</code></p>
@@ -411,7 +328,7 @@
 				<li v-for="i in record.data">
 					<p v-if="i.delete === false"><span class="menu-right-top"> 
 							<button v-if="i.model === true"><i class="fa-solid fa-cube"></i></button> <button v-if="i.fav != '0'">✧</button> <a :href="'https://git.syui.ai/' + i.username"  target="_blank"><button v-if="i.username == 'ai'"><i class="fa-brands fa-git-alt"></i></button></a> <button>ID {{ i.id }}</button></span></p>
-					<p v-if="i.delete === false"><span class="text"><a :href="'/' + i.username" v-if="i.username">{{ i.username }}</a></span></p>
+					<p v-if="i.delete === false"><span class="text"><a :href="'/' + i.username">{{ i.username }}</a></span></p>
 					<span class="menu-right-did" v-if="i.delete === false && did_enable === true && i.did.includes('did:') === true">
 						<button><a :href="'https://plc.directory/' + i.did + '/log'" target="_blank">{{ i.did }}</a></button> 
 					</span>
@@ -640,8 +557,9 @@
 			<p>集めた人は<a href="https://bsky.app/profile/syui.ai">@syui</a>まで連絡してみて</p>
 			<p>ただし、リアルカードに変わるのは、こちらの<a href="/owner">所有者</a>がいないカードに限られます</p>
 
+
 			<h3>link</h3>
-			<p><a class="menu-link" href="/fa">fanart</a> <a class="menu-link" href="/te">aiten</a> <a class="menu-link" href="/vr">model</a></p>
+			<p><a class="menu-link" href="/fa">fanart</a> <a class="menu-link" href="/ph">photo</a> <a class="menu-link" href="/te">aiten</a> <a class="menu-link" href="/pr">fav</a> <a class="menu-link" href="/vr">model</a></p>
 		</div>
 
 		<div v-if="loc === 'en'"  class="text-content">
@@ -828,7 +746,7 @@
 						<p :id="ii.id">[{{ ii.ten }}] {{ ii.h }} / {{ ii.id }}00</p>
 						<p><img :src='"/card/card_" + ii.id + ".webp"'></p>
 					</div>
-					<div v-show="ii.id == 29 || ii.id == 33 || ii.id == 36 || ii.id == 46 || ii.id == 47 || ii.id == 60 || ii.id == 64 || ii.id == 67 || ii.id == 69 || ii.id == 76 || ii.id == 77 || ii.id == 78|| ii.id == 86|| ii.id == 89 || ii.id == 90 || ii.id == 95||ii.id == 122||ii.id == 123||ii.id == 126" class="card-owner-one">
+					<div v-show="ii.id == 29 || ii.id == 33 || ii.id == 36 || ii.id == 46 || ii.id == 47 || ii.id == 60 || ii.id == 64 || ii.id == 67 || ii.id == 69 || ii.id == 76 || ii.id == 77 || ii.id == 78|| ii.id == 86|| ii.id == 89 || ii.id == 90 || ii.id == 95||ii.id == 122||ii.id == 123" class="card-owner-one">
 						<p :id="ii.id"><button>id:{{ ii.id }}</button></p>
 						<p :id="ii.id">[{{ ii.ten }}] {{ ii.h }} / {{ ii.id }}00 <span class="icon-power"></span></p>
 						<p><img :src='"/card/card_" + ii.id + ".webp"'></p>
@@ -839,7 +757,7 @@
 
 		<div v-if="loc === 'c'" class="text-content">
 			<div class="iten-start">
-			<p><span class="icon-moji_a"></span> <code>all</code> card</p>
+				<h3><span class="icon-moji_k"></span> ALL</h3>
 			</div>
 			<table id="card-box">
 				<span v-for="(ii, index) in rcards.data">
@@ -859,31 +777,6 @@
 			</table>
 		</div>
 
-		<div v-if="loc === 'svn'" class="text-content">
-			<p><span class="icon-moji_a"></span> <code>seven</code> owner</p>
-			<div class="card-fav" v-for="(ii, index) in sevens.data">
-				<table class="card-fav" v-if="ii.card !== 0 && ii.count == 0">
-					<thead class="card-fav">
-						<tr class="card-status-first">
-							<span class="card-wrapper">
-								<span class="reflection">
-									<img :src='"/card/card_" + ii.card + ".webp"' class="card">
-								</span>
-								<span class="card pattern-seven"></span>
-								<span class="card color-seven"></span>
-								<span class="card highlight-seven"></span>
-							</span>
-						</tr>
-					</thead>
-					<tbody>
-						<tr v-if='ii.handle'><a :href="'/' + ii.handle">@{{ ii.handle }}</a></tr>
-						<tr v-if='ii.cp'>{{ ii.cp }}</tr>
-					</tbody>
-				</table>
-			</div>
-			<p><code>/ten pay 7</code> <code><span class="icon-power"></span> 70,000,000</code></p>
-		</div>
-
 		<div v-if="loc === 'te'" class="text-content">
 			<div class="iten-start">
 				<p><code>/ten h</code> : ヘルプ</p>
@@ -931,7 +824,6 @@
 <script>
 import axios from 'axios'
 import moment from "moment";
-
 var loc = window.location.pathname.split('/').slice(-1)[0];
 
 export default {
@@ -958,79 +850,66 @@ export default {
 	data () {
 		return {
 			host: window.location.host,
-			all: "",
+			all: null,
-			badge_aiten: "",
+			badge_aiten: null,
-			card: "",
+			card: null,
-			cards: "",
+			cards: null,
 			loc: window.location.pathname.split('/').slice(-1)[0],
-			username: "ai",
+			username: null,
-			id: "",
+			id: null,
-			model: "",
+			model: null,
-			record: "",
+			record: null,
-			url: "",
+			url: null,
-			user: "",
+			user: null,
-			userid: "",
+			userid: null,
-			ucard: "",
+			ucard: null,
-			status: "",
+			status: null,
 			premium: false,
-			premium_text: "",
+			premium_text: null,
-			rcards: "",
+			rcards: null,
-			fanarts: "",
+			fanarts: null,
-			photos: "",
+			photos: null,
 			info: false,
-			time: "",
+			time: null,
-			aiten: "",
+			aiten: null,
-			fav: "",
+			fav: null,
-			card_fav: "",
+			card_fav: null,
-			user_fav: "",
+			user_fav: null,
-			book_user: "",
+			book_user: null,
 			glb_status: false,
 			glb_next: 0,
 			moji_status: false,
-			did_enable: "",
+			did_enable: null,
-			chara_user: "",
+			chara_user: null,
 			card_sed: false,
-			card_status: "",
+			card_status: null,
-			card_skill: "",
+			card_skill: null,
-			model_attack: "",
+			model_attack: null,
-			model_critical: "",
+			model_critical: null,
-			model_critical_d: "",
+			model_critical_d: null,
-			sevens: "",
+			game: null,
-			game: "",
+			game_lv: null,
-			game_lv: "",
+			api_url: null,
-			game_exp: 0,
-			api_url: "",
 			bsky_mode: false,
-			did: "",
+			did: null,
 			card_origin_status: false,
-			planet_status: false,
-			game_login: false,
-			game_screen: false,
-			planet: 0,
 			useragent: window.navigator.userAgent.toLowerCase(),
 			iframe_status: false,
 			term_status: false,
-			sort_key: "",
+			sort_key: null,
-			mount_google_md: false,
-			planet_url: "/planet/index.html",
 		}
 	},
+	components: {
+	},
 	filters: {
 		moment: function(date) {
 			return moment.unix(date).format("YYYY.MM.DD");
 		},
 	},
-	computed: {
-		loadComponent() {
-			return () => import('@google/model-viewer');
-		}
-	},
 	mounted() {
-		this.username = "ai";
+		this.loadComponent();
-		this.mount_google_md = false;
 		if (window.location.host === "localhost:8080") {
 			this.api_url = "/api/";
-			//this.planet_url = "http://localhost:3000";
 		} else if (window.location.host === "192.168.11.12:8080"){
 			this.api_url = "/api/";
 		} else {
@@ -1040,34 +919,29 @@ export default {
 			this.api_url = "https://api.syui.ai/";
 		}
 		if (loc === 'owner' || loc === 'te' || loc === 'c'){
-			this.rcards = "";
 			axios
 				.get("/json/card.json")
 				.then(response => (this.rcards = response));
-		} else if (loc === 'svn'){
+				if (loc.length > 1){
-			this.cards = "";
+					axios
-			let url = this.api_url + "sevs?itemsPerPage=8000";
+						.get(url,{ crossdomain: true })
+						.then(response => (this.cards = response));
+				}
+		} else if (loc === 'fa'){
 			axios
-				.get(url)
+				.get("/json/fanart.json")
-				.then(response => (this.sevens = response));
+				.then(response => (this.fanarts = response));
-		} else if (loc === null || loc === undefined || loc === ''){
+		} else if (loc === 'ph'){
-			let url = this.api_url + "users?itemsPerPage=3000";
+			axios
-			axios.get(url,{ crossdomain: true })
+				.get("/json/photo.json")
-				.then(response => { 
+				.then(response => (this.photos = response));
-					this.record = response;
-				})
 		} else {
-			if (this.mount_google_md === false) {
-				//this.loadComponent();
-				this.mount_google_md = true;
-			}
 			let url = this.api_url + "users?itemsPerPage=3000";
 			axios.get(url,{ crossdomain: true })
 				.then(response => { 
 					this.record = response;
 					this.username = this.record.data.find((v) => v.username == loc).username;
 					this.id = this.record.data.find((v) => v.username == loc).id;
-					this.planet = this.record.data.find((v) => v.username == loc).planet;
 					this.model = this.record.data.find((v) => v.username == loc).model;
 					this.did = this.record.data.find((v) => v.username == loc).did;
 					this.aiten = this.record.data.find((v) => v.username == loc).aiten;
@@ -1079,43 +953,40 @@ export default {
 					this.model_critical = this.record.data.find((v) => v.username == loc).model_critical;
 					this.model_critical_d = this.record.data.find((v) => v.username == loc).model_critical_d;
 					this.user_room = this.record.data.find((v) => v.username == loc).room;
-					this.game_login = this.record.data.find((v) => v.username == loc).login;
+					let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=4000";
-					this.game_exp = this.record.data.find((v) => v.username == loc).game_exp;
-
-					if (this.username === "syui") {
-						this.game_login = true;
-					}
-					if (this.planet > 0){
-						this.planet_status = true;
-					}
-					let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=8000";
 					axios
-						.get("/json/card.json")
+					.get("/json/card.json")
-						.then(response => (this.rcards = response));
+					.then(response => (this.rcards = response));
-						if (loc.length > 1){
+					if (loc.length > 1){
-							axios
+						axios
-								.get(url,{ crossdomain: true })
+							.get(url,{ crossdomain: true })
-								.then(response => { this.cards = response
+							.then(response => { this.cards = response
-														for (let i = 1; i <= 14; i++) {
+													for (let i = 1; i <= 14; i++) {
-															this.all = this.cards.data.some(
+														this.all = this.cards.data.some(
-																b => b.card === i,
+															b => b.card === i,
-																);
+															);
-																if (this.all === false) {
+															if (this.all === false) {
-																	break;
+																break;
-																}
+															}
-														}
+													}
-														for (let i = 65; i <= 67; i++) {
+													for (let i = 65; i <= 67; i++) {
-															this.badge_aiten = this.cards.data.some(
+														this.badge_aiten = this.cards.data.some(
-																b => b.card === i,
+															b => b.card === i,
-																);
+															);
-																if (this.badge_aiten === false) {
+															if (this.badge_aiten === false) {
-																	break;
+																break;
-																}
+															}
-														}
+													}
-								});
+							});
-						}
+					}
-				})
+			})
+			.catch(error => console.log(error));
 		}},
+		computed: {
+			loadComponent() {
+				return () => import('@google/model-viewer');
+			}
+		},
 		methods: {
 			submit() {
 				let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=3000";
@@ -1128,7 +999,7 @@ export default {
 			},
 			page() {
 				this.id = this.record.data.find((v) => v.username == this.userid).id;
-				let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=8000";
+				let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=4000";
 				axios
 					.get(url,{ crossdomain: true })
 					.then(response => (this.ucard = response));
@@ -1137,7 +1008,7 @@ export default {
 			sort(){
 				if (this.premium) {
 					this.premium = false;
-					let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=8000";
+					let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=4000";
 				}
 				return this.cards.data.sort((a, b) => {
 					return b.cp - a.cp;
@@ -1162,8 +1033,8 @@ export default {
 				});
 			},
 			cardinfo(){
-				this.cards = "";
+				this.cards = {};
-				let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=8000";
+				let url = this.api_url + "users/" + this.id + "/card?itemsPerPage=4000";
 				axios
 					.get(url,{ crossdomain: true })
 					.then(response => (this.cards = response));
@@ -1173,13 +1044,6 @@ export default {
 						this.info = false;
 					}
 			},
-			gamescreen(){
-				if (this.game_screen == true) {
-					this.game_screen = false;
-				} else {
-					this.game_screen = true;
-				}
-			},
 			cardtime(){
 					this.cards.data = this.cards.data.slice().reverse();
 					this.time = true;
@@ -1224,19 +1088,10 @@ export default {
 </script>
 
 <style>
-html {
+body{
-	text-size-adjust:100%;
-	-webkit-text-size-adjust:100%;
-}
-body {
-	text-size-adjust:100%;
-	-webkit-text-size-adjust:100%;
 	background-color: #f1f1f1;
 	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 	font-size: 18px;
-	overflow-wrap: anywhere;
-	word-break: normal;
-	line-break: strict;
 }
 
 a {
@@ -1285,7 +1140,9 @@ span.text {
 footer#footer {
 	text-align: center;
 }
-
+span.text {
+	word-break: break-all;
+}
 p.tl-avatar img {
 	width: 20px;
 }
@@ -1526,30 +1383,15 @@ span.color-sixth {
   mix-blend-mode: overlay;
 }
 
-span.pattern-seven {
+span.card-wrapper:hover > span.pattern-yui,span.card-wrapper:hover >  span.pattern-first,span.card-wrapper:hover >  span.pattern-second,span.card-wrapper:hover >  span.pattern-third,span.card-wrapper:hover >  span.pattern-fourth,span.card-wrapper:hover >  span.pattern-fifth,span.card-wrapper:hover >  span.pattern-sixth {
-  background: repeating-radial-gradient(circle at center, #fff700, #313131 3px, #000700 3px);
-  background-position: 50% 50%;
-  background-size: 120% 120%;
-  mix-blend-mode: color-dodge;
-  opacity: 0.3;
-}
-
-span.color-seven {
-  background: linear-gradient(115deg, transparent 20%, #fff700 30%, transparent 48% 52%, #fff700 70%, transparent);
-  background-position: 50% 50%;
-  background-size: 200% 200%;
-  mix-blend-mode: overlay;
-}
-
-span.card-wrapper:hover > span.pattern-yui,span.card-wrapper:hover >  span.pattern-first,span.card-wrapper:hover >  span.pattern-second,span.card-wrapper:hover >  span.pattern-third,span.card-wrapper:hover >  span.pattern-fourth,span.card-wrapper:hover >  span.pattern-fifth, span.card-wrapper:hover >  span.pattern-sixth, span.card-wrapper:hover >  span.pattern-seven {
   background-position: calc(50% + (var(--ratio-x) * -50%)) calc(50% + (var(--ratio-y) * -50%));
 }
 
-span.card-wrapper:hover > span.color-yui,span.card-wrapper:hover > span.color-first,span.card-wrapper:hover > span.color-second,span.card-wrapper:hover > span.color-third,span.card-wrapper:hover > span.color-fourth,span.card-wrapper:hover > span.color-fifth, span.card-wrapper:hover > span.color-sixth, span.card-wrapper:hover > span.color-seven {
+span.card-wrapper:hover > span.color-yui,span.card-wrapper:hover > span.color-first,span.card-wrapper:hover > span.color-second,span.card-wrapper:hover > span.color-third,span.card-wrapper:hover > span.color-fourth,span.card-wrapper:hover > span.color-fifth,span.card-wrapper:hover > span.color-sixth {
   background-position: calc(50% + (var(--ratio-x) * -50%)) calc(50% + (var(--ratio-y) * -50%));
 }
 
-span.card-wrapper:hover > span.highlight-yui,span.card-wrapper:hover > span.highlight-first,span.card-wrapper:hover > span.highlight-second,span.card-wrapper:hover > span.highlight-third,span.card-wrapper:hover > span.highlight-fourth,span.card-wrapper:hover > span.highlight-fifth, span.card-wrapper:hover > span.highlight-sixth, span.card-wrapper:hover > span.highlight-seven {
+span.card-wrapper:hover > span.highlight-yui,span.card-wrapper:hover > span.highlight-first,span.card-wrapper:hover > span.highlight-second,span.card-wrapper:hover > span.highlight-third,span.card-wrapper:hover > span.highlight-fourth,span.card-wrapper:hover > span.highlight-fifth,span.card-wrapper:hover > span.highlight-sixth  {
   background-repeat: no-repeat;
 }
 
@@ -1608,9 +1450,9 @@ span.reflection:after {
 }
 
 .viewer {
-	background-color: #fff;
+    background-color: #fff;
-	margin: 10px 0px;
+    margin: 10px 0px;
-	padding: 20px;
+    padding: 20px;
 }
 
 span.card-black p {
@@ -1766,11 +1608,7 @@ button.unity i#vrm_button:hover {
 		padding: 50px 0 50px 0;
 		margin: 30px 0 30px 0;
 	}
-	div#app{
+	div#app{list-style:none;margin:0px}
-		list-style:none;
-		margin:0px auto;
-		text-align: center;
-	}
 	.bluesky-avatar img{width:55px}
 	span.time{color:#00f}
 	span.name{background-color:rgba(163,195,255,.10196078431372549);padding:10px}
@@ -1778,6 +1616,9 @@ button.unity i#vrm_button:hover {
 	.bluesky-record p{padding:0 20px 0}
 	.bluesky-record{border-radius:10px;margin:0px 0px 0 0}
 	footer#footer{text-align:center}
+	span.text {
+		word-break: break-all;
+	}
 	code {
 		padding: 10px;
 		background-color: #fff;
@@ -1869,6 +1710,7 @@ span.glb {
 
 .menu-right code {
 	padding: 0;
+	word-break: break-all;
 }
 
 blockquote.did {
@@ -1877,34 +1719,4 @@ blockquote.did {
 	text-align: left;
 }
 
-span.card-planet {
-    background-image: url(/card/card_0.webp);
-    background-size: cover;
-    background-position: center;
-    display: inline-block;
-    width: 200px;
-    border-radius: 3px;
-    padding: 23px 0;
-}
-
-span.game-card {
-    background-image: url(/card/card_0.webp);
-    background-size: cover;
-    background-position: center;
-    display: inline-block;
-    width: 200px;
-    border-radius: 3px;
-    padding: 23px 0;
-}
-
-.card-planet table thead {
-	background-color: #fff;
-}
-/*
-iframe.game-app {
-	width:160px;
-	height:210px;
-	padding-bottom:14px;
-}
-*/
 </style>