Skip to content

Commit

Permalink
Merge pull request #448 from ewanhowell5195/master
Browse files Browse the repository at this point in the history 
Minecraft Title Generator font page changes
  • Loading branch information
@JannisX11
JannisX11 authored Dec 1, 2023
2 parents fc93c78 + 41e3e6d commit 46fd562
Show file tree
Hide file tree
Showing 2 changed files with 70 additions and 49 deletions.
2 changes: 1 addition & 1 deletion plugins.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -313,7 +313,7 @@
"author": "Ewan Howell",
"description": "Create Minecraft-styled title models!",
"tags": ["Minecraft", "Title", "Logo"],
"version": "1.3.4",
"version": "1.3.5",
"min_version": "4.8.0",
"variant": "both",
"creation_date": "2023-06-10",
Expand Down
117 changes: 69 additions & 48 deletions plugins/minecraft_title_generator/minecraft_title_generator.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@
author,
description,
tags: ["Minecraft", "Title", "Logo"],
version: "1.3.4",
version: "1.3.5",
min_version: "4.8.0",
variant: "both",
creation_date: "2023-06-10",
Expand Down Expand Up @@ -188,7 +188,7 @@
overflow-x: hidden;
}
.minecraft-title-list.small {
max-height: 198px;
max-height: 256px;
}
.minecraft-title-item {
display: flex;
Expand Down Expand Up @@ -278,6 +278,12 @@
.spacer, #minecraft_title_generator .sp-preview, #minecraft_title_generator .form_inline_select > li {
flex: 1;
}
#minecraft_title_generator .form_inline_select > .disabled {
cursor: not-allowed;
color: inherit !important;
text-decoration: line-through;
opacity: 0.5;
}
.minecraft-title-item-buttons > i:hover, #minecraft-title-preview-container > i:hover, .minecraft-title-button:hover, #minecraft-title-custom-texture > i:hover, .text-input-row > i:hover, .minecraft-title-button:hover > svg {
color: var(--color-light);
}
Expand Down Expand Up @@ -981,13 +987,14 @@
font-size: 1.25rem;
z-index: 1;
flex-direction: column;
gap: 5px;
gap: 3px;
display: flex;
}
.minecraft-title-item-buttons > i {
display: none;
font-size: 1.25rem;
}
.minecraft-title-item:hover i{
.minecraft-title-item:hover i {
display: flex !important;
}
.minecraft-title-item-author:hover::after {
Expand All @@ -1003,6 +1010,10 @@
.minecraft-title-item:nth-child(3n) .minecraft-title-item-author:hover::after {
transform: translateX(calc(-100% - 25px));
}
.minecraft-title-item-buttons > .fa::before {
font-size: 16px;
margin-left: 1.25px;
}
#minecraft-title-expanded-preview {
position: absolute;
inset: 26px 0 0;
Expand Down Expand Up @@ -1189,18 +1200,6 @@
#minecraft-title-connection-warning-underline {
text-decoration: underline;
}
.minecraft-title-toggleable {
cursor: pointer;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
}
.minecraft-title-toggleable > svg {
fill: var(--color-text);
width: 30px;
height: 30px;
}
</style>`],
component: {
data: {
Expand All @@ -1209,8 +1208,8 @@
text: "",
font: Object.keys(fonts)[0],
baseFont: Object.keys(fonts)[0],
fontTab: "fonts",
fontVariant: null,
fontVariantsVisible: false,
fonts,
fontList: [],
textType: "top",
Expand Down Expand Up @@ -1996,27 +1995,43 @@
}
}).show()
},
textInfo() {
textInfo(font, parent) {
new Blockbench.Dialog({
id: "minecraft_title_info",
title: "Minecraft Title Info",
title: `${parent && parent !== font ? `${fonts[parent].name} ` : ""}${fonts[font].name} Info`,
lines: [`<style>
#minecraft_title_info code {
#minecraft_title_info .code, #minecraft_title_info code {
padding: 0 2px;
border: 1px solid var(--color-border);
font-family: var(--font-code);
background-color: var(--color-back);
cursor: text;
user-select: text;
}
</style>`],
component: { template: `
<p class="markdown">
<ul>
<li>Available characters:<br><code>${Object.keys(fonts[this.font].characters).sort().join("").replace(/[😩😳┣┫]/g, "")}</code></li>
<li>You can use a lowercase <code>a</code> for a normal <code>a</code>, or an uppercase <code>A</code> for a creeper face <code>a</code></li>
</ul>
</p>
<div>
${fonts[font].description ? `<p>${fonts[font].description.replace(/`(.*?)`/g, "<code>$1</code>")}</p>` : ""}
<h2>Available Characters</h2>
<div class="code">${Object.keys(fonts[font].characters).sort((a, b) => {
const isALetter = /[a-zA-Z]/.test(a)
const isBLetter = /[a-zA-Z]/.test(b)
const isANumber = /\d/.test(a)
const isBNumber = /\d/.test(b)
if (isALetter) {
if (!isBLetter) return -1
else if (isBLetter)
return a.localeCompare(b)
} else if (isANumber) {
if (!isBLetter && !isBNumber) return -1
else if (isBLetter) return 1
else if (isBNumber) return a.localeCompare(b)
} else {
if (isBLetter || isBNumber) return 1
else return a.localeCompare(b)
}
}).join(" ").replace(/[😩😳]/g, "")}</div>
<p style="margin-top:10px">You can use an uppercase <code>A</code> to get the <code>a</code> with the creeper face.</p>
</div>
` },
buttons: ["dialog.close"]
}).show()
Expand Down Expand Up @@ -2087,7 +2102,7 @@
<p>The text you want to add to the scene</p>
<div class="text-input-row">
<input id="minecraft-title-text-input" class="dark_bordered" v-model="text" placeholder="Minecraft"/>
<i class="material-icons" title="More info" @click="textInfo">info</i>
<i class="fa fa-circle-info" title="More info" @click="textInfo(font, baseFont)"></i>
</div>
<br>
<div class="minecraft-title-header-row">
Expand All @@ -2100,36 +2115,36 @@
</div>
</div>
<p>The font to use for the text</p>
<div class="minecraft-title-list small">
<ul class="form_inline_select">
<li @click="fontTab = 'fonts'" :class="{ selected: fontTab === 'fonts' }">Fonts</li>
<li @click="fonts[font].variants ? fontTab = 'variants' : null" :class="{ selected: fontTab === 'variants', disabled: !fonts[font].variants }">Variants</li>
</ul>
<div v-if="fontTab === 'fonts'" class="minecraft-title-list small">
<div class="minecraft-title-item" v-for="[id, data] of fontList" @click="font = id; baseFont = id; fontVariant = null; variant = null; updateFont()" :class="{ selected: baseFont === id }">
<img :src="data.thumbnail ?? '${root}/fonts/' + id + '/thumbnails/flat.png'" />
<div :style="{ maxWidth: data.variants ? '78%' : null }">{{ data.name }}</div>
<div class="minecraft-title-item-buttons">
<i v-if="data.author" class="minecraft-title-item-author material-icons" :data-author="'By ' + data.author">person</i>
<i class="fa fa-circle-info" title="More info" @click="textInfo(id)"></i>
</div>
<i v-if="data.variants" class="minecraft-title-item-has-variants material-icons" :title="'Has ' + (data.variants.length + 1) + ' variants'">filter_{{ data.variants.length > 9 ? '9_plus' : data.variants.length + 1 }}</i>
</div>
</div>
<div v-if="fonts[font].variants">
<br>
<h2 class="minecraft-title-toggleable" @click="fontVariantsVisible = !fontVariantsVisible">
Font Variants
<svg :style="{ rotate: fontVariantsVisible ? '180deg' : '0deg' }" viewBox="0 0 24 24"><path d="M7.41 8.58L12 13.17l4.59-4.59L18 10l-6 6-6-6 1.41-1.42z"/></svg>
</h2>
<div v-if="fontVariantsVisible" class="minecraft-title-list small">
<div class="minecraft-title-item" @click="font = baseFont; fontVariant = null; variant = null; updateFont()" :class="{ selected: !fontVariant }">
<img :src="'${root}/fonts/' + baseFont + '/thumbnails/flat.png'" />
<div>{{ fonts[baseFont].name }}</div>
<div class="minecraft-title-item-buttons">
<i v-if="fonts[baseFont].author" class="minecraft-title-item-author material-icons" :data-author="'By ' + fonts[baseFont].author">person</i>
</div>
<div v-if="fonts[font].variants && fontTab === 'variants'" class="minecraft-title-list small">
<div class="minecraft-title-item" @click="font = baseFont; fontVariant = null; variant = null; updateFont()" :class="{ selected: !fontVariant }">
<img :src="'${root}/fonts/' + baseFont + '/thumbnails/flat.png'" />
<div>Default</div>
<div class="minecraft-title-item-buttons">
<i v-if="fonts[baseFont].author" class="minecraft-title-item-author material-icons" :data-author="'By ' + fonts[baseFont].author">person</i>
<i class="fa fa-circle-info" title="More info" @click="textInfo(baseFont)"></i>
</div>
<div class="minecraft-title-item" v-for="data of fonts[baseFont].variants" @click="font = data.id; fontVariant = data.id, variant = null; updateFont()" :class="{ selected: fontVariant === data.id }">
<img :src="'${root}/fonts/' + data.id + '/thumbnails/flat.png'" />
<div>{{ data.name }}</div>
<div class="minecraft-title-item-buttons">
<i v-if="data.author" class="minecraft-title-item-author material-icons" :data-author="'By ' + data.author">person</i>
</div>
</div>
<div class="minecraft-title-item" v-for="data of fonts[baseFont].variants" @click="font = data.id; fontVariant = data.id, variant = null; updateFont()" :class="{ selected: fontVariant === data.id }">
<img :src="'${root}/fonts/' + data.id + '/thumbnails/flat.png'" />
<div>{{ data.name }}</div>
<div class="minecraft-title-item-buttons">
<i v-if="data.author" class="minecraft-title-item-author material-icons" :data-author="'By ' + data.author">person</i>
<i class="fa fa-circle-info" title="More info" @click="textInfo(data.id, baseFont)"></i>
</div>
</div>
</div>
Expand Down Expand Up @@ -2421,6 +2436,7 @@
font.textures = `fonts/${font.id}/textures.json`
fonts[font.id] = font
}
font.parsed = true
if (font.variants) for (const [j, v] of font.variants.entries()) {
const variant = Object.assign({}, font, v)
variant.name ??= titleCase(variant.id)
Expand All @@ -2429,8 +2445,13 @@
delete variant.overlays
fonts[variant.id] = variant
font.variants[j] = variant
variant.parsed = true
}
}
for (const font of Object.entries(fonts).filter(e => !e[1].parsed)) {
font[1].id = font[0]
fontData.push(font[1])
}
this.content_vue.fontList = fontData.map(e => [e.id, e])
this.content_vue.textures = Object.entries(fonts["minecraft-ten"].textures).map(e => e.concat(["minecraft-ten"]))
this.content_vue.overlays = Object.entries(fonts["minecraft-ten"].overlays).map(e => e.concat(["minecraft-ten"]))
Expand Down

0 comments on commit 46fd562

Please sign in to comment.