Question on a "Hello World" Start Up

[QRMarketing]

I have my own web app (HTML/Javascript) I have added the webpage URL to a scene. At start up it does seem to read the sceneID by number and can set the mic enabled or not. But only upon scence start-up. Throughout the application when I call the following code nothing happens. When doing it in the DOM it comes back with "PromiseStatus" Pending. It is like it needs a refresh or something to get it to see the command. I tried source.refresh();, but no go. What am I missing?

App = new xjs.App();

I place this somewhere in my code:

App.setPrimaryMicEnabled(true).then(function(val) {
            var isSet = val;
        });

[ghost]

Just checked it out on my end and it seems to work (I tried it in HTML Source) :(

All I did was execute App.setPrimaryMicEnabled(true).then(function(val) { console.log(val); }); in the DOM, and I did not get the PromiseStatus: Pending. It always logged true.

So with that said, can you confirm to us that you're using the following: XSplit Broadcaster version: 2.7.1602.2231 XSplit JS Framework version: 1.2.0

Btw, here's the code that I executed:

var xjs = require('xjs');

var App = new xjs.App();

for (var i = 0; i < 10; i++) {
  App.setPrimaryMicEnabled(true).then(function(val) {
    console.log(val); // This will log 'true' ten times.
  });
}

[QRMarketing]

Well, I think the issue is that I wanted to run my teleprompter web app in Chrome, and then have the xjs communicate with XSplit. I guess you need to run the url of my app as an extension, which is not so good, because you can not do stuff as in Chrome (for example audio tags don't work, no debug, etc...). But even then, it did not work as I would expect. So I had to build a handler for screen changes. Like the following:

On app init:

function do_prompter_init() {    
    xjs = require('xjs');
    Scene = xjs.Scene;
    App = new xjs.App();

    App.setPrimaryMicEnabled(false);
    App.setPrimarySpeakerLevel(75);

    xjs.ready().then(function() {

        Scene.initializeScenes().then(function(val) {
            if (val === true) {
                Scene.setActiveScene(4); // start scene
                do_xsplit(); // go loop forever and look for screen change requests 
            }
        }); 
    });
    scene_number = -1; // change this global in the telepromter app to change screens
    // do other init stuff as needed
}

then .... run my screen display areas (for capture) with buttons and telepromter notes etc ...

Then I have a handler to change screens. I had to do this way, as putting this inline in the code of my app doesn't work. Perhaps this needed to be encapsulated in the xjs.ready() context. But this is a bit of a bonehead way of doing it. Perhaps it could be done better.

function do_xsplit() {
    setTimeout(function(){   
        switch(scene_number) { 
       // global variable changed in my app to switch scenes
        case 1:
            Scene.setActiveScene(1);
            scene_number = -1;
            break;
        case 2:
            Scene.setActiveScene(2);
            scene_number = -1;
            break;
        case 3:
            Scene.setActiveScene(3);
            scene_number = -1;
            break;
        case 4:
            Scene.setActiveScene(4);
            scene_number = -1;
            break;
        case 5:
            Scene.setActiveScene(5);
            scene_number = -1;
            break;
        case 6:
            Scene.setActiveScene(6);
            scene_number = -1;
            break;
        default:
            scene_number = -1;
            break;
        }
        do_xsplit();  
    },300);
}

So I got it to work, just not as cleanly as one would expect. I am surprised that there is no nice plugin or JQuery plugin to do this better. I would imagine there is a lot of people that would like to have this teleprompter app that I built, though more generic with options and better put together technically. Perhaps a collaboration project if interested (with a demo if you like). I think there may be a market for a good generic teleprompter app/extension.

I am not super technical, more of a, just a "get it done" coder. But often better, too technical and no one can use it except super experts and then it does not meet the needs, as technical people have not a lot of sense when it comes to practical application real needs.

Thanks for your response.

[ghost]

Great thing that it worked. I'll try my best to reply some of the issues that you mentioned.

I guess you need to run the url of my app as an extension, which is not so good, because you can not do stuff as in Chrome (for example audio tags don't work, no debug, etc...)

Yes, this is required since you can only use "XSplit" features inside XSplit. As far as I know, audio tags should work in the latest version of XBC. It's just that you cannot play .mp3 files due to license restrictions (http://stackoverflow.com/a/8372306).

There are ways to connect to XSplit externally though, and one way to think of it is to create some sort of extension plugin that is design to just accept commands through web sockets and then execute those commands. Then you could create your normal web app that is designed to be opened in an ordinary browser, which would connect to the same websocket as the extension plugin so that the two can communicate with each other.

Perhaps this needed to be encapsulated in the xjs.ready() context. But this is a bit of a bonehead way of doing it. Perhaps it could be done better.

This is required since the framework needs to initialize itself before you can use it. xjs.ready() would just ensure that when you execute xjs related methods, it would work as it should.

You can imagine it as what window.addEventListener('load', function() {}); is for in the DOM. (The equivalent of this is $(document).ready(function() {}); in jQuery).

I made a version that should do almost exactly as your code: https://gist.github.com/dcefram/47a69a0e507560ba39dc

I am surprised that there is no nice plugin or JQuery plugin to do this better

I'm not sure if there would be one. But just in case you find one, jQuery should work with our framework too :) (just in case you didn't know that :P)

Perhaps a collaboration project if interested (with a demo if you like)

Well, we are actually open for collabs and plugin proposals... You can fill up our plugin proposal form here. We'll make sure that we reply to you :D

[QRMarketing]

Thanks for your reply. On the audio files, they were download from a supposed royalty free site. I don't think this is the issue. Yes your example is very similar to mine, though more technically nicer...;-). I give screen shots of my prompter (built on JQuery mobile). Perhaps this post will help others fighting the same battles that I did. It is good to share from time to time, as we can all benefit.

Thanks again.

[ghost]

Cool! Just open up another issue if something comes up, we'll try our best to reply ASAP (unless we're asleep).

As for the audio files, the issue with that is mp3 files wont play in XSplit if loaded through HTML Web source or through our extensions window. The reason behind that is mp3 extension requires license that CEF does not have. The best way to work around this is by using a library just like what TwitchAlerts uses: http://www.schillmania.com/projects/soundmanager2/

Sound manager uses Flash to play the audio files, which is a workaround with the license restrictions placed to CEF.

[QRMarketing]

Ok, understood on the audio issues.

On the jQuery plugin; so what you need is a extension that just accepts commands from the Chrome App. Sort of a Api to the Api ... seems a bit dubious. I was going in that direction, but struggled how to communicate between the Xsplit browser and the Chrome browser. No easy way to do this - Cookies, LocalStorage, MySQL database, etc .. ouff all have their issues. Perhaps sockets, but now we are getting deep. So you need (1) the extention app and (2) the JQuery pluggin to communicate with the extention. Are we not complicating this a bit much? Any way I will just use what I have, and leave it to you and the experts to come up with the right solution. I do think for the XSplit product they should come up with a better/easier solution .. IMHO. Thanks again and kind regards ...

[ghost]

Right, there are some new features coming up in the next version of XSplit, but as far as I can see it right now, web sockets is the only 'clean' way to connect an external browser with XSplit. But you're right, you could work on what is available right now, and probably tackle the external browser issue later on, when there's a much better or easier solution to that problem :)

Feel free to open up another issue if you got some other questions/clarifications or suggestions to make the framework better :) I'll be closing this issue for now.