vMix Forums
»
General
»
vMix Call
»
White Label vMixCall Front End - with Code
Rank: Advanced Member
Groups: Registered
Joined: 12/10/2017(UTC) Posts: 96  Thanks: 13 times
Was thanked: 15 time(s) in 13 post(s)
|
[EDIT] I've just been testing this on one of our production sites and it does not appear to be working properly. The vmixcall page is not opening. It still works on the non-production site and another of our production sites. It may have to do with a plug-in, or theme, conflict. [/EDIT] [EDIT 30 July] Found the issue with our production system. A plugin, called USM Premium, was conflicting with the code being used. [/EDIT] While I am not a coder, this might be of help to some. First, our site is on Wordpress. To make this code work properly we use a plug-in called 'Embedder'. Within Wordpress we created an 'embedder' entry with the following code. Code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myform').submit(function(){ //when form is submitted..
window.location = "https://www.vmixcall.com/call.aspx?Key=1234567890&Name=" + $('#name').val(); //..get url from the textbox and load that url
return false; // prevent the form from being submitted
});
});
</script>
</head>
<body>
<form id="myform">
<input type="text" id="name" value="" />
<input type="submit" id="submit" value="Submit" />
</form>
</body>
</html>
You will need to change the 'Key=1234567890' to the proper password number. The embedder entry is saved with a 'shortcut' name. this name is used, as a, you guessed it, shortcut, on the Wordpress page. You can use any additional stuff you'd like in the page as well (i.e., graphics, text, etc..) The page, while currently on my test server, very basic and ugly, can be prettied up, if desired. After entering their name and clicking the 'Submit' button they are connected to the call. The call opens in the same window. It should be noted the URL in the address bar, once the call is connected does show the 'vmixcall' url. 
|
 1 user thanked TuesdaysLive for this useful post.
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 8/2/2013(UTC) Posts: 1,072  Location: Fairhope, Alabama USA Thanks: 553 times
Was thanked: 200 time(s) in 166 post(s)
|
Well done! Can't wait to try it.
- Tom
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 12/10/2017(UTC) Posts: 96 Thanks: 13 times
Was thanked: 15 time(s) in 13 post(s)
|
Tom -
I'd love to hear how it works out for you.
As I mentioned, It works on both my test server and one of our production servers. However, we've experienced issues on another production server. I suspect this is because of a theme, or plug-in, conflict. It may also be that the site host either has some incompatible server side services, or is blocking something.
Let me know how you get on.
Rich
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 8/2/2013(UTC) Posts: 1,072 Location: Fairhope, Alabama USA Thanks: 553 times
Was thanked: 200 time(s) in 166 post(s)
|
Appears to be working in some brief testing. Still would be nice if it used a URL with my domain instead of vMixCall.com. ;)
- Tom
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 12/10/2017(UTC) Posts: 96 Thanks: 13 times
Was thanked: 15 time(s) in 13 post(s)
|
Well, basically, all the code does is append the name entered by the 'caller' to the URL used by vMixCall.
There are methods of masking the URL in the address bar of a browser to reflect whatever you might want. However, that would take a bit of extra coding.
Glad to hear it is working for you. I'm hoping that others will find it helpful too.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 12/10/2017(UTC) Posts: 96 Thanks: 13 times
Was thanked: 15 time(s) in 13 post(s)
|
After finding and fixing our issue with a plug-in conflict, we've implemented our own 'white label' call front-end, using the code above, with some additional modifications. This is what it looks like... 
|
1 user thanked TuesdaysLive for this useful post.
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 3/20/2014(UTC) Posts: 2,721  Location: Bordeaux, France Thanks: 243 times
Was thanked: 794 time(s) in 589 post(s)
|
I tried your code the other day. Works ok although I modified it to allow users to enter their personal key and prevent them from kicking out a previously logged user.
Thanks
Guillaume
|
1 user thanked DWAM for this useful post.
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 12/10/2017(UTC) Posts: 96 Thanks: 13 times
Was thanked: 15 time(s) in 13 post(s)
|
DWAM wrote:I tried your code the other day. Works ok although I modified it to allow users to enter their personal key and prevent them from kicking out a previously logged user.
Thanks
Guillaume That is a very good option to include. Do you plan on sharing the code? However, it should be easy to work in, virtually the same as the 'name' input. [Edited to add] The inclusion of the 'password', in our case, was not desired as it doesn't change between guests and the chance of them kicking someone is slim. However, it might be interesting to include something like this that generated a code - if one could figure out how to use the locally generated 'password' for the call (since the vMixcall password is generated during the creation of the call input). Or, alternatively, if when one generates a vMixcall input in vMix, the 'password' could be pulled via a script and referenced by the site when a users 'Joins the Call' (if you follow me). [/Edit] [Edit 1 Aug] Parsing the saved show file does seem feasible. If one parses for the "VideoCallKey", its value can then be pulled. Thus, one should, theoretically, be able to parse the file, pulling the key value and then create a unique password value for each caller based on the name they enter when they use the connect page. Granted, it is more work than I'm currently willing to put into it, but it would work. [/Edit 1 Aug]
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 8/14/2016(UTC)
Posts: 117
Location: New York
Thanks: 12 times
Was thanked: 3 time(s) in 3 post(s)
|
This is wonderful.
Can you show me the added code to put in a password?
I would really like to add this to my production.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 3/21/2016(UTC)
Posts: 77
Location: Belfast
Thanks: 9 times
Was thanked: 3 time(s) in 3 post(s)
|
Hi Tuesdayslive. How is this working out for you .are you still using this as a way to brand your call page ?
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 12/10/2017(UTC) Posts: 96 Thanks: 13 times
Was thanked: 15 time(s) in 13 post(s)
|
It worked very well when we were using it. We've since move from that specific broadcast format into another that no longer requires the caller participation.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 3/7/2017(UTC)
Posts: 60
Thanks: 3 times
Was thanked: 6 time(s) in 6 post(s)
|
I took a stab at this sort of solution but tried to take it a step further. I'm using a reverse proxy so I have my own domain name on top of the vMix Call web site. I also am customizing the appearance to look more modern. But it's essentially the vMix Call web site so ?Code queries will work which is beneficial since I have multiple shows. I can also easily set up quick redirects such as /show1 or /show2 to redirect to the correct code for the show. The "need help" link currently just goes to the vMix Call tutorial on YouTube, but could link to anything really.  chrome_2019-04-02_13-54-22.jpg (157kb) downloaded 20 time(s).
|
|
|
|
|
|
Rank: Newbie
Groups: Registered
Joined: 4/8/2019(UTC) Posts: 2  Thanks: 1 times
|
would be great if VMix devs could come up with changes. so we can add a CNAME/A record on our domain name and use an embed code on our website.
full branding to our stream/brand
|
|
|
|
|
|
Rank: Member
Groups: Registered
Joined: 9/1/2017(UTC)
Posts: 21
Location: Brazil
Was thanked: 3 time(s) in 3 post(s)
|
Originally Posted by: sunkast  I took a stab at this sort of solution but tried to take it a step further. I'm using a reverse proxy so I have my own domain name on top of the vMix Call web site. I also am customizing the appearance to look more modern. But it's essentially the vMix Call web site so ?Code queries will work which is beneficial since I have multiple shows. I can also easily set up quick redirects such as /show1 or /show2 to redirect to the correct code for the show. The "need help" link currently just goes to the vMix Call tutorial on YouTube, but could link to anything really. chrome_2019-04-02_13-54-22.jpg (157kb) downloaded 20 time(s). Could you share the code? Thanks! Daniel
|
|
|
|
|
|
Rank: Advanced Member
Groups: Registered
Joined: 8/15/2013(UTC) Posts: 97  Location: Could be Australia could be Europe/UK! Thanks: 1 times
Was thanked: 7 time(s) in 7 post(s)
|
Originally Posted by: TuesdaysLive Well, basically, all the code does is append the name entered by the 'caller' to the URL used by vMixCall.
There are methods of masking the URL in the address bar of a browser to reflect whatever you might want. However, that would take a bit of extra coding.
Glad to hear it is working for you. I'm hoping that others will find it helpful too. I have this working with the URL Redirect method as described at the top here... But not having any luck masking the domain. Also when you hang up the call it goes to vmixcall.com (would prefer it closed the browser window @admins) Can you share how you would approach masking the URL? I tried an <iframe> method, (https://stackoverflow.com/questions/3982422/full-screen-iframe) but the vMix call page did not load. I also tried simple domain masking by putting a index.html file redirecting to vmixcall.com (https://www.siteground.com/kb/simple_domain_name_masking/) No dice. Would be a nice feature to have to be able to white label it totally. But I suspect there is some security stuff preventing us doing it. My code (includes option for entering the "invitation code" (vMix call password) Quote:<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myform').submit(function(){ //when form is submitted..
var urlNumber = $('#number').val()
var urlName = $('#name').val()
var urlString = urlNumber + "&Name=" + urlName
window.location = "https://www.vmixcall.com/call.aspx?Key=" + urlString; //..get url from the textbox and load that url
return false; // prevent the form from being submitted
});
});
</script>
</head>
<body>
<form id="myform">
<h4>
<strong> Enter your full name:</strong>
</h4>
<input type="text" id="name" value="" />
<br>
<br>
<h4>
<strong>Enter your invitation code:</strong>
</h4>
<input type="text" id="number" value="" />
<br>
<br>
<input type="submit" id="submit" value="Join Event" />
</form>
</body>
|
|
|
|
|
|
Rank: Member
Groups: Registered
Joined: 2/24/2020(UTC) Posts: 11
|
Originally Posted by: aircooled76@gmail.com Originally Posted by: TuesdaysLive Well, basically, all the code does is append the name entered by the 'caller' to the URL used by vMixCall.
There are methods of masking the URL in the address bar of a browser to reflect whatever you might want. However, that would take a bit of extra coding.
Glad to hear it is working for you. I'm hoping that others will find it helpful too. I have this working with the URL Redirect method as described at the top here... But not having any luck masking the domain. Also when you hang up the call it goes to vmixcall.com (would prefer it closed the browser window @admins) Can you share how you would approach masking the URL? I tried an <iframe> method, (https://stackoverflow.com/questions/3982422/full-screen-iframe) but the vMix call page did not load. I also tried simple domain masking by putting a index.html file redirecting to vmixcall.com (https://www.siteground.com/kb/simple_domain_name_masking/) No dice. Would be a nice feature to have to be able to white label it totally. But I suspect there is some security stuff preventing us doing it. My code (includes option for entering the "invitation code" (vMix call password) Quote:<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myform').submit(function(){ //when form is submitted..
var urlNumber = $('#number').val()
var urlName = $('#name').val()
var urlString = urlNumber + "&Name=" + urlName
window.location = "https://www.vmixcall.com/call.aspx?Key=" + urlString; //..get url from the textbox and load that url
return false; // prevent the form from being submitted
});
});
</script>
</head>
<body>
<form id="myform">
<h4>
<strong> Enter your full name:</strong>
</h4>
<input type="text" id="name" value="" />
<br>
<br>
<h4>
<strong>Enter your invitation code:</strong>
</h4>
<input type="text" id="number" value="" />
<br>
<br>
<input type="submit" id="submit" value="Join Event" />
</form>
</body> Is it possible to have the call open in a new window/tab? How would I edit the above code to that?
|
|
|
|
|
|
Rank: Member
Groups: Registered
Joined: 4/22/2020(UTC)
Posts: 23
Thanks: 4 times
Was thanked: 10 time(s) in 8 post(s)
|
|
|
|
|
|
|
vMix Forums
»
General
»
vMix Call
»
White Label vMixCall Front End - with Code
Forum Jump
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.
Important Information:
The vMix Forums uses cookies. By continuing to browse this site, you are agreeing to our use of cookies.
More Details
Close
