OT: javascript help


 

Steve_M

TVWBB Guru
HTML and JS aren't really my strong suit, I tend to stick to managing and deploying apps!

Anyways, rather than making new accounts other forums, I'm seeing if someone might be able to lend me a hand here first.

Rather than make 8 different html pages, each with a hard coded bitrate, I'd like to use javascript for this. I've already got the main html file created in a static format where it's got a list of links such as:

Code:
<td> <a href="http://my.tv.tuner/auto/v7.1?transcode=internet360">
<img src="icons/ABC_us.jpg" style="width: 300px; height: 250px;" alt="ABC"/></a></img></td>
<td> <a href="http://my.tv.tuner/auto/v4.1?transcode=internet360">
<img src="icons/CBS02_us.jpg" style="width: 300px; height: 250px;" alt="CBS"/></a></img></td>
<td> <a href="http://my.tv.tuner/auto/v2.1?transcode=internet360">
<img src="icons/NBCHD.jpg" style="width: 300px; height: 250px;" alt="NBC"/></a></img></td>

What I'd like to do is have a dropdown box where I can select from a bitrate

Code:
<div class="dropdown-bitrates">
<select id="bitrate" name="bit_rates">
<option value="internet360">360</option>
...
...
...
<option value="internet720">720</option>
</div>

2) Have a base URL defined in a variable ie id="tvtuner" href="http://my.tv.tuner/auto/"

I assume I'll need to turn all the existing hrefs into JS functions and call them as such. This is where I need help.

Something like:

Code:
<script type="text/javascript">
function 7_1() {
        var sel = document.getElementById('bitrate');
        sel.onchange = function() {
                document.getElementById("tvtuner").href = + "v7.1?transcode=" + this.value;
        }
}
function 4_1() {
        var sel = document.getElementById('bitrate');
        sel.onchange = function() {
                document.getElementById("tvtuner").href = + "v4.1?transcode=" + this.value;
        }
}
</script>

Then my href should be something like:

Code:
<a href="javascript:7_1();">

or maybe

Code:
<a href="javascript:void(0);" onclick="javascript:7_1();">

Can anyone help me tie it all together?
 
Last edited:
You want to make links that change where all the other links go? Or you want a dropdown that changes all the links? It looks like you've already got that all figured out, so where is it going wrong?
 
I want the dropdown to change all of the links to be the selected bitrate ie: transcode=internet360, transcode=internet480

Things are going wrong in that I've basically copied / pasted samples of JS code that should somewhat do the job, but since I'm a total noob at JS, I'm not sure what I need to do to make it fully work.

Right now if I call the functions in the href, nothing happens.
 
I'll try to play around with this and give you a working sample. I can't do it right now. But, at first glance, it looks like your functions are trying to modify the elements with an id="tvtuner" and you don't seem to have that assigned to the links like this: <a id="tvtuner">. Maybe I'm missing something. Also, there should only be 1 element with an id (id's are unique). So, you might need to rethink it so you can loop over the elements.
 
Close, but it's setting the same link for each href record.

The URL is composed with 3 pieces of info

The base URL , the virtual channel ID, and the transcoding bitrate.

ie: for ABC, it's v7.1, so the href should be:

http://my.hdhomerun/auto/v7.1?transcode=internet720

Would another id:value list be needed for each channel?

ie:

class="chans" id="cbs" "vchan=7.1"
 
Last edited:
Yea. It's not the most elegant solution. You did need something else to make the URL's unique (giving each it's own vchan. I went with an array. For something small, this will be fine. For anything that scaled much beyond this, it would become unmaintainable rather quickly.

It seems like the logical place to put it would be in the anchor like this <a href="http://my.hdhomerun/auto/v2.1?transcode=".....>. But, you can't keep appending the "internet720" part over and over with each change of the drop down list because the URL keeps growing. So, you have to replace the href each time. Or, come up with a more dynamic way to replace base on the id of the anchor or something like that. Like I said, for a small scale project, this will be fine. Otherwise, I'd rethink it a little more.
 
Lookin good, thanks!

I've actually got about 25 links to put in, I just used 3 as my example. I can just split up the array to each channel is on its own line, following the same order of the links below.

How much more complexity would it add to create a 2nd dropdown that would append "&duration=X"?

Edit: I didn't see your 2nd post with the test2 and test3 files which makes the channel numbers much easier to manage.
 
Last edited:
No problem.

You were missing quite a few tags throughout your code. So, you'd probably be ahead of the game to start with my code as the base. Have you had a chance to get a copy? If so, I'll remove these files.
 

 

Back
Top