Adding another alert webpage

Quick question,

I would love another alert web page
ie.
http://localhost:25000/alerts
http://localhost:25000/alerts2

Basically so I can position them in 2 different spots on my OBS for various effects. Basically I found the “alert” functionality in customCommands.js but was trying to figure out how to add a 2nd “website” without going into the actual Java source code.

I see there was a feature request a while back for multiple Browser sources, but it seems nothing came from that.

So any chance of being able to do this? (Besides multiple instances of PhantomBot)?

Cheers
Talung

In short, the Java code would require changes. Only specific directories are served with specific purposes. You would need to change HTTPServerCommon.java and add an alerts2 handler where alerts is handled.

Then you would need to modify PanelSocketServer.java (or NewPanelSocketServer.java, depending on your configuration for PhantomBot) to produce a secondary signal, i.e. alert_image2.

Then that has to be intercepted in the newly created web/alerts2/js/index.js file (and the other related files there).

Then the custom command handler, scripts/commands/customCommands.js would need to somehow drive the decision on which signal to call - alerts or alerts2.

Overall, quite a few changes.

Disclaimer: I am thinking of this from the top of my head, there may be more changes.

Thanks,

I found most of those spots going through github and tracing it around. Seems I will need to fork and setup a dev environment for Java and do the changes.

Pity, really didn’t want to go that far.

Thanks.

It will 100% work if you just copy-paste the alert webpage into a second folder (alerts2) and then just modify alerts2/js/index.js to quick find/replace all references of .alert_image to .alert_image2 and all references of .audio_panel_hook to .audio_panel_hook2

Also edit alerts2/index.html to fix the load path for the js script (L69)

Then in your custom bot script, just do this to trigger it

// For image, remember that you can pair audio with a gif by
// having a .mp3 file with the same name
// For example: hello.gif and hello.mp3
var jsonObject = new Packages.org.json.JSONStringer();

// imageInfo can be just the name of the image, such as hello.gif
// You can decipher the alerts js file to learn about the advanced usage
jsonObject.object().key("alert_image2").value(imageInfo).endObject();
$.panelsocketserver.sendToAll(jsonObject.toString());
// For audio
var jsonObject = new Packages.org.json.JSONStringer();

// audioHook is just the name of the audio file without extension, such as hello
jsonObject.object().key("audio_panel_hook2").value(audioHook).endObject();
$.panelsocketserver.sendToAll(jsonObject.toString());

Store your image/audio files in the same place as for regular alerts (/config/gif-alerts and /config/audio-hooks)

NOTE: When adding the browser source you will have to explicitly specify in the URL to load index.html from the new alerts2 folder (eg. http://localhost:25000/alerts2/index.html), it won’t auto-assume that for you without a Java edit

Oooh thanks… Gonna have to try this.

So following your recommendations, I have this working in a fashion.

I can use this:

!alert2 bugs.mp4,12

and it will fire off the alert2 in new screen with timer etc. no problem. However, seem to have issues getting it to fire off another command. ie. I want a command !bugs and that to fire it off similiar to my other alerts.

!gifbugs --> (alert bugs.mp4,12,1,font-family:‘Candal’;font-size:28px;color:white;,(echo))

My quickCommands.js module which is setup uses this to make the commands. Maybe I am missing something.

$.bind(‘initReady’, function() {
if ($.bot.isModuleEnabled(’./custom/quickCommands.js’)) {
$.registerChatCommand(’./custom/quickCommands.js’, ‘pornstache’, 1);
$.registerChatCommand(’./custom/quickCommands.js’, ‘alert2’, 1);
$.registerChatCommand(’./custom/quickCommands.js’, ‘alert3’, 1);
}

and yup, added 2 alerts using same method.

Can you describe the issue the command has and do you have any related errors in your bot logs or browser console?

Sure.

My normal “alert” commands are like this:

!gifbugs --> (alert bugs.mp4,12,1,font-family:‘Candal’;font-size:28px;color:white;,(echo))

Now if I decide to send to to alert2 by simply replacing “alert” with “alert2” is just turns the whole thing into a “bot reply”.

Seems like the only way is to use lots of alias’s to call the various commands. Issue with this, points, level of user etc.
eg. I can make the entire “alert2” subs only for ALL alerts, and won’t be able to assign point usage etc. This was actually the reason to use PhantomBot for this instead of just writing my own html page like I have for other overlays.

Looks like if I want it to integrate properly, will need to go back to Java and modify the customCommands.js file to add it in.

It is usable atm, so that is great, just limited use. Will just need to work around that issue if I want to avoid forking etc.

You could try !addcom bugs (command alert2 bugs.mp4,12,1,font-family:‘Candal’;font-size:28px;color:white;,(echo)) to pass it to the custom alert2 command, then all the usual permcom and pricecom stuff should work

Sorry for late reply… was streaming and then sleeping.

Didn’t know “command” was a thing, but gives same result, just echoing to panel. That is if I add it through the website. Using the “addcom” method doesn’t work.

[09-07-2019 @ 03:25:27.365 GMT] talung: !addcom giftest (command alert2 bugs.mp4,12,1,font-family:‘Candal’;font-size:28px;color:white;,(echo))
[09-07-2019 @ 03:25:27.378 GMT] [ERROR] [init.js:317] Error with Event Handler [command] Script [./commands/customCommands.js] Stacktrace [customCommands.js:862 > init.js:315 > init.js:510] Exception [TypeError: Cannot read property “1” from null]

Using an alias does fulfill my basic needs atm. Will have to look at the Java differences required and maybe setup something there that will add it in every release.

Thanks for your help

I figured it out

git blame IO

The regex for (command) was set to only accept A-Z a-z 0-9 and _ even though the implementation is setup to do what you want

cool. Is that something the team would need to change in the source?

If so would probably need to wait for next release.

When I get he time I will still try setup the Java changes anyway. I am sure I am not the only person that wants multiple alert screens.

The fix is in customCommands.js, which anyone can change if they want without needing to do a build. Just gotta learn RegEx

I see it there.

Will go through the code later and see if I can tweak it better. Finding time is always the biggest issue.

Cheers again :slight_smile: