Question

I have a video player that runs client-side, and I want to store a configuration for it so I don’t have to write it each single time.

I had an idea where I could place a marker in the markup, such as:

<player id="Player1" #marker></player>

Or something to that effect, and then replace #marker with the settings I have stored in the javascript function.

I know some basic Javascript, but I have never done something so advanced.

Here is an example:

<script type="text/javascript" language="JavaScript">
    flowplayer("player", "http://www.easymuaythai.com/Videos/FlowPlayer/flowplayer-3.2.7.swf", #marker);
</script>

Where it says #marker, I want to replace it with:

{
        clip: {
            Scaling: 'fit',
            onStart: function (clip) {
                var w = parseInt(clip.metaData.width, 10),
                    h = parseInt(clip.metaData.height, 10);
                $(this.getParent()).css({
                    width: w,
                    height: h
                });
            }
        }
    }

Answer 1

You can use JQuery,
add this to the Head section of your page :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

then write this in your js file or section

$('#player1').attr('playerConfiguration', 'Value');

that will cause <player id="Player1" playerConfiguration="value"></player>
hope that helps…