From d0663dc1f06756dae3c81c3e4531c04b2109a4ab Mon Sep 17 00:00:00 2001 From: Dimava Date: Wed, 22 Jul 2020 17:08:26 +0300 Subject: [PATCH 01/17] add debug settings --- src/js/core/config.js | 2 +- src/js/core/config.local.js | 120 ++++++++++++------------- src/js/profile/application_settings.js | 21 ++++- src/js/profile/setting_types.js | 4 + translations/base-en.yaml | 1 + 5 files changed, 86 insertions(+), 62 deletions(-) diff --git a/src/js/core/config.js b/src/js/core/config.js index 235904d9..14443925 100644 --- a/src/js/core/config.js +++ b/src/js/core/config.js @@ -93,7 +93,7 @@ export const globalConfig = { }, rendering: {}, - debug: require("./config.local").default, + debug: G_IS_DEV ? require("./config.local").default : {}, // Secret vars info: { diff --git a/src/js/core/config.local.js b/src/js/core/config.local.js index 7bf9a002..e29d2192 100644 --- a/src/js/core/config.local.js +++ b/src/js/core/config.local.js @@ -2,98 +2,98 @@ export default { // You can set any debug options here! /* dev:start */ // ----------------------------------------------------------------------------------- - // Quickly enters the game and skips the main menu - good for fast iterating - // fastGameEnter: true, + _fastGameEnter: "Quickly enters the game and skips the main menu - good for fast iterating", + fastGameEnter: false, // ----------------------------------------------------------------------------------- - // Skips any delays like transitions between states and such - // noArtificialDelays: true, + _noArtificialDelays: "Skips any delays like transitions between states and such", + noArtificialDelays: false, // ----------------------------------------------------------------------------------- - // Disables writing of savegames, useful for testing the same savegame over and over - // disableSavegameWrite: true, + _disableSavegameWrite: "Disables writing of savegames, useful for testing the same savegame over and over", + disableSavegameWrite: false, // ----------------------------------------------------------------------------------- - // Shows bounds of all entities - // showEntityBounds: true, + _showEntityBounds: "Shows bounds of all entities", + showEntityBounds: false, // ----------------------------------------------------------------------------------- - // Shows arrows for every ejector / acceptor - // showAcceptorEjectors: true, + _showAcceptorEjectors: "Shows arrows for every ejector / acceptor", + showAcceptorEjectors: false, // ----------------------------------------------------------------------------------- - // Disables the music (Overrides any setting, can cause weird behaviour) - // disableMusic: true, + _disableMusic: "Disables the music (Overrides any setting, can cause weird behaviour)", + disableMusic: false, // ----------------------------------------------------------------------------------- - // Do not render static map entities (=most buildings) - // doNotRenderStatics: true, + _doNotRenderStatics: "Do not render static map entities (=most buildings)", + doNotRenderStatics: false, // ----------------------------------------------------------------------------------- - // Allow to zoom freely without limits - // disableZoomLimits: true, + _disableZoomLimits: "Allow to zoom freely without limits", + disableZoomLimits: false, // ----------------------------------------------------------------------------------- - // Shows a border arround every chunk - // showChunkBorders: true, + _showChunkBorders: "Shows a border arround every chunk", + showChunkBorders: false, // ----------------------------------------------------------------------------------- - // All rewards can be unlocked by passing just 1 of any shape - // rewardsInstant: true, + _rewardsInstant: "All rewards can be unlocked by passing just 1 of any shape", + rewardsInstant: false, // ----------------------------------------------------------------------------------- - // Unlocks all buildings - // allBuildingsUnlocked: true, + _allBuildingsUnlocked: "Unlocks all buildings", + allBuildingsUnlocked: false, // ----------------------------------------------------------------------------------- - // Disables cost of blueprints - // blueprintsNoCost: true, + _blueprintsNoCost: "Disables cost of blueprints", + blueprintsNoCost: false, // ----------------------------------------------------------------------------------- - // Disables cost of upgrades - // upgradesNoCost: true, + _upgradesNoCost: "Disables cost of upgrades", + upgradesNoCost: false, // ----------------------------------------------------------------------------------- - // Disables the dialog when completing a level - // disableUnlockDialog: true, + _disableUnlockDialog: "Disables the dialog when completing a level", + disableUnlockDialog: false, // ----------------------------------------------------------------------------------- - // Disables the simulation - This effectively pauses the game. - // disableLogicTicks: true, + _disableLogicTicks: "Disables the simulation - This effectively pauses the game.", + disableLogicTicks: false, // ----------------------------------------------------------------------------------- - // Test the rendering if everything is clipped out properly - // testClipping: true, + _testClipping: "Test the rendering if everything is clipped out properly", + testClipping: false, // ----------------------------------------------------------------------------------- // Allows to render slower, useful for recording at half speed to avoid stuttering // framePausesBetweenTicks: 1, // ----------------------------------------------------------------------------------- - // Replace all translations with emojis to see which texts are translateable - // testTranslations: true, + _testTranslations: "Replace all translations with emojis to see which texts are translateable", + testTranslations: false, // ----------------------------------------------------------------------------------- - // Enables an inspector which shows information about the entity below the curosr - // enableEntityInspector: true, + _enableEntityInspector: "Enables an inspector which shows information about the entity below the curosr", + enableEntityInspector: false, // ----------------------------------------------------------------------------------- - // Enables ads in the local build (normally they are deactivated there) - // testAds: true, + _testAds: "Enables ads in the local build (normally they are deactivated there)", + testAds: false, // ----------------------------------------------------------------------------------- - // Disables the automatic switch to an overview when zooming out - // disableMapOverview: true, + _disableMapOverview: "Disables the automatic switch to an overview when zooming out", + disableMapOverview: false, // ----------------------------------------------------------------------------------- - // Disables the notification when there are new entries in the changelog since last played - // disableUpgradeNotification: true, + _disableUpgradeNotification: "Disables the notification when there are new entries in the changelog since last played", + disableUpgradeNotification: false, // ----------------------------------------------------------------------------------- - // Makes belts almost infinitely fast - // instantBelts: true, + _instantBelts: "Makes belts almost infinitely fast", + instantBelts: false, // ----------------------------------------------------------------------------------- - // Makes item processors almost infinitely fast - // instantProcessors: true, + _instantProcessors: "Makes item processors almost infinitely fast", + instantProcessors: false, // ----------------------------------------------------------------------------------- - // Makes miners almost infinitely fast - // instantMiners: true, + _instantMiners: "Makes miners almost infinitely fast", + instantMiners: false, // ----------------------------------------------------------------------------------- - // When using fastGameEnter, controls whether a new game is started or the last one is resumed - // resumeGameOnFastEnter: true, + _resumeGameOnFastEnter: "When using fastGameEnter, controls whether a new game is started or the last one is resumed", + resumeGameOnFastEnter: false, // ----------------------------------------------------------------------------------- - // Special option used to render the trailer - // renderForTrailer: true, + _renderForTrailer: "Special option used to render the trailer", + renderForTrailer: false, // ----------------------------------------------------------------------------------- - // Whether to render changes - // renderChanges: true, + _renderChanges: "Whether to render changes", + renderChanges: false, // ----------------------------------------------------------------------------------- - // Whether to render belt paths - // renderBeltPaths: true, + _renderBeltPaths: "Whether to render belt paths", + renderBeltPaths: false, // ----------------------------------------------------------------------------------- - // Whether to check belt paths - // checkBeltPaths: true, + _checkBeltPaths: "Whether to check belt paths", + checkBeltPaths: false, // ----------------------------------------------------------------------------------- - // Whether to items / s instead of items / m in stats - // detailedStatistics: true, + _detailedStatistics: "Whether to items / s instead of items / m in stats", + detailedStatistics: false, // ----------------------------------------------------------------------------------- /* dev:end */ }; diff --git a/src/js/profile/application_settings.js b/src/js/profile/application_settings.js index 50c34e0e..fda769d6 100644 --- a/src/js/profile/application_settings.js +++ b/src/js/profile/application_settings.js @@ -10,6 +10,7 @@ import { THEMES, THEME, applyGameTheme } from "../game/theme"; import { IS_DEMO } from "../core/config"; import { T } from "../translations"; import { LANGUAGES } from "../languages"; +import { globalConfig, IS_DEBUG } from "../core/config"; const logger = createLogger("application_settings"); @@ -20,6 +21,7 @@ export const enumCategories = { general: "general", userInterface: "userInterface", advanced: "advanced", + debug: "debug", }; export const uiScales = [ @@ -260,6 +262,21 @@ export const allApplicationSettings = [ new BoolSetting("rotationByBuilding", enumCategories.advanced, (app, value) => {}), ]; +if (IS_DEBUG) { + for (let k in globalConfig.debug) { + if (k.startsWith('_')) continue; + const setting = new BoolSetting(`debug_${ k }`, enumCategories.debug, (app, value) => { + globalConfig.debug[k] = value; + }); + setting.validate = () => true; + T.settings.labels[`debug_${ k }`] = { + title: k.replace(/(?!^)([A-Z])/g, " $1"), + description: globalConfig.debug[`_${ k }`], + }; + allApplicationSettings.push(setting); + } +} + export function getApplicationSettingById(id) { return allApplicationSettings.find(setting => setting.id === id); } @@ -332,7 +349,9 @@ export class ApplicationSettings extends ReadWriteProxy { * @param {string} key */ getSetting(key) { - assert(this.getAllSettings().hasOwnProperty(key), "Setting not known: " + key); + if (!key.startsWith('debug_')) { + assert(this.getAllSettings().hasOwnProperty(key), "Setting not known: " + key); + } return this.getAllSettings()[key]; } diff --git a/src/js/profile/setting_types.js b/src/js/profile/setting_types.js index 9e361f66..f26c509f 100644 --- a/src/js/profile/setting_types.js +++ b/src/js/profile/setting_types.js @@ -185,6 +185,10 @@ export class BoolSetting extends BaseSetting { } getHtml() { + if (!T.settings.labels[this.id].description) { + let a = T; + let b = a; + } return `
${this.enabled ? "" : `${T.demo.settingNotAvailable}`} diff --git a/translations/base-en.yaml b/translations/base-en.yaml index 38196d52..360d1ac8 100644 --- a/translations/base-en.yaml +++ b/translations/base-en.yaml @@ -650,6 +650,7 @@ settings: general: General userInterface: User Interface advanced: Advanced + debug: Debug versionBadges: dev: Development From f0cf3a2fda9c789c02863f150e0b7327c204a038 Mon Sep 17 00:00:00 2001 From: Exund Date: Mon, 7 Sep 2020 21:42:32 +0200 Subject: [PATCH 02/17] Keybindings as Setting state + webpack/gulp watch --- gulp/gulpfile.js | 4 +- gulp/webpack.config.js | 3 + src/css/states/keybindings.scss | 151 ++++++++++++++++++++++++- src/js/application.js | 2 +- src/js/core/textual_game_state.js | 18 ++- src/js/profile/application_settings.js | 11 +- src/js/states/keybindings.js | 51 ++++++--- src/js/states/settings.js | 14 ++- translations/base-en.yaml | 1 + 9 files changed, 225 insertions(+), 30 deletions(-) diff --git a/gulp/gulpfile.js b/gulp/gulpfile.js index 0db3f729..89b85db7 100644 --- a/gulp/gulpfile.js +++ b/gulp/gulpfile.js @@ -163,7 +163,7 @@ function serve({ standalone }) { }); // Watch .scss files, those trigger a css rebuild - gulp.watch(["../src/**/*.scss"], gulp.series("css.dev")); + gulp.watch(["../src/**/*.scss"], { usePolling: true }, gulp.series("css.dev")); // Watch .html files, those trigger a html rebuild gulp.watch("../src/**/*.html", gulp.series(standalone ? "html.standalone-dev" : "html.dev")); @@ -172,7 +172,7 @@ function serve({ standalone }) { // gulp.watch(["../res_raw/sounds/**/*.mp3", "../res_raw/sounds/**/*.wav"], gulp.series("sounds.dev")); // Watch translations - gulp.watch("../translations/**/*.yaml", gulp.series("translations.convertToJson")); + gulp.watch("../translations/**/*.yaml", { usePolling: true }, gulp.series("translations.convertToJson")); gulp.watch( ["../res_raw/sounds/sfx/*.mp3", "../res_raw/sounds/sfx/*.wav"], diff --git a/gulp/webpack.config.js b/gulp/webpack.config.js index 6e1d7388..42255b7f 100644 --- a/gulp/webpack.config.js +++ b/gulp/webpack.config.js @@ -14,6 +14,9 @@ module.exports = ({ watch = false, standalone = false }) => { "bundle.js": [path.resolve(__dirname, "../src/js/main.js")], }, watch, + watchOptions: { + poll: 1000 + }, node: { fs: "empty", }, diff --git a/src/css/states/keybindings.scss b/src/css/states/keybindings.scss index cf211403..49aecabb 100644 --- a/src/css/states/keybindings.scss +++ b/src/css/states/keybindings.scss @@ -1,5 +1,12 @@ -#state_KeybindingsState { +#state_SettingsState { + + $colorCategoryButton: #eee; + $colorCategoryButtonSelected: #5f748b; + .content { + display: flex; + overflow-y: scroll; + .topEntries { display: grid; grid-template-columns: 1fr auto; @@ -50,6 +57,148 @@ } } } + + .categoryContainer { + width: 100%; + + .category { + display: none; + + &.active { + display: block; + } + + .setting { + @include S(padding, 10px); + background: #eeeff5; + @include S(border-radius, $globalBorderRadius); + @include S(margin-bottom, 5px); + + label { + text-transform: uppercase; + @include Text; + } + + .desc { + @include S(margin-top, 5px); + @include SuperSmallText; + color: #aaadb2; + } + + > .row { + display: grid; + align-items: center; + grid-template-columns: 1fr auto; + } + + &.disabled { + // opacity: 0.3; + pointer-events: none; + * { + pointer-events: none !important; + cursor: default !important; + } + position: relative; + .standaloneOnlyHint { + @include PlainText; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + pointer-events: all; + display: flex; + align-items: center; + justify-content: center; + background: rgba(#fff, 0.5); + text-transform: uppercase; + color: $colorRedBright; + } + } + + .value.enum { + background: #fff; + @include PlainText; + display: flex; + align-items: flex-start; + pointer-events: all; + cursor: pointer; + justify-content: center; + @include S(min-width, 100px); + @include S(border-radius, $globalBorderRadius); + @include S(padding, 4px); + @include S(padding-right, 15px); + + background: #fff uiResource("icons/enum_selector.png") calc(100% - #{D(5px)}) + calc(50% + #{D(1px)}) / #{D(15px)} no-repeat; + + transition: background-color 0.12s ease-in-out; + &:hover { + background-color: #fafafa; + } + } + } + } + } + + .sidebar { + display: flex; + flex-direction: column; + @include S(min-width, 210px); + @include S(max-width, 320px); + width: 30%; + height: 100%; + position: sticky; + top: 0; + @include S(margin-left, 20px); + @include S(margin-right, 32px); + + .other { + margin-top: auto; + } + + button { + @include S(margin-top, 4px); + width: calc(100% - #{D(20px)}); + text-align: start; + + &::after { + content: unset; + } + } + + button.categoryButton, + button.about { + background-color: $colorCategoryButton; + color: #777a7f; + + &.active { + background-color: $colorCategoryButtonSelected; + color: #fff; + + &:hover { + opacity: 1; + } + } + + &.pressed { + transform: none !important; + } + } + + .versionbar { + @include S(margin-top, 20px); + @include SuperSmallText; + display: grid; + align-items: center; + grid-template-columns: 1fr auto; + .buildVersion { + display: flex; + flex-direction: column; + color: #aaadaf; + } + } + } } @include DarkThemeOverride { diff --git a/src/js/application.js b/src/js/application.js index e5e22b60..369cc032 100644 --- a/src/js/application.js +++ b/src/js/application.js @@ -145,7 +145,7 @@ export class Application { MobileWarningState, MainMenuState, InGameState, - SettingsState, + //SettingsState, KeybindingsState, AboutState, ChangelogState, diff --git a/src/js/core/textual_game_state.js b/src/js/core/textual_game_state.js index 52a1f946..d60f2201 100644 --- a/src/js/core/textual_game_state.js +++ b/src/js/core/textual_game_state.js @@ -71,7 +71,23 @@ export class TextualGameState extends GameState { backToStatePayload: this.backToStatePayload, }, }); - } + } + + /** + * Goes to a new state, telling him to go back to this state later + * @param {string} stateId + */ + switchToState(stateId) { + // debugger; + this.moveToState( + stateId, + { + backToStateId: this.backToStateId, + backToStatePayload: this.backToStatePayload, + }, + true + ); + } /** * Removes all click detectors, except the one on the back button. Useful when regenerating diff --git a/src/js/profile/application_settings.js b/src/js/profile/application_settings.js index bbbcb91d..a53d3358 100644 --- a/src/js/profile/application_settings.js +++ b/src/js/profile/application_settings.js @@ -23,6 +23,7 @@ export const enumCategories = { performance: "performance", advanced: "advanced", debug: "debug", + keybindings: "keybindings", }; export const uiScales = [ @@ -297,14 +298,14 @@ export const allApplicationSettings = [ if (IS_DEBUG) { for (let k in globalConfig.debug) { - if (k.startsWith('_')) continue; - const setting = new BoolSetting(`debug_${ k }`, enumCategories.debug, (app, value) => { + if (k.startsWith("_")) continue; + const setting = new BoolSetting(`debug_${k}`, enumCategories.debug, (app, value) => { globalConfig.debug[k] = value; }); setting.validate = () => true; - T.settings.labels[`debug_${ k }`] = { + T.settings.labels[`debug_${k}`] = { title: k.replace(/(?!^)([A-Z])/g, " $1"), - description: globalConfig.debug[`_${ k }`], + description: globalConfig.debug[`_${k}`], }; allApplicationSettings.push(setting); } @@ -391,7 +392,7 @@ export class ApplicationSettings extends ReadWriteProxy { * @param {string} key */ getSetting(key) { - if (!key.startsWith('debug_')) { + if (!key.startsWith("debug_")) { assert(this.getAllSettings().hasOwnProperty(key), "Setting not known: " + key); } return this.getAllSettings()[key]; diff --git a/src/js/states/keybindings.js b/src/js/states/keybindings.js index b68626c7..d2ba27c9 100644 --- a/src/js/states/keybindings.js +++ b/src/js/states/keybindings.js @@ -4,39 +4,58 @@ import { T } from "../translations"; import { KEYMAPPINGS, getStringForKeyCode } from "../game/key_action_mapper"; import { Dialog } from "../core/modal_dialog_elements"; import { IS_DEMO } from "../core/config"; +import { SettingsState } from "./settings"; -export class KeybindingsState extends TextualGameState { - constructor() { - super("KeybindingsState"); - } +export class KeybindingsState extends SettingsState { + // constructor() { + // super(); + // super("KeybindingsState"); + // this.settingsState = settingsState; + // } - getStateHeaderTitle() { - return T.keybindings.title; - } + // getStateHeaderTitle() { + // return T.keybindings.title; + // } getMainContentHTML() { return ` +