Input cleanup

This commit is contained in:
barsdeveloper
2022-11-11 20:31:17 +01:00
parent 18bf858db3
commit 48065a4777
12 changed files with 91 additions and 112 deletions

View File

@@ -527,7 +527,7 @@ ueb-pin[data-type=exec] .ueb-pin-name {
border: 1px solid #a0a0a0;
border-radius: 3px;
padding: 0 3px 0 3px;
color: #c0c0c0;
color: #e0e0e0;
}
.ueb-pin-input:hover, .ueb-pin-input:active, .ueb-pin-input:focus, .ueb-pin-input:focus-within {
background: rgba(255, 255, 255, 0.2745098039);

File diff suppressed because one or more lines are too long

View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../scss/style.scss","../../scss/ueb-link.scss","../../scss/ueb-node.scss","../../scss/ueb-pin.scss","../../scss/ueb-type-color.scss","../../scss/ueb-ui-controls.scss","../../scss/ueb-window.scss"],"names":[],"mappings":"AAAA,WACI,qBACA,oBACA,IACI,kGAIR,WACI,qBACA,mBACA,IACI,sGAIR,WACI,qBACA,iBACA,IACI,gGAIR,cACI,eACA,6CACA,cACA,kBACA,8EACA,+BACA,WACA,iBAGJ,kBACI,iBAGJ,qBACI,aACA,kBACA,MACA,QACA,OACA,aACA,0BACA,UAGJ,mBACI,iBACA,iCACA,eAGJ,mBACI,kBACA,gCACA,gBACA,kBAGJ,oDACI,gBAGJ,UACI,kFACA,kBACA,eACA,gBACA,+DACA,gEACA,yBACA,iBAEI,s3BA0BJ,gBAEI,sZAQJ,sFACA,gEACA,oDACA,qBACA,gBAGJ,6CACI,gBAGJ,8CACI,eAGJ,6BACI,eAGJ,6BACI,mBAGJ,6BACI,kBAGJ,6BACI,mBAGJ,6BACI,iBAGJ,6BACI,mBAGJ,6BACI,kBAGJ,8BACI,mBAGJ,8BACI,kBAGJ,8BACI,mBAGJ,8BACI,iBACA,uDAGJ,0BACI,gCAGJ,8BACI,mBACA,uDAGJ,8BACI,sBACA,uDAGJ,8BACI,iBACA,uDAGJ,8BACI,sBACA,uDAGJ,8BACI,sBACA,uDAGJ,+BACI,iBACA,uDAGJ,+BACI,sBACA,uDAGJ,+BACI,sBACA,uDAGJ,kBACI,kBACA,QACA,SACA,wGAGJ,sBACI,QACA,SAGJ,yEACI,kBAGJ,aACI,cACA,kBACA,kBACA,MACA,OACA,QACA,SACA,iBAEI,wlDAmDJ,gBAEI,gQAWJ,oBAEI,wJAOJ,4BAGJ,gDACI,mBAIJ,eACI,mBAGJ,0BACI,mBACA,uBACA,gBCzUJ,SACI,kEAEA,wEACA,cACA,6CACA,8CAKA,kBAIJ,aACI,oEACA,kBACA,WACA,YACA,eACA,+FAGJ,kBACI,mBACA,6BACA,wCAGJ,gEAEI,wCACA,4BAGJ,kBACI,cACA,mBACA,kBACA,mDACA,qHAOA,sBACA,gBACA,kBACA,4EACA,+BACA,mBACA,gBCxDJ,SACI,cACA,kBACA,qCACA,uDACA,oBAGJ,sBACI,gBAGJ,mEACI,YAGJ,iBACI,YACA,YACA,+CAGJ,8BACI,SACA,UAGJ,8CACI,iBACI,kNAIJ,oDACA,0CACA,sDAGJ,2DACI,2BACA,0BAGJ,4DACI,kBAGJ,kBACI,kBACA,YACA,gCACA,qCACA,6BACA,gBAGJ,+BACI,gBACA,UACA,mBAGJ,cACI,kBACA,WACI,+EAGJ,gEACA,8EACA,aACA,gBACA,mBAGJ,2BACI,gBACA,mBAGJ,6DACI,mBAGJ,gDACI,8EAIJ,eACI,mGACA,qBACA,mBAGJ,4BACI,gBAGJ,4BACI,kBAGJ,sBACI,cAGJ,0BACI,sBAGJ,wDACI,cAGJ,2BACI,sBAGJ,oBACI,wBAGJ,kBACI,aACA,cACA,gBACA,mBAGJ,iBACI,kBACA,iBAGJ,kBACI,iBACA,kBAGJ,0BACI,aACA,eACA,YACA,2HAMA,2HAMA,kBAGJ,+BACI,qBACA,6BAGJ,4CACI,kBAGJ,uEACI,cAGJ,oBACI,aACA,kBAGJ,iCACI,kBAGJ,yBACI,sBAGJ,oFACI,yBACA,eAGJ,oDACI,cAGJ,+DACI,qBCnMJ,QACI,cACA,gBAGJ,sBACI,kBAGJ,wEACI,aAGJ,iBACI,qBACA,iBACA,gBAEA,mBACI,qBACA,sBAIR,iFACI,qCACA,iBAGJ,oCACI,2BAGJ,0BACI,iBAGJ,sCACI,uBACA,WACA,YAGJ,cACI,WACA,YACA,kBACA,2BAGJ,kBACI,cACA,WACA,YAGJ,0CACI,kBAGJ,cACI,qBACA,sBAGJ,sCACI,aAGJ,8BACI,kBAGJ,uBACI,iBAGJ,eACI,qBACA,sBACA,gBACA,yBACA,kBACA,oBACA,aAEA,4FAII,yCACA,aAIR,uCACI,gBACA,UACA,YACA,WACA,yBACA,2BAGJ,+CACI,6OAGJ,oEACI,UACA,WACA,YACA,qBACA,gBACA,yCAGJ,oCACI,cAGJ,qBACI,sBACA,gBACA,WAGJ,uBACI,cACA,aACA,YACA,UACA,eACA,gBACA,gBACA,4BACA,gBACA,cACA,YACA,cAEA,0CACI,WACA,YAGJ,gDACI,mBACA,mBACA,WCrJR,cACI,6BAGJ,SACI,iDAGJ,QACI,4NAMA,+CAGJ,wBACI,+CAGJ,yBACI,gDAGJ,wBACI,+CAGJ,uBACI,8CAGJ,wBACI,+CAGJ,0BACI,iDAGJ,wBACI,+CAGJ,2BACI,kDAGJ,0BACI,iDAGJ,qDACI,uDAGJ,iDACI,kDAGJ,mDACI,oDAGJ,gDACI,iDAGJ,0BACI,iDCvEJ,YACI,eACA,yBACA,iBACA,mBACA,kBACA,eAEA,kBACI,mBAIR,aACI,aACA,yBACA,SACA,gBAGJ,mCACI,kBACA,oBAEA,qFAEI,WACA,cACA,kBACA,QACA,SACA,+BAGJ,2CACI,UACA,0BAGJ,0CACI,WACA,2BAIR,uCAEI,kBACA,yBACA,kBACA,mBAGJ,uBACI,kBACA,YAEA,6BACI,iBAIR,kCACI,iBAGJ,qCACI,cACA,kBACA,YACA,kBACA,mBAGJ,4BACI,kBACA,cACA,iBACA,UAKA,4BACI,WACA,qBACA,6BACA,oCACA,qCACA,sBAGJ,0BACI,eC3FR,WACI,cACA,kBACA,sBACA,MACA,OACA,sGACA,mBACA,6CACA,aAGJ,gBACI,aACA,mBACA,mBACA,gBACA,YACA,mBAGJ,oBACI,aACA,yBAGJ,iBACI,YACA,kBACA,kBAGJ,kBACI,YACA,YACA,WACA,eAGJ,+CAEI,qBACA,sBAGJ,uBACI,aACA,2DAGJ,wBACI,kBACA,iBACA,gBACA,mBACA,WACI,mLAWR,kBACI,cACA,kBACA,gBACA,iBACA,UACA,WACA,sBACA,kBAGJ,0CACI,8BACA,6BAGJ,qDAEI,aACA,oBACA,WAGJ,6BACI,iBACA,4EAGJ,wBACI,kBACA,4EAGJ,cACI,cAGJ,2CACI,yCAGJ,sCACI,yCAGJ,0BACI,kBACA,sBAEA,mEAEI,WACA,cACA,kBACA,oBACA,UACA,0BAGJ,iCACI,QAIR,4DAEI,YACA,YAGJ,8BACI,aAGJ,wDAEI,UAGJ,2BACI,aACA,gBACA,gBAGJ,oDACI,aACA,sBACA,8BACA,YACA,UAGJ,wDACI,aACA,mBACA,kBAEA,4DACI,YAIR,kDACI,YAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,2BACI,WAGJ,mBACI,oBAGJ,yBACI,iBACA,aAGJ,0CACI,UACA,iBACA,sBACA","file":"ueb-style.min.css"}
{"version":3,"sourceRoot":"","sources":["../../scss/style.scss","../../scss/ueb-link.scss","../../scss/ueb-node.scss","../../scss/ueb-pin.scss","../../scss/ueb-type-color.scss","../../scss/ueb-ui-controls.scss","../../scss/ueb-window.scss"],"names":[],"mappings":"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","file":"ueb-style.min.css"}

93
dist/ueblueprint.js vendored
View File

@@ -4539,6 +4539,9 @@ class ColorPickerWindowTemplate extends WindowTemplate {
*/
class IInputPinTemplate extends PinTemplate {
static singleLineInput = false
static selectOnFocus = true
/** @type {HTMLElement[]} */
#inputContentElements
get inputContentElements() {
@@ -4600,8 +4603,10 @@ class IInputPinTemplate extends PinTemplate {
/** @param {String[]?} values */
setInputs(values = [], updateDefaultValue = true) {
this.#inputContentElements.forEach(
(elem, i) => elem.innerText = values[i]
// @ts-expect-error
this.#inputContentElements.forEach(this.constructor.singleLineInput
? (elem, i) => elem.innerText = values[i]
: (elem, i) => elem.innerText = values[i].replaceAll("\n", "")
);
if (updateDefaultValue) {
this.setDefaultValue(values.map(v => IInputPinTemplate.stringFromInputToUE(v)), values);
@@ -4609,14 +4614,21 @@ class IInputPinTemplate extends PinTemplate {
}
setDefaultValue(values = [], rawValues = values) {
this.element.setDefaultValue(values.reduce((acc, cur) => acc + cur, ""));
this.element.setDefaultValue(
// @ts-expect-error
values.join("")
);
}
renderInput() {
if (this.element.isInput()) {
// @ts-expect-error
const singleLine = this.constructor.singleLineInput;
// @ts-expect-error
const selectOnFocus = this.constructor.selectOnFocus;
return $`
<div class="ueb-pin-input">
<ueb-input
<ueb-input .singleLine="${singleLine}" .selectOnFocus="${selectOnFocus}"
.innerText="${IInputPinTemplate.stringFromUEToInput(this.element.entity.DefaultValue.toString())}">
</ueb-input>
</div>
@@ -4855,44 +4867,7 @@ class LinearColorPinTemplate extends IInputPinTemplate {
class NamePinTemplate extends IInputPinTemplate {
/** @type {(e : InputEvent) => void} */
onInputHandler
/** @param {Map} changedProperties */
firstUpdated(changedProperties) {
super.firstUpdated(changedProperties);
this.onInputHandler = e => {
e.stopPropagation();
if (
e.inputType == "insertParagraph"
|| e.inputType == "insertLineBreak"
|| (e.inputType == "insertFromPaste" && /** @type {HTMLElement} */(e.target).innerText.includes("\n"))
) {
/** @type {HTMLElement} */(e.target).blur(); // Loose focus in case it tries to insert newline
this.inputContentElements.forEach(element => element.innerText = element.innerText.replaceAll("\n", ""));
}
};
this.inputContentElements.forEach(element => {
element.addEventListener("input", /** @type {(e : Event) => void} */(this.onInputHandler));
});
}
cleanup() {
super.cleanup();
this.inputContentElements.forEach(element => {
element.removeEventListener("input", /** @type {(e : Event) => void} */(this.onInputHandler));
});
}
getInputs() {
return this.inputContentElements.map(element => element.textContent) // textContent for performance reason
}
/** @param {String[]} values */
setInputs(values = [], updateDefaultValue = true) {
values = values.map(value => value.replaceAll("\n", "")); // get rid of the new lines
super.setInputs(values, updateDefaultValue);
}
static singleLineInput = true
}
/**
@@ -4901,6 +4876,8 @@ class NamePinTemplate extends IInputPinTemplate {
*/
class INumericPinTemplate extends IInputPinTemplate {
static singleLineInput = true
/** @param {String[]} values */
setInputs(values = [], updateDefaultValue = false) {
if (!values || values.length == 0) {
@@ -5036,21 +5013,21 @@ class VectorPinTemplate extends INumericPinTemplate {
<div class="ueb-pin-input-wrapper">
<span class="ueb-pin-input-label">X</span>
<div class="ueb-pin-input">
<span class="ueb-pin-input-content ueb-pin-input-x" role="textbox" contenteditable="true" .innerText="${IInputPinTemplate
.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().X))
}"></span>
<ueb-input .singleLine="${true}"
.innerText="${IInputPinTemplate.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().X))}">
</ueb-input>
</div>
<span class="ueb-pin-input-label">Y</span>
<div class="ueb-pin-input">
<span class="ueb-pin-input-content ueb-pin-input-y" role="textbox" contenteditable="true" .innerText="${IInputPinTemplate
.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Y))
}"></span>
<ueb-input .singleLine="${true}"
.innerText="${IInputPinTemplate.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Y))}">
</ueb-input>
</div>
<span class="ueb-pin-input-label">Z</span>
<div class="ueb-pin-input">
<span class="ueb-pin-input-content ueb-pin-input-z" role="textbox" contenteditable="true" .innerText="${IInputPinTemplate
.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Z))
}"></span>
<ueb-input .singleLine="${true}"
.innerText="${IInputPinTemplate.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Z))}">
</ueb-input>
</div>
</div>
`
@@ -6481,7 +6458,12 @@ customElements.define("ueb-blueprint", Blueprint);
/** @extends {ITemplate<InputElement>} */
class InputTemplate extends ITemplate {
#focusHandler = () => this.element.blueprint.dispatchEditTextEvent(true)
#focusHandler = () => {
this.element.blueprint.dispatchEditTextEvent(true);
if (this.element.selectOnFocus) {
getSelection().selectAllChildren(this.element);
}
}
#focusoutHandler = () => {
this.element.blueprint.dispatchEditTextEvent(false);
document.getSelection()?.removeAllRanges(); // Deselect eventually selected text inside the input
@@ -6538,6 +6520,12 @@ class InputElement extends IElement {
converter: Utility.booleanConverter,
reflect: true,
},
selectOnFocus: {
type: Boolean,
attribute: "data-select-focus",
converter: Utility.booleanConverter,
reflect: true,
},
blurOnEnter: {
type: Boolean,
attribute: "data-blur-enter",
@@ -6549,6 +6537,7 @@ class InputElement extends IElement {
constructor() {
super({}, new InputTemplate());
this.singleLine = false;
this.selectOnFocus = true;
this.blurOnEnter = true;
}
}

File diff suppressed because one or more lines are too long

View File

@@ -12,6 +12,12 @@ export default class InputElement extends IElement {
converter: Utility.booleanConverter,
reflect: true,
},
selectOnFocus: {
type: Boolean,
attribute: "data-select-focus",
converter: Utility.booleanConverter,
reflect: true,
},
blurOnEnter: {
type: Boolean,
attribute: "data-blur-enter",
@@ -23,6 +29,7 @@ export default class InputElement extends IElement {
constructor() {
super({}, new InputTemplate())
this.singleLine = false
this.selectOnFocus = true
this.blurOnEnter = true
}
}

View File

@@ -2,6 +2,7 @@ import { html, nothing } from "lit"
import MouseIgnore from "../input/mouse/MouseIgnore"
import PinTemplate from "./PinTemplate"
import Utility from "../Utility"
/**
* @template T
* @typedef {import("../element/PinElement").default<T>} PinElement
@@ -13,6 +14,9 @@ import Utility from "../Utility"
*/
export default class IInputPinTemplate extends PinTemplate {
static singleLineInput = false
static selectOnFocus = true
/** @type {HTMLElement[]} */
#inputContentElements
get inputContentElements() {
@@ -74,8 +78,10 @@ export default class IInputPinTemplate extends PinTemplate {
/** @param {String[]?} values */
setInputs(values = [], updateDefaultValue = true) {
this.#inputContentElements.forEach(
(elem, i) => elem.innerText = values[i]
// @ts-expect-error
this.#inputContentElements.forEach(this.constructor.singleLineInput
? (elem, i) => elem.innerText = values[i]
: (elem, i) => elem.innerText = values[i].replaceAll("\n", "")
)
if (updateDefaultValue) {
this.setDefaultValue(values.map(v => IInputPinTemplate.stringFromInputToUE(v)), values)
@@ -83,14 +89,21 @@ export default class IInputPinTemplate extends PinTemplate {
}
setDefaultValue(values = [], rawValues = values) {
this.element.setDefaultValue(values.reduce((acc, cur) => acc + cur, ""))
this.element.setDefaultValue(
// @ts-expect-error
values.join("")
)
}
renderInput() {
if (this.element.isInput()) {
// @ts-expect-error
const singleLine = this.constructor.singleLineInput
// @ts-expect-error
const selectOnFocus = this.constructor.selectOnFocus
return html`
<div class="ueb-pin-input">
<ueb-input
<ueb-input .singleLine="${singleLine}" .selectOnFocus="${selectOnFocus}"
.innerText="${IInputPinTemplate.stringFromUEToInput(this.element.entity.DefaultValue.toString())}">
</ueb-input>
</div>

View File

@@ -6,6 +6,8 @@ import IInputPinTemplate from "./IInputPinTemplate"
*/
export default class INumericPinTemplate extends IInputPinTemplate {
static singleLineInput = true
/** @param {String[]} values */
setInputs(values = [], updateDefaultValue = false) {
if (!values || values.length == 0) {

View File

@@ -5,7 +5,12 @@ import ITemplate from "./ITemplate"
/** @extends {ITemplate<InputElement>} */
export default class InputTemplate extends ITemplate {
#focusHandler = () => this.element.blueprint.dispatchEditTextEvent(true)
#focusHandler = () => {
this.element.blueprint.dispatchEditTextEvent(true)
if (this.element.selectOnFocus) {
getSelection().selectAllChildren(this.element)
}
}
#focusoutHandler = () => {
this.element.blueprint.dispatchEditTextEvent(false)
document.getSelection()?.removeAllRanges() // Deselect eventually selected text inside the input

View File

@@ -4,42 +4,5 @@ import IInputPinTemplate from "./IInputPinTemplate"
export default class NamePinTemplate extends IInputPinTemplate {
/** @type {(e : InputEvent) => void} */
onInputHandler
/** @param {Map} changedProperties */
firstUpdated(changedProperties) {
super.firstUpdated(changedProperties)
this.onInputHandler = e => {
e.stopPropagation()
if (
e.inputType == "insertParagraph"
|| e.inputType == "insertLineBreak"
|| (e.inputType == "insertFromPaste" && /** @type {HTMLElement} */(e.target).innerText.includes("\n"))
) {
/** @type {HTMLElement} */(e.target).blur() // Loose focus in case it tries to insert newline
this.inputContentElements.forEach(element => element.innerText = element.innerText.replaceAll("\n", ""))
}
}
this.inputContentElements.forEach(element => {
element.addEventListener("input", /** @type {(e : Event) => void} */(this.onInputHandler))
})
}
cleanup() {
super.cleanup()
this.inputContentElements.forEach(element => {
element.removeEventListener("input", /** @type {(e : Event) => void} */(this.onInputHandler))
})
}
getInputs() {
return this.inputContentElements.map(element => element.textContent) // textContent for performance reason
}
/** @param {String[]} values */
setInputs(values = [], updateDefaultValue = true) {
values = values.map(value => value.replaceAll("\n", "")) // get rid of the new lines
super.setInputs(values, updateDefaultValue)
}
static singleLineInput = true
}

View File

@@ -32,21 +32,21 @@ export default class VectorPinTemplate extends INumericPinTemplate {
<div class="ueb-pin-input-wrapper">
<span class="ueb-pin-input-label">X</span>
<div class="ueb-pin-input">
<span class="ueb-pin-input-content ueb-pin-input-x" role="textbox" contenteditable="true" .innerText="${IInputPinTemplate
.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().X))
}"></span>
<ueb-input .singleLine="${true}"
.innerText="${IInputPinTemplate.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().X))}">
</ueb-input>
</div>
<span class="ueb-pin-input-label">Y</span>
<div class="ueb-pin-input">
<span class="ueb-pin-input-content ueb-pin-input-y" role="textbox" contenteditable="true" .innerText="${IInputPinTemplate
.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Y))
}"></span>
<ueb-input .singleLine="${true}"
.innerText="${IInputPinTemplate.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Y))}">
</ueb-input>
</div>
<span class="ueb-pin-input-label">Z</span>
<div class="ueb-pin-input">
<span class="ueb-pin-input-content ueb-pin-input-z" role="textbox" contenteditable="true" .innerText="${IInputPinTemplate
.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Z))
}"></span>
<ueb-input .singleLine="${true}"
.innerText="${IInputPinTemplate.stringFromUEToInput(Utility.minDecimals(this.element.entity.getDefaultValue().Z))}">
</ueb-input>
</div>
</div>
`

View File

@@ -82,7 +82,7 @@ ueb-pin[data-type="exec"] .ueb-pin-name {
border: 1px solid #a0a0a0;
border-radius: 3px;
padding: 0 3px 0 3px;
color: #c0c0c0;
color: #e0e0e0;
&:hover,
&:active,
@@ -149,4 +149,4 @@ ueb-pin[data-type="/Script/CoreUObject.LinearColor"] .ueb-pin-input {
border-radius: 10px;
margin: 4px;
}
}
}