MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-18 06:13:52 +02:00
Code Issues Packages Projects Releases Wiki Activity

New flags

Browse Source
This commit is contained in:
Natsumi
2022-07-30 23:14:20 +12:00
parent 1564b39b0d
commit 163b2a8f27
13 changed files with 256 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
html/images/flag_use.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 774 B

BIN
html/images/flag_usw.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 5.9 KiB

BIN
html/images/flags.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

16
html/package-lock.json generated
View File

@@ -15,7 +15,6 @@
"element-ui": "^2.15.9",
"eslint": "^8.20.0",
"eslint-config-prettier": "^8.5.0",
"famfamfam-flags": "^1.0.0",
"html-webpack-plugin": "^5.5.0",
"mini-css-extract-plugin": "^2.6.1",
"normalize.css": "^8.0.1",
@@ -1496,15 +1495,6 @@
"node": ">=0.8.x"
}
},
"node_modules/famfamfam-flags": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/famfamfam-flags/-/famfamfam-flags-1.0.0.tgz",
"integrity": "sha512-l7F0/L1I1eozNN9oLoXgqHzBCFjrhuuDwwZkuo9fOHPrreS61bV3Qft+IMyYAqjibnGjTU9/2WovGccSvNYahQ==",
"dev": true,
"engines": {
"node": ">= 0.10.0"
}
},
"node_modules/fast-deep-equal": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -5159,12 +5149,6 @@
"integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
"dev": true
},
"famfamfam-flags": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/famfamfam-flags/-/famfamfam-flags-1.0.0.tgz",
"integrity": "sha512-l7F0/L1I1eozNN9oLoXgqHzBCFjrhuuDwwZkuo9fOHPrreS61bV3Qft+IMyYAqjibnGjTU9/2WovGccSvNYahQ==",
"dev": true
},
"fast-deep-equal": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",

1
html/package.json
View File

@@ -31,7 +31,6 @@
"element-ui": "^2.15.9",
"eslint": "^8.20.0",
"eslint-config-prettier": "^8.5.0",
"famfamfam-flags": "^1.0.0",
"html-webpack-plugin": "^5.5.0",
"mini-css-extract-plugin": "^2.6.1",
"normalize.css": "^8.0.1",

13
html/src/app.js
View File

@@ -812,7 +812,7 @@ speechSynthesis.getVoices();
template:
"<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>' +
'{{ text }}<slot></slot><span class="famfamfam-flags" :class="region" style="display:inline-block;margin-left:5px"></span>' +
'{{ text }}<slot></slot><span 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,
@@ -882,14 +882,9 @@ speechSynthesis.getVoices();
}
this.region = '';
if ($app.isRealInstance(instanceId)) {
if (L.region === 'eu') {
this.region = 'europeanunion';
} else if (L.region === 'jp') {
this.region = 'jp';
} else if (L.region === 'use') {
this.region = 'flag-icon-use';
} else {
this.region = 'flag-icon-usw';
this.region = L.region;
if (!L.region) {
this.region = 'us';
}
}
this.strict = L.strict;

15
html/src/app.scss
View File

@@ -12,7 +12,6 @@
@import '~animate.css/animate.min.css';
@import '~noty/lib/noty.css';
@import '~element-ui/lib/theme-chalk/index.css';
@import '~famfamfam-flags/dist/sprite/famfamfam-flags.min.css';
.color-palettes {
background: #409eff;
@@ -651,20 +650,6 @@ i.x-user-status.busy {
border-radius: 2px;
}
.flag-icon-use {
background-image: url('/images/flag_use.png');
background-size: 16px 11px;
width: 16px;
height: 11px;
}
.flag-icon-usw {
background-image: url('/images/flag_usw.png');
background-size: 16px 11px;
width: 16px;
height: 11px;
}
.el-pagination .el-select .el-input .el-input__inner,
.el-input--mini .el-input__icon {
height: 22px;

100
html/src/flags.scss Normal file
View File

@@ -0,0 +1,100 @@
:root {
--offx: 20px; /* flag size */
--offy: calc(var(--offx) / 70 * 46);
}
.flags {
background: url('/images/flags.png') no-repeat;
background-size: calc(var(--offx) * 6);
width: var(--offx);
height: var(--offy);
transform: translateY(calc(var(--offx) / 16));
background-position: calc(var(--offx) * -5) calc(var(--offy) * -4);
}
span[class='flags'] {
background-position: calc(var(--offx) * 1) 0;
}
.flags.us {
background-position: 0 0;
}
.flags.kr {
background-position: calc(var(--offx) * -1) 0;
}
.flags.ru {
background-position: calc(var(--offx) * -2) 0;
}
.flags.es {
background-position: calc(var(--offx) * -3) 0;
}
.flags.pt {
background-position: calc(var(--offx) * -4) 0;
}
.flags.cn {
background-position: calc(var(--offx) * -5) 0;
}
.flags.de {
background-position: 0 calc(var(--offy) * -1);
}
.flags.jp {
background-position: calc(var(--offx) * -1) calc(var(--offy) * -1);
}
.flags.fr {
background-position: calc(var(--offx) * -2) calc(var(--offy) * -1);
}
.flags.se {
background-position: calc(var(--offx) * -3) calc(var(--offy) * -1);
}
.flags.nl {
background-position: calc(var(--offx) * -4) calc(var(--offy) * -1);
}
.flags.pl {
background-position: calc(var(--offx) * -5) calc(var(--offy) * -1);
}
.flags.dk {
background-position: 0 calc(var(--offy) * -2);
}
.flags.no {
background-position: calc(var(--offx) * -1) calc(var(--offy) * -2);
}
.flags.it {
background-position: calc(var(--offx) * -2) calc(var(--offy) * -2);
}
.flags.th {
background-position: calc(var(--offx) * -3) calc(var(--offy) * -2);
}
.flags.fi {
background-position: calc(var(--offx) * -4) calc(var(--offy) * -2);
}
.flags.hu {
background-position: calc(var(--offx) * -5) calc(var(--offy) * -2);
}
.flags.cz {
background-position: 0 calc(var(--offy) * -3);
}
.flags.tr {
background-position: calc(var(--offx) * -1) calc(var(--offy) * -3);
}
.flags.ae {
background-position: calc(var(--offx) * -2) calc(var(--offy) * -3);
}
.flags.ro {
background-position: calc(var(--offx) * -3) calc(var(--offy) * -3);
}
.flags.vn {
background-position: calc(var(--offx) * -4) calc(var(--offy) * -3);
}
.flags.ua {
background-position: calc(var(--offx) * -5) calc(var(--offy) * -3);
}
.flags.gb {
background-position: 0 calc(var(--offy) * -4);
}
.flags.use {
background-position: calc(var(--offx) * -1) calc(var(--offy) * -4);
}
.flags.eu {
background-position: calc(var(--offx) * -2) calc(var(--offy) * -4);
}
.flags.tw {
background-position: calc(var(--offx) * -3) calc(var(--offy) * -4);
}

36
html/src/index.pug
View File

@@ -9,6 +9,7 @@ html
link(rel="preconnect" href="https://api.vrchat.cloud")
link(rel="preconnect" href="https://d348imysud55la.cloudfront.net")
link(rel="stylesheet" href="app.css")
link(rel="stylesheet" href="flags.css")
body
.x-app#x-app(style="display:none")
//- login
@@ -97,10 +98,8 @@ html
br
span.x-link(v-if="currentInstanceLocation.instanceName" @click="showLaunchDialog(lastLocation.location)")
span \#{{ currentInstanceLocation.instanceName }} {{ currentInstanceLocation.accessType }}
span.famfamfam-flags(v-if="currentInstanceLocation.region === 'eu'" class="europeanunion" style="display:inline-block;margin-left:5px")
span.famfamfam-flags(v-else-if="currentInstanceLocation.region === 'jp'" class="jp" style="display:inline-block;margin-left:5px")
span.flag-icon-use(v-else-if="currentInstanceLocation.region === 'use'" style="display:inline-block;margin-left:5px")
span.flag-icon-usw(v-else style="display:inline-block;margin-left:5px")
span.flags(v-if="currentInstanceLocation.region" :class="currentInstanceLocation.region" style="display:inline-block;margin-left:5px")
span.flags(v-else class="us" style="display:inline-block;margin-left:5px")
i.el-icon-lock(v-if="currentInstanceLocation.strict" style="display:inline-block;margin-left:5px")
span(v-if="lastLocation.playerList.size > 0" style="margin-left:5px")
| {{ lastLocation.playerList.size }}
@@ -178,7 +177,7 @@ html
el-tooltip(v-for="item in scope.row.ref.$languages" :key="item.key" placement="top")
template(#content)
span {{ item.value }} ({{ item.key }})
span.famfamfam-flags(:class="languageClass(item.key)" style="display:inline-block;margin-left:5px")
span.flags(:class="languageClass(item.key)" style="display:inline-block;margin-left:5px")
el-table-column(label="Bio Links" width="100" prop="ref.bioLinks")
template(v-once #default="scope")
el-tooltip(v-if="link" v-for="(link, index) in scope.row.ref.bioLinks" :key="index")
@@ -907,7 +906,7 @@ html
el-tooltip(v-for="item in scope.row.$languages" :key="item.key" placement="top")
template(#content)
span {{ item.value }} ({{ item.key }})
span.famfamfam-flags(:class="languageClass(item.key)" style="display:inline-block;margin-left:5px")
span.flags(:class="languageClass(item.key)" style="display:inline-block;margin-left:5px")
el-table-column(label="Bio Links" width="100" prop="bioLinks")
template(v-once #default="scope")
el-tooltip(v-if="link" v-for="(link, index) in scope.row.bioLinks" :key="index")
@@ -1446,7 +1445,7 @@ html
el-tooltip(v-for="item in userDialog.ref.$languages" :key="item.key" placement="top")
template(#content)
span {{ item.value }} ({{ item.key }})
span.famfamfam-flags(:class="languageClass(item.key)" style="display:inline-block;margin-right:5px")
span.flags(:class="languageClass(item.key)" style="display:inline-block;margin-right:5px")
div
el-tag.name(type="info" effect="plain" size="mini" :class="userDialog.ref.$trustClass" v-text="userDialog.ref.$trustLevel" style="margin-right:5px;margin-top:5px")
el-tag.x-tag-friend(v-if="userDialog.isFriend && userDialog.friend" type="info" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") Friend No.{{userDialog.friend.no}}
@@ -1750,10 +1749,8 @@ html
div(style="margin:5px 0")
span.x-link(@click="showLaunchDialog(room.$location.tag)")
span \#{{ room.$location.instanceName }} {{ room.$location.accessType }}
span.famfamfam-flags(v-if="room.$location.region === 'eu'" class="europeanunion" style="display:inline-block;margin-left:5px")
span.famfamfam-flags(v-else-if="room.$location.region === 'jp'" class="jp" style="display:inline-block;margin-left:5px")
span.flag-icon-use(v-else-if="room.$location.region === 'use'" style="display:inline-block;margin-left:5px")
span.flag-icon-usw(v-else style="display:inline-block;margin-left:5px")
span.flags(v-if="room.$location.region" :class="room.$location.region" style="display:inline-block;margin-left:5px")
span.flags(v-else class="us" style="display:inline-block;margin-left:5px")
i.el-icon-lock(v-if="room.$location.strict" style="display:inline-block;margin-left:5px")
el-tooltip(placement="top" content="Invite yourself" :disabled="hideTooltips")
invite-yourself(:location="room.$location.tag" style="margin-left:5px")
@@ -2012,12 +2009,12 @@ html
div(v-loading="languageDialog.loading")
div(style="margin:5px 0")
el-tag(v-for="item in API.currentUser.$languages" :key="item.key" size="small" type="info" effect="plain" closable @close="removeUserLanguage(item.key)" style="margin-right:5px")
span.famfamfam-flags(:class="languageClass(item.key)" style="display:inline-block;margin-right:5px")
span.flags(:class="languageClass(item.key)" style="display:inline-block;margin-right:5px")
| {{ item.value }} ({{ item.key }})
div(v-if="languageDialog.languageChoice === true")
el-select(v-model="languageDialog.languageValue" size="mini")
el-option(v-for="item in languageDialog.languages" :key="item.key" :value="item.key" :label="item.value")
span.famfamfam-flags(:class="languageClass(item.key)" style="display:inline-block;margin-right:5px")
span.flags(:class="languageClass(item.key)" style="display:inline-block;margin-right:5px")
| {{ item.value }} ({{ item.key }})
el-button(@click="languageDialog.languageChoice=false; addUserLanguage(languageDialog.languageValue)" size="mini") Ok
el-button(@click="languageDialog.languageChoice=false" size="mini" style="margin-left:0") Cancel
@@ -2882,10 +2879,8 @@ html
template(v-once #default="scope")
span.x-link(@click="showLaunchDialog(scope.row.location)")
span \#{{ scope.row.$location.instanceName }} {{ scope.row.$location.accessType }}
span.famfamfam-flags(v-if="scope.row.$location.region === 'eu'" class="europeanunion" style="display:inline-block;margin-left:5px")
span.famfamfam-flags(v-else-if="scope.row.$location.region === 'jp'" class="jp" style="display:inline-block;margin-left:5px")
span.flag-icon-use(v-else-if="scope.row.$location.region === 'use'" style="display:inline-block;margin-left:5px")
span.flag-icon-usw(v-else style="display:inline-block;margin-left:5px")
span.flags(v-if="scope.row.$location.region" :class="scope.row.$location.region" style="display:inline-block;margin-left:5px")
span.flags(v-else class="us" style="display:inline-block;margin-left:5px")
i.el-icon-lock(v-if="scope.row.$location.strict" style="display:inline-block;margin-left:5px")
el-table-column(label="Instance Creator" prop="location")
template(v-once #default="scope")
@@ -3130,6 +3125,13 @@ html
ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
div(style="margin-top:15px")
p(style="font-weight:bold") osu!resources
pre(style="font-size:12px;white-space:pre-line").
https://github.com/ppy/osu-resources
CC-BY-NC 4.0
https://github.com/ppy/osu-resources/blob/master/LICENCE.md
div(style="margin-top:15px")
p(style="font-weight:bold") SharpDX
pre(style="font-size:12px;white-space:pre-line").

13
html/src/vr.js
View File

@@ -79,7 +79,7 @@ Vue.component('marquee-text', MarqueeText);
Vue.component('location', {
template:
'<span>{{ text }}<slot></slot><span class="famfamfam-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>',
'<span>{{ text }}<slot></slot><span 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,
hint: {
@@ -122,14 +122,9 @@ Vue.component('marquee-text', MarqueeText);
!L.isOffline &&
!L.isPrivate
) {
if (L.region === 'eu') {
this.region = 'europeanunion';
} else if (L.region === 'jp') {
this.region = 'jp';
} else if (L.region === 'use') {
this.region = 'flag-icon-use';
} else {
this.region = 'flag-icon-usw';
this.region = L.region;
if (!L.region) {
this.region = 'us';
}
}
this.strict = L.strict;

1
html/src/vr.pug
View File

@@ -7,6 +7,7 @@ html
meta(http-equiv="viewport" content="width=device-width,initial-scale=1,user-scalable=no")
title VRCXVR
link(rel="stylesheet" href="vr.css")
link(rel="stylesheet" href="flags.css")
body
.x-app#x-app(class="x-app-type" :class="{ background: appType === '1' && config && config.backgroundEnabled }")
template(v-if="appType === '1'")

15
html/src/vr.scss
View File

@@ -12,7 +12,6 @@
@import '~animate.css/animate.min.css';
@import '~noty/lib/noty.css';
@import '~element-ui/lib/theme-chalk/index.css';
@import '~famfamfam-flags/dist/sprite/famfamfam-flags.min.css';
/*
마지노선인듯
@@ -397,17 +396,3 @@ i.x-user-status.busy {
right: -160px;
bottom: 0;
}
.flag-icon-use {
background-image: url('/images/flag_use.png');
background-size: 16px 11px;
width: 16px;
height: 11px;
}
.flag-icon-usw {
background-image: url('/images/flag_usw.png');
background-size: 16px 11px;
width: 16px;
height: 11px;
}

252
html/webpack.config.js
View File

@@ -5,132 +5,136 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
entry: {
vendor: [
'element-ui',
'noty',
'vue',
'vue-data-tables',
'vue-lazyload',
'uuid'
],
app: {
import: ['./src/app.js', './src/app.scss'],
dependOn: 'vendor'
entry: {
vendor: [
'element-ui',
'noty',
'vue',
'vue-data-tables',
'vue-lazyload',
'uuid'
],
app: {
import: ['./src/app.js', './src/app.scss'],
dependOn: 'vendor'
},
'app.dark': './src/app.dark.scss',
flags: './src/flags.scss',
vr: {
import: ['./src/vr.js', './src/vr.scss'],
dependOn: 'vendor'
}
},
'app.dark': './src/app.dark.scss',
vr: {
import: ['./src/vr.js', './src/vr.scss'],
dependOn: 'vendor'
}
},
output: {
filename: '[name].js',
library: {
type: 'window'
}
},
module: {
rules: [
{
test: /\.pug$/,
oneOf: [
{
resourceQuery: /^\?vue/,
use: 'pug-plain-loader'
},
{
use: ['raw-loader', 'pug-plain-loader']
}
output: {
filename: '[name].js',
library: {
type: 'window'
}
},
module: {
rules: [
{
test: /\.pug$/,
oneOf: [
{
resourceQuery: /^\?vue/,
use: 'pug-plain-loader'
},
{
use: ['raw-loader', 'pug-plain-loader']
}
]
},
{
test: /\.s?css$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
},
{
test: /\.(eot|png|svg|ttf|woff)/,
type: 'asset',
generator: {
filename: 'assets/[name][ext]'
}
}
]
},
{
test: /\.s?css$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
},
{
test: /\.(eot|png|svg|ttf|woff)/,
type: 'asset',
generator: {
filename: 'assets/[name][ext]'
},
resolve: {
extensions: ['.css', '.js', '.scss'],
alias: {
vue: path.join(
__dirname,
'./node_modules/vue/dist/vue.common.prod.js'
)
}
}
]
},
resolve: {
extensions: ['.css', '.js', '.scss'],
alias: {
vue: path.join(__dirname, './node_modules/vue/dist/vue.common.prod.js')
},
performance: {
hints: false
},
devtool: 'inline-source-map',
target: ['web', 'es2020'],
stats: {
preset: 'errors-only',
builtAt: true,
timings: true
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css'
}),
new HtmlWebpackPlugin({
filename: 'index.html',
template: './src/index.pug',
inject: false,
minify: false
}),
new HtmlWebpackPlugin({
filename: 'vr.html',
template: './src/vr.pug',
inject: false,
minify: false
}),
new CopyPlugin({
patterns: [
// assets
{
from: './images/',
to: './images/'
}
// // vscode-codicons
// {
// from: './node_modules/vscode-codicons/dist/codicon.css',
// to: 'vendor/vscode-codicons/'
// },
// {
// from: './node_modules/vscode-codicons/dist/codicon.ttf',
// to: 'vendor/vscode-codicons/'
// },
// // fontawesome
// {
// from: './node_modules/@fortawesome/fontawesome-free/webfonts/',
// to: 'vendor/fontawesome/webfonts/'
// },
// {
// from: './node_modules/@fortawesome/fontawesome-free/css/all.min.css',
// to: 'vendor/fontawesome/css/'
// },
// // element-plus
// {
// from: './node_modules/element-plus/lib/theme-chalk/fonts/',
// to: 'vendor/element-plus/lib/theme-chalk/fonts/'
// },
// {
// from: './node_modules/element-plus/lib/theme-chalk/index.css',
// to: 'vendor/element-plus/lib/theme-chalk/'
// }
]
})
],
optimization: {
minimizer: [
new TerserPlugin({
extractComments: false
})
]
}
},
performance: {
hints: false
},
devtool: 'inline-source-map',
target: ['web', 'es2020'],
stats: {
preset: 'errors-only',
builtAt: true,
timings: true
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css'
}),
new HtmlWebpackPlugin({
filename: 'index.html',
template: './src/index.pug',
inject: false,
minify: false
}),
new HtmlWebpackPlugin({
filename: 'vr.html',
template: './src/vr.pug',
inject: false,
minify: false
}),
new CopyPlugin({
patterns: [
// assets
{
from: './images/',
to: './images/'
}
// // vscode-codicons
// {
// from: './node_modules/vscode-codicons/dist/codicon.css',
// to: 'vendor/vscode-codicons/'
// },
// {
// from: './node_modules/vscode-codicons/dist/codicon.ttf',
// to: 'vendor/vscode-codicons/'
// },
// // fontawesome
// {
// from: './node_modules/@fortawesome/fontawesome-free/webfonts/',
// to: 'vendor/fontawesome/webfonts/'
// },
// {
// from: './node_modules/@fortawesome/fontawesome-free/css/all.min.css',
// to: 'vendor/fontawesome/css/'
// },
// // element-plus
// {
// from: './node_modules/element-plus/lib/theme-chalk/fonts/',
// to: 'vendor/element-plus/lib/theme-chalk/fonts/'
// },
// {
// from: './node_modules/element-plus/lib/theme-chalk/index.css',
// to: 'vendor/element-plus/lib/theme-chalk/'
// }
]
})
],
optimization: {
minimizer: [
new TerserPlugin({
extractComments: false
})
]
}
};