Custom Prompt for changing options #243

Araxeus · 2021-04-28T00:08:51Z

Implements Custom Electron Prompt

I pretty much made this package to easily set different options in youtube-music

There are currently 4 available custom types:

Input: Just a general text input field.
- Currently used here for setting proxy option (input type="url") should close How to set up a proxy? #189

Keybind: Allow capturing single or multiple keybinds (Electron Accelerator format)

Currently used to set global hotkeys for song controls in shortcuts plugin,
will probably fix What Are Global Media Key / ShortCuts ? I Am Trying CTRL + SHIFT + SPACE But Nothing Happens. #235 , fix Autohotkey media buttons don't work #105 , fix Keyboard Media Keys Do Not Work #143, fix Add support for all Youtube Music shortcuts #106 by disabling auto mediakey override and making it easy to set custom global hotkeys
also should fix Integrate with the System Media Transport Controls #142 because disabling auto mediakey override enables native media control
|
Originally the prompt code was quite long and messy because the shortcuts keybinds were arrays with anonymous objects
So, the arrays were changed to be object with properties, This allow easy access and validation.

(The old existing keybind arrays are auto updated to the new object format)

// new config format in config.json
// format = `action: accelerator`
global {
    "playPause": "Shift+Enter",
    "next": "Shift+Ctrl+Right"
}

This allows changing the options in one line instead of 2 functions + 4 loops 😅

youtube-music/plugins/shortcuts/menu.js

Lines 59 to 61 in 5418ef7

    
           for (const keybindObject of output) { 
        
           	options.global[keybindObject.value] = keybindObject.accelerator; 
        
           }

Could add more global shortcuts to the same prompt / make another prompt for local shortcuts
Also used for setting custom global hotkeys in precise-volume

Counter: Similar to input, but accept only numerical values and has [+] and [-] Buttons for ease of use
- Used for setting custom volume steps in precise-volume
Select: Create a dropdown select menu, doesn't seems to have use in this app since menu radio buttons exist

etc

Creating a prompt counts as a browser-window-created event, So:
- using win.once("did-finish-load") instead of win.on in index.js fixes listener registering on every window created
- require("electron-debug")({showDevTools: false}) remove devTools on new prompt in dev mode

Prompt with customTitlebar needs testing on macOS, I disabled it for that platform for now
--Click to view code-

youtube-music/menu.js

Lines 326 to 335 in 6d44a57

    
           //TODO: custom bar on prompt need testing on macOS 
        
           if(!is.macOS()) { 
        
           	Object.assign(options, { 
        
           		frame: false, 
        
           		customScript: path.join(__dirname, "providers", "prompt", "customTitlebar.js"), 
        
           		enableRemoteModule: true, 
        
           		height: 200, 
        
           		width: 450, 
        
           	}); 
        
           }

also use it to set proxy option

…rompt

Precise-Volume Global Shortcuts Prompt

th-ch

Left a few comments after a first review, looks promising 🤩
nit: when the prompt window appears, the background is white, and it only gets black in a second time (and the change is noticeable), is it expected?

menu.js

th-ch · 2021-05-09T20:15:41Z

menu.js

+	let options = {
+		title: 'Set Proxy',
+		label: 'Enter Proxy Address: (leave empty to disable)',
+		value: config.get("options.proxy") || example,


Idea of feature for the prompt plugin: the ability to have a placeholder (would be better suited for example instead of putting it as value and checking later that value !== example)

there is already a placeholder which is the value field

instead of putting it as value and checking later that value !== example

Are you talking about implementing this exact logic in custom-electron-prompt ?

I could make an boolean option placeholder which will mean "return null if output=options.value"
but it seems kinda unnecessary..

I think it might be best to let whoever implements the prompt decide what to do with the output, since there could be many different intentions when using the prompt,

Yes, idea was to add a implement the placeholder logic/field in custom-electron-prompt! (main pro of a placeholder is to avoid having a fake value to remove when filling the field, contrary to a default value - here, it feels we have a placeholder used a default value 🙃)
Not a big deal though, does not block merging - just an improvement idea for the custom-prompt package :)

355f611 changed the input field "placeholder" attribute to the previous example as you suggested
(didn't need to change custom-electron-prompt itself)

I'm not sure its better though, since you can't copy paste or edit that text, and it disappears when typing. which can makes it harder for people that don't know the format

menu.js

config/defaults.js

plugins/precise-volume/menu.js

th-ch

For the prompt-custom-titlebar, looks ok to keep it all the time (but disabled for MacOS to avoid issues) but it should be moved to the providers folder in that case! (so that no in-app-menu code is executed if the plugin is disabled)

th-ch · 2021-05-11T21:03:30Z

plugins/shortcuts/back.js

-			console.warn("Invalid action", action);
-			return;
+/** Update options to new format if they are still an array (old format) */
+function updateOptions(options) {


This looks like a one-shot operation that can be done with a store migration (there are examples in in config/store.js)

I moved the code to store migration in 002081b
Is it alright this way? should the version be higher?

(prompt-custom-titlebar.js was already moved to providers folder before 😝)

th-ch · 2021-05-11T21:09:23Z

menu.js

+	let options = {
+		title: 'Set Proxy',
+		label: 'Enter Proxy Address: (leave empty to disable)',
+		value: config.get("options.proxy") || example,


Yes, idea was to add a implement the placeholder logic/field in custom-electron-prompt! (main pro of a placeholder is to avoid having a fake value to remove when filling the field, contrary to a default value - here, it feels we have a placeholder used a default value 🙃)
Not a big deal though, does not block merging - just an improvement idea for the custom-prompt package :)

th-ch

Looks good, thanks for the contribution! Just need to fix the merge conflict and it should be good to merge! ✅

th-ch · 2021-07-19T21:09:43Z

I am getting TypeError: Cannot set property 'previous' of undefined in shortcuts/menu.js:45 when trying to register global song controls, not sure if it's expected? (it seems the migration does not add the global/local keys in config when they are not present)

Araxeus · 2021-07-20T08:07:24Z

I am getting TypeError: Cannot set property 'previous' of undefined in shortcuts/menu.js:45 when trying to register global song controls, not sure if it's expected? (it seems the migration does not add the global/local keys in config when they are not present)

Indeed the object needs to be created before setting its properties 😅
should be fixed now

Araxeus added 8 commits April 28, 2021 02:41

add custom-electron-prompt

e4eed2e

also use it to set proxy option

disable reload of plugins on window created

a229ba9

add keybind changer v1

964974c

fix typo

e456035

update shortcuts config

49e51de

lint

54cbe3f

restore original menu lint

d0d4ada

refactor registerAllShortcuts

ec981ac

Araxeus marked this pull request as draft May 2, 2021 21:20

Araxeus added 2 commits May 4, 2021 23:48

Merge remote-tracking branch 'upstream/master' into custom-electron-p…

ebaa018

…rompt

Volume Steps Prompt

79acf6c

Precise-Volume Global Shortcuts Prompt

Araxeus marked this pull request as ready for review May 4, 2021 21:43

lint

22c5ea5

Araxeus changed the title ~~Implement custom-electron-prompt~~ Custom Prompt for changing options May 4, 2021

Araxeus and others added 8 commits May 5, 2021 01:47

proxy url check

34a4e6b

Update yarn.lock

b97a86f

fix electron dependency

db8d946

format proxy example

98c00f7

update prompt version and lint

5cee331

massive prompt speed boost with v1.1.0

834f867

fix prompt width

6b147b0

Merge branch 'master' into custom-electron-prompt

5418ef7

th-ch reviewed May 9, 2021

View reviewed changes

Araxeus added 5 commits May 10, 2021 00:40

use spread operator + async await

f910593

globalize promptOptions

36317c9

lint

0eca303

destructure keybind output

580caef

lint

e43c01d

th-ch reviewed May 11, 2021

View reviewed changes

use store migration

002081b

Araxeus and others added 3 commits May 13, 2021 07:08

use placeholder proxy example

355f611

fix empty string input validation in setProxy

b2c2098

Merge branch 'master' into custom-electron-prompt

664be51

th-ch approved these changes Jul 19, 2021

View reviewed changes

th-ch mentioned this pull request Jul 19, 2021

unlock unsupported regions #361

Closed

Araxeus added 2 commits July 20, 2021 10:57

create options.global if needed

52a4608

Merge branch 'master' into custom-electron-prompt

a49817f

Merge branch 'master' into custom-electron-prompt

65eaaec

Araxeus mentioned this pull request Sep 25, 2021

Media Play/Pause Key not working #415

Closed

Merge branch 'master' into custom-electron-prompt

1cd4f53

th-ch merged commit 362da8c into th-ch:master Oct 24, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Custom Prompt for changing options #243

Custom Prompt for changing options #243

Araxeus commented Apr 28, 2021 •

edited

Loading

th-ch left a comment

th-ch May 9, 2021

Araxeus May 9, 2021 •

edited

Loading

th-ch May 11, 2021

Araxeus May 13, 2021

th-ch left a comment

th-ch May 11, 2021 •

edited

Loading

Araxeus May 11, 2021 •

edited

Loading

th-ch May 11, 2021

th-ch left a comment

th-ch commented Jul 19, 2021 •

edited

Loading

Araxeus commented Jul 20, 2021

	for (const keybindObject of output) {
	options.global[keybindObject.value] = keybindObject.accelerator;
	}

	//TODO: custom bar on prompt need testing on macOS
	if(!is.macOS()) {
	Object.assign(options, {
	frame: false,
	customScript: path.join(__dirname, "providers", "prompt", "customTitlebar.js"),
	enableRemoteModule: true,
	height: 200,
	width: 450,
	});
	}

Custom Prompt for changing options #243

Custom Prompt for changing options #243

Conversation

Araxeus commented Apr 28, 2021 • edited Loading

Implements Custom Electron Prompt

There are currently 4 available custom types:

etc

th-ch left a comment

Choose a reason for hiding this comment

th-ch May 9, 2021

Choose a reason for hiding this comment

Araxeus May 9, 2021 • edited Loading

Choose a reason for hiding this comment

th-ch May 11, 2021

Choose a reason for hiding this comment

Araxeus May 13, 2021

Choose a reason for hiding this comment

th-ch left a comment

Choose a reason for hiding this comment

th-ch May 11, 2021 • edited Loading

Choose a reason for hiding this comment

Araxeus May 11, 2021 • edited Loading

Choose a reason for hiding this comment

th-ch May 11, 2021

Choose a reason for hiding this comment

th-ch left a comment

Choose a reason for hiding this comment

th-ch commented Jul 19, 2021 • edited Loading

Araxeus commented Jul 20, 2021

Araxeus commented Apr 28, 2021 •

edited

Loading

Araxeus May 9, 2021 •

edited

Loading

th-ch May 11, 2021 •

edited

Loading

Araxeus May 11, 2021 •

edited

Loading

th-ch commented Jul 19, 2021 •

edited

Loading