mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-06-21 09:50:43 +00:00
Ran prettier
This commit is contained in:
@@ -152,80 +152,66 @@ export class FlagInput extends LitElement {
|
||||
}
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<div class="flag-container">
|
||||
${this.flag === ""
|
||||
? html` <button
|
||||
class="no-selected-flag"
|
||||
@click=${() => (this.showModal = true)}
|
||||
return html`
|
||||
<div class="flag-container">
|
||||
${this.flag === ""
|
||||
? html` <button
|
||||
class="no-selected-flag"
|
||||
@click=${() => (this.showModal = true)}
|
||||
>
|
||||
Flags
|
||||
</button>`
|
||||
: html`<img
|
||||
class="selected-flag"
|
||||
src="/flags/${this.flag}.svg"
|
||||
@click=${() => (this.showModal = true)}
|
||||
/>`}
|
||||
${this.showModal
|
||||
? html`
|
||||
<div class="flag-modal ${this.showModal ? "" : "hidden"}">
|
||||
<input
|
||||
class="flag-search"
|
||||
type="text"
|
||||
placeholder="Search..."
|
||||
@change=${this.handleSearch}
|
||||
@keyup=${this.handleSearch}
|
||||
/>
|
||||
<div class="flag-dropdown">
|
||||
<!-- Show each flag as button -->
|
||||
<button
|
||||
@click=${() => this.setFlag("")}
|
||||
class="dropdown-item"
|
||||
>
|
||||
<img class="country-flag" src="/flags/none.svg" />
|
||||
<span class="country-name">None</span>
|
||||
</button>
|
||||
${Countries.filter(
|
||||
(country) =>
|
||||
country.name
|
||||
.toLowerCase()
|
||||
.includes(this.search.toLowerCase()) ||
|
||||
country.code
|
||||
.toLowerCase()
|
||||
.includes(this.search.toLowerCase()),
|
||||
).map(
|
||||
(country) => html`
|
||||
<button
|
||||
@click=${() => this.setFlag(country.code)}
|
||||
class="dropdown-item"
|
||||
>
|
||||
Flags
|
||||
</button>`
|
||||
: html`<img
|
||||
class="selected-flag"
|
||||
src="/flags/${this.flag}.svg"
|
||||
@click=${() => (this.showModal = true)}
|
||||
/>`}
|
||||
${this.showModal
|
||||
? html`
|
||||
<div
|
||||
class="flag-modal ${this.showModal
|
||||
? ""
|
||||
: "hidden"}"
|
||||
>
|
||||
<input
|
||||
class="flag-search"
|
||||
type="text"
|
||||
placeholder="Search..."
|
||||
@change=${this.handleSearch}
|
||||
@keyup=${this.handleSearch}
|
||||
/>
|
||||
<div class="flag-dropdown">
|
||||
<!-- Show each flag as button -->
|
||||
<button
|
||||
@click=${() => this.setFlag("")}
|
||||
class="dropdown-item"
|
||||
>
|
||||
<img
|
||||
class="country-flag"
|
||||
src="/flags/none.svg"
|
||||
/>
|
||||
<span class="country-name">None</span>
|
||||
</button>
|
||||
${Countries.filter(
|
||||
(country) =>
|
||||
country.name
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
this.search.toLowerCase()
|
||||
) ||
|
||||
country.code
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
this.search.toLowerCase()
|
||||
)
|
||||
).map(
|
||||
(country) => html`
|
||||
<button
|
||||
@click=${() =>
|
||||
this.setFlag(country.code)}
|
||||
class="dropdown-item"
|
||||
>
|
||||
<img
|
||||
class="country-flag"
|
||||
src="/flags/${country.code}.svg"
|
||||
/>
|
||||
<span class="country-name"
|
||||
>${country.name}</span
|
||||
>
|
||||
</button>
|
||||
`
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
: ""}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
<img
|
||||
class="country-flag"
|
||||
src="/flags/${country.code}.svg"
|
||||
/>
|
||||
<span class="country-name">${country.name}</span>
|
||||
</button>
|
||||
`,
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
: ""}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -153,8 +153,8 @@ export class NameLayer implements Layer {
|
||||
const flagImg = document.createElement("img");
|
||||
flagImg.classList.add("player-flag");
|
||||
flagImg.style.marginBottom = "-5%";
|
||||
flagImg.style.opacity = '0.8';
|
||||
flagImg.src = '/flags/' + sanitize(player.flag()) + '.svg';
|
||||
flagImg.style.opacity = "0.8";
|
||||
flagImg.src = "/flags/" + sanitize(player.flag()) + ".svg";
|
||||
flagImg.style.zIndex = "1";
|
||||
flagImg.style.width = "40%";
|
||||
flagImg.style.aspectRatio = "3/4";
|
||||
|
||||
+75
-65
@@ -11,129 +11,139 @@ export default (env, argv) => {
|
||||
const isProduction = argv.mode === "production";
|
||||
|
||||
return {
|
||||
entry: './src/client/Main.ts',
|
||||
entry: "./src/client/Main.ts",
|
||||
output: {
|
||||
publicPath: "/",
|
||||
filename: 'bundle.js',
|
||||
path: path.resolve(__dirname, 'out'),
|
||||
clean: true
|
||||
filename: "bundle.js",
|
||||
path: path.resolve(__dirname, "out"),
|
||||
clean: true,
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.bin$/,
|
||||
use: 'raw-loader'
|
||||
use: "raw-loader",
|
||||
},
|
||||
{
|
||||
test: /\.txt$/,
|
||||
use: 'raw-loader'
|
||||
use: "raw-loader",
|
||||
},
|
||||
{
|
||||
test: /\.ts$/,
|
||||
use: 'ts-loader',
|
||||
use: "ts-loader",
|
||||
exclude: /node_modules/,
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: [
|
||||
'style-loader',
|
||||
"style-loader",
|
||||
{
|
||||
loader: 'css-loader',
|
||||
loader: "css-loader",
|
||||
options: {
|
||||
importLoaders: 1
|
||||
}
|
||||
importLoaders: 1,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'postcss-loader',
|
||||
loader: "postcss-loader",
|
||||
options: {
|
||||
postcssOptions: {
|
||||
plugins: [
|
||||
'tailwindcss',
|
||||
'autoprefixer',
|
||||
],
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
plugins: ["tailwindcss", "autoprefixer"],
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpe?g|gif)$/i,
|
||||
type: 'asset/resource',
|
||||
type: "asset/resource",
|
||||
generator: {
|
||||
filename: 'images/[hash][ext][query]'
|
||||
}
|
||||
filename: "images/[hash][ext][query]",
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.html$/,
|
||||
use: ['html-loader']
|
||||
use: ["html-loader"],
|
||||
},
|
||||
{
|
||||
test: /\.svg$/,
|
||||
type: 'asset/inline',
|
||||
type: "asset/inline",
|
||||
},
|
||||
{
|
||||
test: /\.(woff|woff2|eot|ttf|otf)$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'file-loader',
|
||||
loader: "file-loader",
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'fonts/',
|
||||
publicPath: '../fonts/', // This is important
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
name: "[name].[ext]",
|
||||
outputPath: "fonts/",
|
||||
publicPath: "../fonts/", // This is important
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['.tsx', '.ts', '.js'],
|
||||
extensions: [".tsx", ".ts", ".js"],
|
||||
alias: {
|
||||
'protobufjs/minimal': path.resolve(__dirname, 'node_modules/protobufjs/minimal.js')
|
||||
}
|
||||
"protobufjs/minimal": path.resolve(
|
||||
__dirname,
|
||||
"node_modules/protobufjs/minimal.js",
|
||||
),
|
||||
},
|
||||
},
|
||||
plugins: [
|
||||
new HtmlWebpackPlugin({
|
||||
template: './src/client/index.html',
|
||||
filename: 'index.html'
|
||||
template: "./src/client/index.html",
|
||||
filename: "index.html",
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env.WEBSOCKET_URL': JSON.stringify(isProduction ? '' : 'localhost:3000')
|
||||
"process.env.WEBSOCKET_URL": JSON.stringify(
|
||||
isProduction ? "" : "localhost:3000",
|
||||
),
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env.GAME_ENV': JSON.stringify(isProduction ? 'prod' : 'dev')
|
||||
"process.env.GAME_ENV": JSON.stringify(isProduction ? "prod" : "dev"),
|
||||
}),
|
||||
new CopyPlugin({
|
||||
patterns: [
|
||||
{ from: "resources", to: path.resolve(__dirname, 'out') },
|
||||
],
|
||||
patterns: [{ from: "resources", to: path.resolve(__dirname, "out") }],
|
||||
options: {
|
||||
concurrency: 100,
|
||||
},
|
||||
}),
|
||||
],
|
||||
devServer: isProduction ? {} : {
|
||||
devMiddleware: { writeToDisk: true },
|
||||
static: {
|
||||
directory: path.join(__dirname, 'out'),
|
||||
},
|
||||
historyApiFallback: true,
|
||||
compress: true,
|
||||
port: 9000,
|
||||
proxy: [
|
||||
{
|
||||
context: ['/socket'],
|
||||
target: 'ws://localhost:3000',
|
||||
ws: true,
|
||||
devServer: isProduction
|
||||
? {}
|
||||
: {
|
||||
devMiddleware: { writeToDisk: true },
|
||||
static: {
|
||||
directory: path.join(__dirname, "out"),
|
||||
},
|
||||
historyApiFallback: true,
|
||||
compress: true,
|
||||
port: 9000,
|
||||
proxy: [
|
||||
{
|
||||
context: ["/socket"],
|
||||
target: "ws://localhost:3000",
|
||||
ws: true,
|
||||
},
|
||||
{
|
||||
context: [
|
||||
"/lobbies",
|
||||
"/join_game",
|
||||
"/join_lobby",
|
||||
"/private_lobby",
|
||||
"/start_private_lobby",
|
||||
"/lobby",
|
||||
"/archive_singleplayer_game",
|
||||
"/validate-username",
|
||||
],
|
||||
target: "http://localhost:3000",
|
||||
secure: false,
|
||||
changeOrigin: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
context: ['/lobbies', '/join_game', '/join_lobby', '/private_lobby', '/start_private_lobby',
|
||||
'/lobby', '/archive_singleplayer_game', '/validate-username'],
|
||||
target: 'http://localhost:3000',
|
||||
secure: false,
|
||||
changeOrigin: true,
|
||||
}
|
||||
],
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user