MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-23 16:53:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

Split component, improve UI, fix and refactor (#1162)

Browse Source
This commit is contained in:
pa
2025-03-01 16:12:21 +09:00
committed by GitHub
parent ef68e40996
commit b988f45f8c
28 changed files with 1098 additions and 791 deletions
Download Patch File Download Diff File Expand all files Collapse all files

146
src/classes/uiComponents.js
View File

@@ -68,152 +68,6 @@ export default class extends baseClass {
}
});
Vue.component('location', {
template:
"<span><span @click=\"showWorldDialog\" :class=\"{ 'x-link': link && this.location !== 'private' && this.location !== 'offline'}\">" +
'<i v-if="isTraveling" class="el-icon el-icon-loading" style="display:inline-block;margin-right:5px"></i>' +
'<span>{{ text }}</span></span>' +
'<span v-if="groupName" @click="showGroupDialog" :class="{ \'x-link\': link}">({{ groupName }})</span>' +
'<span v-if="region" class="flags" :class="region" style="display:inline-block;margin-left:5px"></span>' +
'<i v-if="strict" class="el-icon el-icon-lock" style="display:inline-block;margin-left:5px"></i></span>',
props: {
location: String,
traveling: String,
hint: {
type: String,
default: ''
},
grouphint: {
type: String,
default: ''
},
link: {
type: Boolean,
default: true
},
isOpenPreviousInstanceInfoDialog: Boolean
},
data() {
return {
text: this.location,
region: this.region,
strict: this.strict,
isTraveling: this.isTraveling,
groupName: this.groupName
};
},
methods: {
parse() {
this.isTraveling = false;
this.groupName = '';
var instanceId = this.location;
if (
typeof this.traveling !== 'undefined' &&
this.location === 'traveling'
) {
instanceId = this.traveling;
this.isTraveling = true;
}
this.text = instanceId;
var L = $utils.parseLocation(instanceId);
if (L.isOffline) {
this.text = 'Offline';
} else if (L.isPrivate) {
this.text = 'Private';
} else if (L.isTraveling) {
this.text = 'Traveling';
} else if (
typeof this.hint === 'string' &&
this.hint !== ''
) {
if (L.instanceId) {
this.text = `${this.hint} #${L.instanceName} ${L.accessTypeName}`;
} else {
this.text = this.hint;
}
} else if (L.worldId) {
var ref = API.cachedWorlds.get(L.worldId);
if (typeof ref === 'undefined') {
$app.getWorldName(L.worldId).then((worldName) => {
if (L.tag === instanceId) {
if (L.instanceId) {
this.text = `${worldName} #${L.instanceName} ${L.accessTypeName}`;
} else {
this.text = worldName;
}
}
});
} else if (L.instanceId) {
this.text = `${ref.name} #${L.instanceName} ${L.accessTypeName}`;
} else {
this.text = ref.name;
}
}
if (this.grouphint) {
this.groupName = this.grouphint;
} else if (L.groupId) {
this.groupName = L.groupId;
$app.getGroupName(instanceId).then((groupName) => {
if (L.tag === instanceId) {
this.groupName = groupName;
}
});
}
this.region = '';
if (!L.isOffline && !L.isPrivate && !L.isTraveling) {
this.region = L.region;
if (!L.region && L.instanceId) {
this.region = 'us';
}
}
this.strict = L.strict;
},
showWorldDialog() {
if (this.link) {
var instanceId = this.location;
if (this.traveling && this.location === 'traveling') {
instanceId = this.traveling;
}
if (!instanceId && this.hint.length === 8) {
// shortName
API.$emit('SHOW_WORLD_DIALOG_SHORTNAME', this.hint);
return;
}
if (this.isOpenPreviousInstanceInfoDialog) {
this.$emit(
'open-previous-instance-info-dialog',
instanceId
);
} else {
API.$emit('SHOW_WORLD_DIALOG', instanceId);
}
}
},
showGroupDialog() {
var location = this.location;
if (this.isTraveling) {
location = this.traveling;
}
if (!location || !this.link) {
return;
}
var L = $utils.parseLocation(location);
if (!L.groupId) {
return;
}
API.$emit('SHOW_GROUP_DIALOG', L.groupId);
}
},
watch: {
location() {
this.parse();
}
},
created() {
this.parse();
}
});
Vue.component('location-world', {
template:
'<span><span @click="showLaunchDialog" class="x-link">' +