Adventures in broadcaster: attachToComponentMouseEvents

Lindon

so trying to set up a broadcaster on an AudioWaveform - to capture mouse up events (basically when a sound gets dropped on it)

but: the template I'm getting back out of HISE is this:

bc.attachToComponentMouseEvents(var componentIds, function()
{	 
}Level, var optionalMetadata)

which doesn't look anything like the version in the documentation...

Broadcaster.attachToComponentMouseEvents(var componentIds, var callbackLevel)

Can anyone shed any light on how to set this up properly...??

d.healey

@Lindon This thread should answer the question - https://forum.hise.audio/topic/6467/broadcaster-error

Christoph Hart

bc.attachToComponentMouseEvents(var componentIds, function()
{	 
}Level, var optionalMetadata)

Yeah, that's just the autocomplete window failing miserably at inserting a function snippet.

Broadcaster.attachToComponentMouseEvents(var componentIds, var callbackLevel)

This is the correct (as in not garbled) version, but it's outdated so you need to pass in another string after the callback level (that's what optionalMetadata is suggesting).

Lindon

@d-healey

Okay - thank you got this working so far ,....BUT....

Content.makeFrontInterface(600, 600);

const var AudioWaveform1 = Content.getComponent("AudioWaveform1");

const var AudioLoopPlayer1 = Synth.getChildSynth("Audio Loop Player1");

const var bc = Engine.createBroadcaster({
  "id": "TBL Watcher",
  "args": ["component", "event"]
});

bc.attachToComponentMouseEvents(AudioWaveform1, "All Callbacks", "Mouse Listener for AudioLoopPlayer1");

bc.addListener("MouseUpFunction", "listens for the drop and cleans the name",
function(component, event)
{   	
    if (event.mouseUp )
    {
        Console.print("Mouse UP!");
    }
});

now I need the event for dropping an audio file on the audio player..it doesnt seem to be one of the mouse events, anyone havve any ideas?

When i drop an audio file on the audo file player I dont get the mouse up event.

Christoph Hart

Do you want it to react only on drop events or if you load a new file (using the right click dialog or programatically / after a preset load)?

There‘s another event source that watches complex data types which might be better for your use case.

Lindon

@Lindon ok well I get an event happening, which looks like this:

 {
  "clicked": false,
  "doubleClick": false,
  "rightClick": false,
  "mouseUp": false,
  "mouseDownX": 196,
  "mouseDownY": 173,
  "x": 196,
  "y": 173,
  "shiftDown": false,
  "cmdDown": false,
  "altDown": false,
  "ctrlDown": false,
  "hover": true,
  "insideDrag": 1,
  "drag": false,
  "dragX": 0,
  "dragY": 0
}

But when I try and screen for insideDrag - I get a LOT of calls AFTER the drop.... whihc would make this not so useful I think...

Lindon

@Christoph-Hart said in Adventures in broadcaster: attachToComponentMouseEvents:

Do you want it to react only on drop events or if you load a new file (using the right click dialog or programatically / after a preset load)?

There‘s another event source that watches complex data types which might be better for your use case.

basically all Im trying to handle is when the user drops a new wav file on the player - I want to then clean up the name for display (remove the path stuff..)

But thinking about it I have additional code that does the clean up for preset load and yet more for the programmatic load of sounds - if there was one call to rule them all that might be useful...

Christoph Hart

@Lindon yeah that‘s precisely what attachToComplexData is for. I‘ll make a example soon.

Lindon

@Christoph-Hart said in Adventures in broadcaster: attachToComponentMouseEvents:

@Lindon yeah that‘s precisely what attachToComplexData is for. I‘ll make a example soon.

lovely...

Christoph Hart

Alright here it is:

const var FileLoadBroadcaster = Engine.createBroadcaster({
	"id": "File Watcher",
	"colour": -1,
	"args": ["processorId", "fileIndex", "value"]
});


FileLoadBroadcaster.attachToComplexData("AudioFile.Content",   // event type
                                        "Audio Loop Player1",  // processor id
                                        0,                     // index of slot
                                        "Loop Player Source"); // metadata

/** This function will return the text value for the property so we just need to do some
    prettifying here.
*/
inline function getTextValue(indexInList, // the index of the component (here -1 because no array)
							 processorId, // the arguments of the broadcaster
							 fileIndex,   
							 value)
{
	if(value.indexOf("{PROJECT_FOLDER}") != -1)
	{
		return value.replace("{PROJECT_FOLDER}", "");
	}

	if(value.length > 0)
	{
		local f = FileSystem.fromAbsolutePath(value);
		return f.toString(1);
	}
	
	return "Empty";
};

FileLoadBroadcaster.addComponentPropertyListener("Label1",            // target component (single or array)
												 "text",              // target property
												 "Update Text Label", // metadata
												 getTextValue);       // conversion function

(You obviously need a Label called Label1 and a Loop player called Audio Loop Player1 for it to work).

I've also used the component property listener that automatically sets the properties of components. The advantage of this approach is that you can actually see what's going on in the broadcaster map.

Lindon

@Christoph-Hart great - very interesting....thanks.

Lindon

@Christoph-Hart -- Okay this works fine , but I dont (yet) understand how I can have a "simple" function call on the drop...instead of using addComponentPropertyListener

or how I extend this example to allow me to have Audio Loop Player 1, with its associated label1 and Audio Loop Player 2 with its associated label 2

Christoph Hart

how I extend this example to allow me to have Audio Loop Player 1, with its associated label1 and Audio Loop Player 2 with its associated label 2

Pass in an array of loop players to the source and an array of component IDs as the target and then use indexInList to figure out which value to return.

If you don't fancy the addComponentPropertyListener() method, you can just use the plain "old" addListener(object, metadata, function) call.

Natan

@Lindon Mate, did you figure this out?
Just tried the code by Christoph, and Cant understand how to add another set of Loop player here!

@Lindon said in Adventures in broadcaster: attachToComponentMouseEvents:

@Christoph-Hart -- Okay this works fine , but I dont (yet) understand how I can have a "simple" function call on the drop...instead of using addComponentPropertyListener

or how I extend this example to allow me to have Audio Loop Player 1, with its associated label1 and Audio Loop Player 2 with its associated label 2

Lindon

@Natan said in Adventures in broadcaster: attachToComponentMouseEvents:

@Lindon Mate, did you figure this out?
Just tried the code by Christoph, and Cant understand how to add another set of Loop player here!

@Lindon said in Adventures in broadcaster: attachToComponentMouseEvents:

@Christoph-Hart -- Okay this works fine , but I dont (yet) understand how I can have a "simple" function call on the drop...instead of using addComponentPropertyListener

or how I extend this example to allow me to have Audio Loop Player 1, with its associated label1 and Audio Loop Player 2 with its associated label 2

Im afraid I cant give you any clearer description of what to do than @Christoph-Hart's post above...

Natan

Hey folks, I'm trying to remove the .wav extension too, any help?

Below only removes the Project folder Path

if(value.indexOf("{PROJECT_FOLDER}") != -1)
	{
		return value.replace("{PROJECT_FOLDER}", "");
	}

@d-healey @Christoph-Hart @ulrik

Lindon

@Natan said in Adventures in broadcaster: attachToComponentMouseEvents:

if(value.indexOf("{PROJECT_FOLDER}") != -1)
{
return value.replace("{PROJECT_FOLDER}", "");
}

try:

if(value.indexOf("{PROJECT_FOLDER}") != -1)
	{
		return value.replace(".wav", "");
	}

Natan

@Lindon said in Adventures in broadcaster: attachToComponentMouseEvents:

if(value.indexOf("{PROJECT_FOLDER}") != -1)
{
return value.replace(".wav", "");
}

Hey Lindon, Thanks mate, This does the Job, But need to Remove the Project Path aswell

Also We need to Add a couple of Extension Like .Wav .Flac .Mp3 so the Label stand cleaner

Any Idea?

Lindon

@Natan

reg tempValue;
if(value.indexOf("{PROJECT_FOLDER}") != -1)
	{
		tempValue =  value.replace(".wav", "");
               Console.print(tempValue);  //<-- now think what you might do to this?
	}

Perhaps also read up about substring:

W3Schools.com

Well organized and easy to understand Web building tutorials with lots of examples of how to use HTML, CSS, JavaScript, SQL, Python, PHP, Bootstrap, Java, XML and more.

(www.w3schools.com)

Natan

@Lindon Thanks, man, Just need to Remove the {PROJECT_FOLDER} as well!

	if(value.indexOf("{PROJECT_FOLDER}") != -1) // This does not Work !!!
	{
		return value.replace("{PROJECT_FOLDER}", "");
	}
	
	
	reg tempValue;	
	
	if(value.indexOf("{PROJECT_FOLDER}") != -1)
		{
			tempValue =  value.replace(".wav", "");
            Console.print(tempValue);  //<-- now think what you might do to this?
	        return tempValue;
		}

Adventures in broadcaster: attachToComponentMouseEvents

W3Schools.com

40

1.6k

11.2k

97.7k