VienDesuPorting/OMORI_Android
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

PIXI Controls: Reimplement safe area with clamp()

Browse source
This commit is contained in:
OleSTEEP 2024-02-18 14:39:12 +03:00
parent 11de5727a1
commit e6f31a5e4f
1 changed files with 37 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

69
www.rus/js/plugins/VND_ONSControls.js
View file

@ -248,6 +248,7 @@ ONSControls.updateButtons = function() {
container.height = buttonsSize * 2; container.height = buttonsSize * 2;
container.alpha = ConfigManager.ONSConfig.buttonsOpacity; container.alpha = ConfigManager.ONSConfig.buttonsOpacity;
container.position.set(ConfigManager.ONSConfig.buttonsX, ConfigManager.ONSConfig.buttonsY); container.position.set(ConfigManager.ONSConfig.buttonsX, ConfigManager.ONSConfig.buttonsY);
container.position = this.toSafeArea(container.position, container);
// Update DPAD // Update DPAD
const dPadSize = ConfigManager.ONSConfig.dPadSize; const dPadSize = ConfigManager.ONSConfig.dPadSize;
@ -256,15 +257,18 @@ ONSControls.updateButtons = function() {
dpadContainer.height = dPadSize; dpadContainer.height = dPadSize;
dpadContainer.alpha = ConfigManager.ONSConfig.buttonsOpacity; dpadContainer.alpha = ConfigManager.ONSConfig.buttonsOpacity;
dpadContainer.position.set(ConfigManager.ONSConfig.dPadX, ConfigManager.ONSConfig.dPadY); dpadContainer.position.set(ConfigManager.ONSConfig.dPadX, ConfigManager.ONSConfig.dPadY);
dpadContainer.position = this.toSafeArea(dpadContainer.position, dpadContainer);
// Update LB/RB // Update LB/RB
const LBsprite = this._LBsprite; const LBsprite = this._LBsprite;
const RBsprite = this._RBsprite; const RBsprite = this._RBsprite;
LBsprite.position.set(ConfigManager.ONSConfig.LBX, ConfigManager.ONSConfig.LBY); LBsprite.position.set(ConfigManager.ONSConfig.LBX, ConfigManager.ONSConfig.LBY);
LBsprite.position = this.toSafeArea(LBsprite.position, LBsprite);
LBsprite.alpha = ConfigManager.ONSConfig.buttonsOpacity; LBsprite.alpha = ConfigManager.ONSConfig.buttonsOpacity;
LBsprite.width = ConfigManager.ONSConfig.bumpersWidth; LBsprite.width = ConfigManager.ONSConfig.bumpersWidth;
LBsprite.height = ConfigManager.ONSConfig.bumpersHeight; LBsprite.height = ConfigManager.ONSConfig.bumpersHeight;
RBsprite.position.set(ConfigManager.ONSConfig.RBX, ConfigManager.ONSConfig.RBY); RBsprite.position.set(ConfigManager.ONSConfig.RBX, ConfigManager.ONSConfig.RBY);
RBsprite.position = this.toSafeArea(RBsprite.position, RBsprite);
RBsprite.alpha = ConfigManager.ONSConfig.buttonsOpacity; RBsprite.alpha = ConfigManager.ONSConfig.buttonsOpacity;
RBsprite.width = ConfigManager.ONSConfig.bumpersWidth; RBsprite.width = ConfigManager.ONSConfig.bumpersWidth;
RBsprite.height = ConfigManager.ONSConfig.bumpersHeight; RBsprite.height = ConfigManager.ONSConfig.bumpersHeight;
@ -272,6 +276,7 @@ ONSControls.updateButtons = function() {
// Update additional // Update additional
const showButton = this._showButton; const showButton = this._showButton;
showButton.position.set(ConfigManager.ONSConfig.showX, ConfigManager.ONSConfig.showY); showButton.position.set(ConfigManager.ONSConfig.showX, ConfigManager.ONSConfig.showY);
showButton.position = this.toSafeArea(showButton.position, showButton);
showButton.width = ConfigManager.ONSConfig.additonalSize; showButton.width = ConfigManager.ONSConfig.additonalSize;
showButton.height = ConfigManager.ONSConfig.additonalSize; showButton.height = ConfigManager.ONSConfig.additonalSize;
showButton.alpha = ConfigManager.ONSConfig.buttonsOpacity; showButton.alpha = ConfigManager.ONSConfig.buttonsOpacity;
@ -280,7 +285,7 @@ ONSControls.updateButtons = function() {
//============================================================================= //=============================================================================
// * Clamp to safe area // * Clamp to safe area
//============================================================================= //=============================================================================
ONSControls.clampSafeArea = function(position, element) { ONSControls.toSafeArea = function(position, element) {
let safeAreaX = ConfigManager.ONSConfig.safeArea + element.width / 2; let safeAreaX = ConfigManager.ONSConfig.safeArea + element.width / 2;
let safeAreaY = ConfigManager.ONSConfig.safeArea + element.height / 2; let safeAreaY = ConfigManager.ONSConfig.safeArea + element.height / 2;
position.x = position.x.clamp(safeAreaX, this._controlsCanvas.screen.width - safeAreaX); position.x = position.x.clamp(safeAreaX, this._controlsCanvas.screen.width - safeAreaX);
@ -379,7 +384,7 @@ ONSControls.setupDragNDrop = function(element) {
} }
var onMove = function(event) { var onMove = function(event) {
if (element) { if (element) {
element.parent.toLocal(ONSControls.clampSafeArea(event.data.global, element), null, element.position); element.parent.toLocal(ONSControls.toSafeArea(event.data.global, element), null, element.position);
ConfigManager.ONSConfig.customPos = true; ConfigManager.ONSConfig.customPos = true;
}; };
} }
@ -564,22 +569,22 @@ ConfigManager.ONSConfig.buttonsScale ||= this.options.buttonsScale;
ConfigManager.ONSConfig.buttonsOpacity ||= this.options.buttonsOpacity; ConfigManager.ONSConfig.buttonsOpacity ||= this.options.buttonsOpacity;
ConfigManager.ONSConfig.safeArea ||= ONSControls._controlsCanvas.vh(0.032); ConfigManager.ONSConfig.safeArea ||= ONSControls._controlsCanvas.vh(0.032);
ConfigManager.ONSConfig.buttonsSize ||= ONSControls._controlsCanvas.vh(0.18) * ConfigManager.ONSConfig.buttonsScale; ConfigManager.ONSConfig.buttonsSize ||= ONSControls._controlsCanvas.vh(0.18) * ConfigManager.ONSConfig.buttonsScale;
ConfigManager.ONSConfig.buttonsX ||= ONSControls._controlsCanvas.screen.width - (ConfigManager.ONSConfig.buttonsSize + ConfigManager.ONSConfig.safeArea); ConfigManager.ONSConfig.buttonsX ||= ONSControls._controlsCanvas.screen.width - this.ONSConfig.buttonsSize;
ConfigManager.ONSConfig.buttonsY ||= ONSControls._controlsCanvas.screen.height - (ConfigManager.ONSConfig.buttonsSize + ConfigManager.ONSConfig.safeArea); ConfigManager.ONSConfig.buttonsY ||= ONSControls._controlsCanvas.screen.height - this.ONSConfig.buttonsSize;
ConfigManager.ONSConfig.dPadSize ||= ONSControls._controlsCanvas.vh(0.36) * ConfigManager.ONSConfig.buttonsScale; ConfigManager.ONSConfig.dPadSize ||= ONSControls._controlsCanvas.vh(0.36) * ConfigManager.ONSConfig.buttonsScale;
ConfigManager.ONSConfig.dPadX ||= ConfigManager.ONSConfig.dPadSize / 2 + ConfigManager.ONSConfig.safeArea; ConfigManager.ONSConfig.dPadX ||= this.ONSConfig.dPadSize / 2;
ConfigManager.ONSConfig.dPadY ||= ONSControls._controlsCanvas.screen.height - (ConfigManager.ONSConfig.dPadSize / 2 + ConfigManager.ONSConfig.safeArea); ConfigManager.ONSConfig.dPadY ||= ONSControls._controlsCanvas.screen.height - this.ONSConfig.dPadSize / 2;
ConfigManager.ONSConfig.bumpersOffsetX ||= 16; ConfigManager.ONSConfig.bumpersOffsetX ||= 16;
ConfigManager.ONSConfig.bumpersOffsetY ||= ONSControls._controlsCanvas.vh(0.30); ConfigManager.ONSConfig.bumpersOffsetY ||= ONSControls._controlsCanvas.vh(0.30);
ConfigManager.ONSConfig.bumpersWidth ||= ONSControls._controlsCanvas.vh(0.188) * ConfigManager.ONSConfig.buttonsScale; ConfigManager.ONSConfig.bumpersWidth ||= ONSControls._controlsCanvas.vh(0.188) * ConfigManager.ONSConfig.buttonsScale;
ConfigManager.ONSConfig.bumpersHeight ||= ONSControls._controlsCanvas.vh(0.12) * ConfigManager.ONSConfig.buttonsScale; ConfigManager.ONSConfig.bumpersHeight ||= ONSControls._controlsCanvas.vh(0.12) * ConfigManager.ONSConfig.buttonsScale;
ConfigManager.ONSConfig.LBX ||= ConfigManager.ONSConfig.bumpersOffsetX + ConfigManager.ONSConfig.safeArea + ConfigManager.ONSConfig.bumpersWidth / 2; ConfigManager.ONSConfig.LBX ||= this.ONSConfig.bumpersOffsetX + this.ONSConfig.bumpersWidth / 2;
ConfigManager.ONSConfig.LBY ||= (ConfigManager.ONSConfig.bumpersOffsetY + ConfigManager.ONSConfig.safeArea + ConfigManager.ONSConfig.bumpersHeight / 2); ConfigManager.ONSConfig.LBY ||= this.ONSConfig.bumpersOffsetY + this.ONSConfig.bumpersHeight / 2;
ConfigManager.ONSConfig.RBX ||= ONSControls._controlsCanvas.screen.width - (ConfigManager.ONSConfig.safeArea + ConfigManager.ONSConfig.bumpersOffsetX + ConfigManager.ONSConfig.bumpersWidth / 2); ConfigManager.ONSConfig.RBX ||= this.ONSConfig.bumpersOffsetX + this.ONSConfig.bumpersWidth / 2;
ConfigManager.ONSConfig.RBY ||= (ConfigManager.ONSConfig.bumpersOffsetY + ConfigManager.ONSConfig.safeArea + ConfigManager.ONSConfig.bumpersHeight / 2); ConfigManager.ONSConfig.RBY ||= this.ONSConfig.bumpersOffsetY + this.ONSConfig.bumpersHeight / 2;
ConfigManager.ONSConfig.additonalSize ||= ONSControls._controlsCanvas.vh(0.06) * ConfigManager.ONSConfig.buttonsScale; ConfigManager.ONSConfig.additonalSize ||= ONSControls._controlsCanvas.vh(0.06) * ConfigManager.ONSConfig.buttonsScale;
ConfigManager.ONSConfig.showX ||= ONSControls._controlsCanvas.screen.width - (ConfigManager.ONSConfig.additonalSize / 2 + ConfigManager.ONSConfig.safeArea); ConfigManager.ONSConfig.showX ||= ONSControls._controlsCanvas.screen.width - this.ONSConfig.additonalSize / 2;
ConfigManager.ONSConfig.showY ||= ONSControls._controlsCanvas.screen.height - (ConfigManager.ONSConfig.additonalSize / 2 + ConfigManager.ONSConfig.safeArea); ConfigManager.ONSConfig.showY ||= ONSControls._controlsCanvas.screen.height - this.ONSConfig.additonalSize / 2;
//============================================================================= //=============================================================================
// * Restore defaults // * Restore defaults
//============================================================================= //=============================================================================
@ -596,23 +601,23 @@ ConfigManager.restoreDefaultConfig = function () {
this.ONSConfig.buttonsOpacity = ONSControls.options.buttonsOpacity; this.ONSConfig.buttonsOpacity = ONSControls.options.buttonsOpacity;
this.ONSConfig.safeArea = ONSControls._controlsCanvas.vh(0.032); this.ONSConfig.safeArea = ONSControls._controlsCanvas.vh(0.032);
this.ONSConfig.buttonsSize = ONSControls._controlsCanvas.vh(0.18) * this.ONSConfig.buttonsScale; this.ONSConfig.buttonsSize = ONSControls._controlsCanvas.vh(0.18) * this.ONSConfig.buttonsScale;
this.ONSConfig.buttonsX = ONSControls._controlsCanvas.screen.width - (this.ONSConfig.buttonsSize + this.ONSConfig.safeArea); this.ONSConfig.buttonsX = ONSControls._controlsCanvas.screen.width - this.ONSConfig.buttonsSize;
this.ONSConfig.buttonsY = ONSControls._controlsCanvas.screen.height - (this.ONSConfig.buttonsSize + this.ONSConfig.safeArea); this.ONSConfig.buttonsY = ONSControls._controlsCanvas.screen.height - this.ONSConfig.buttonsSize;
this.ONSConfig.dPadSize = ONSControls._controlsCanvas.vh(0.36) * this.ONSConfig.buttonsScale; this.ONSConfig.dPadSize = ONSControls._controlsCanvas.vh(0.36) * this.ONSConfig.buttonsScale;
this.ONSConfig.dPadX = this.ONSConfig.dPadSize / 2 + this.ONSConfig.safeArea; this.ONSConfig.dPadX = this.ONSConfig.dPadSize / 2;
this.ONSConfig.dPadY = ONSControls._controlsCanvas.screen.height - (this.ONSConfig.dPadSize / 2 + this.ONSConfig.safeArea); this.ONSConfig.dPadY = ONSControls._controlsCanvas.screen.height - this.ONSConfig.dPadSize / 2;
this.ONSConfig.bumpersOffsetX = 16; this.ONSConfig.bumpersOffsetX = 16;
this.ONSConfig.bumpersOffsetY = ONSControls._controlsCanvas.vh(0.30); this.ONSConfig.bumpersOffsetY = ONSControls._controlsCanvas.vh(0.30);
this.ONSConfig.bumpersWidth = ONSControls._controlsCanvas.vh(0.188) * this.ONSConfig.buttonsScale; this.ONSConfig.bumpersWidth = ONSControls._controlsCanvas.vh(0.188) * this.ONSConfig.buttonsScale;
this.ONSConfig.bumpersHeight = ONSControls._controlsCanvas.vh(0.12) * this.ONSConfig.buttonsScale; this.ONSConfig.bumpersHeight = ONSControls._controlsCanvas.vh(0.12) * this.ONSConfig.buttonsScale;
this.ONSConfig.LBX = this.ONSConfig.bumpersOffsetX + this.ONSConfig.safeArea + this.ONSConfig.bumpersWidth / 2; this.ONSConfig.LBX = this.ONSConfig.bumpersOffsetX + this.ONSConfig.bumpersWidth / 2;
this.ONSConfig.LBY = (this.ONSConfig.bumpersOffsetY + this.ONSConfig.safeArea + this.ONSConfig.bumpersHeight / 2); this.ONSConfig.LBY = this.ONSConfig.bumpersOffsetY + this.ONSConfig.bumpersHeight / 2;
this.ONSConfig.RBX = ONSControls._controlsCanvas.screen.width - (this.ONSConfig.safeArea + this.ONSConfig.bumpersOffsetX + this.ONSConfig.bumpersWidth / 2); this.ONSConfig.RBX = this.ONSConfig.bumpersOffsetX + this.ONSConfig.bumpersHeight / 2;
this.ONSConfig.RBY = (this.ONSConfig.bumpersOffsetY + this.ONSConfig.safeArea + this.ONSConfig.bumpersHeight / 2); this.ONSConfig.RBY = this.ONSConfig.bumpersOffsetY + this.ONSConfig.bumpersHeight / 2;
this.ONSConfig.additionalOffset = ONSControls._controlsCanvas.vh(0.03); this.ONSConfig.additionalOffset = ONSControls._controlsCanvas.vh(0.03);
this.ONSConfig.additonalSize = ONSControls._controlsCanvas.vh(0.06) * this.ONSConfig.buttonsScale; this.ONSConfig.additonalSize = ONSControls._controlsCanvas.vh(0.06) * this.ONSConfig.buttonsScale;
this.ONSConfig.showX = ONSControls._controlsCanvas.screen.width - (this.ONSConfig.additonalSize / 2 + this.ONSConfig.safeArea); this.ONSConfig.showX = ONSControls._controlsCanvas.screen.width - this.ONSConfig.additonalSize / 2;
this.ONSConfig.showY = ONSControls._controlsCanvas.screen.height - (this.ONSConfig.additonalSize / 2 + this.ONSConfig.safeArea); this.ONSConfig.showY = ONSControls._controlsCanvas.screen.height - this.ONSConfig.additonalSize / 2;
this.applyData(ConfigManager); this.applyData(ConfigManager);
this.ONSConfig.updateData(); this.ONSConfig.updateData();
VirtualGamepad.clearState(); VirtualGamepad.clearState();
@ -650,17 +655,17 @@ ConfigManager.ONSConfig.updateData = function() {
this.bumpersHeight = ONSControls._controlsCanvas.vh(0.12) * this.buttonsScale; this.bumpersHeight = ONSControls._controlsCanvas.vh(0.12) * this.buttonsScale;
this.additonalSize = ONSControls._controlsCanvas.vh(0.06) * this.buttonsScale; this.additonalSize = ONSControls._controlsCanvas.vh(0.06) * this.buttonsScale;
if (this.customPos === false) { if (this.customPos === false) {
this.buttonsX = ONSControls._controlsCanvas.screen.width - (this.buttonsSize + this.safeArea); this.buttonsX = ONSControls._controlsCanvas.screen.width - this.buttonsSize;
this.buttonsY = ONSControls._controlsCanvas.screen.height - (this.buttonsSize + this.safeArea); this.buttonsY = ONSControls._controlsCanvas.screen.height - this.buttonsSize;
this.dPadX = this.dPadSize / 2 + this.safeArea; this.dPadX = this.dPadSize / 2;
this.dPadY = ONSControls._controlsCanvas.screen.height - (this.dPadSize / 2 + this.safeArea); this.dPadY = ONSControls._controlsCanvas.screen.height - this.dPadSize / 2;
this.LBX = this.bumpersOffsetX + this.safeArea + this.bumpersWidth / 2; this.LBX = this.bumpersOffsetX + this.bumpersWidth / 2;
this.LBY = (this.bumpersOffsetY + this.safeArea + this.bumpersHeight / 2); this.LBY = this.bumpersOffsetY + this.bumpersHeight / 2;
this.RBX = ONSControls._controlsCanvas.screen.width - (this.safeArea + this.bumpersOffsetX + this.bumpersWidth / 2); this.RBX = ONSControls._controlsCanvas.screen.width - this.bumpersOffsetX + this.bumpersWidth / 2;
this.RBY = (this.bumpersOffsetY + this.safeArea + this.bumpersHeight / 2); this.RBY = this.bumpersOffsetY + this.bumpersHeight / 2;
this.additionalOffset = this.additionalOffset; this.additionalOffset = this.additionalOffset;
this.showX = ONSControls._controlsCanvas.screen.width - (this.additonalSize / 2 + this.safeArea); this.showX = ONSControls._controlsCanvas.screen.width - this.additonalSize / 2;
this.showY = ONSControls._controlsCanvas.screen.height - (this.additonalSize / 2 + this.safeArea); this.showY = ONSControls._controlsCanvas.screen.height - this.additonalSize / 2;
} }
ONSControls.updateButtons(); ONSControls.updateButtons();
} }