Run script in a <div>

Asked

Viewed 3,226 times

3

I own this script. What should I add to it so that when it is executed, it appears in a <div>?

Here is the script:

// Which flash versions are needed for given format
var FLASH_VERSIONS = {
    '7/0/0': [5],
    '9/0/115': [18, 22, 33, 34, 35, 37, 38, 59, 78, 82, 83, 84, 85, 120, 121],
    '10/1/0': [52, 53, 54, 60],
    };

// Regex to extract the video format
var RE_ITAG = /&itag=([0-9]*)&/i;

function get_fmt(content) {
    var fmt = new Object();
    fmt.list = new Array();
    fmt.stream_map = new Array();

    for (var i=0; i < content.length; i++) {
        var url = content[i]['url'];
        if (url.search("") == -1)
            continue;

        var matches = RE_ITAG.exec(url);
        var itag = matches[1];

        var resolution = '7/0/0';
        for (var possible_resolution in FLASH_VERSIONS.length) {
            if (FLASH_VERSIONS[possible_resolution].indexOf(itag)) {
                resolution = possible_resolution;
            }
        }

        fmt.list.push(itag+'/'+String(content[i].width)+'x'+String(content[i].height)+'/'+resolution);
        fmt.stream_map.push(itag+'|'+content[i].url.replace(/,/g, '%2C'));
    }

    fmt.list.reverse();
    fmt.stream_map.reverse();
    return fmt;
}

function get_embed(content) {
    var fmt = get_fmt(content);
    var flashvars = new Array();
    flashvars.push('fs=1');
    flashvars.push('hl=en');
    flashvars.push('autoplay=1');
    flashvars.push('ps=');
    flashvars.push('playerapiid=uniquePlayerId');
    flashvars.push('fmt_list='+encodeURIComponent(fmt.list.join()));
    flashvars.push('fmt_stream_map='+encodeURIComponent(fmt.stream_map.join()));
    flashvars.push('');
    flashvars.push('t=1');
    flashvars.push('vq=large');
    flashvars.push('auth_timeout=86400000000');

    var embed = document.createElement('');
    embed.setAttribute("src", "");
    embed.setAttribute("type", "application/x-shockwave-flash");
    embed.setAttribute("allowfullscreen", "true");
    embed.setAttribute("allowscriptaccess", "always");
    embed.setAttribute("scale", "noScale");
    embed.setAttribute("wmode", "opaque");
    embed.setAttribute("flashvars", flashvars.join("&"));
    embed.setAttribute("width", "100%");
    embed.setAttribute("height", "100%");
    return embed;
}

var ts = Math.round((new Date()).getTime() / 1000);
var script = document.createElement('script');
var hash = document.location.hash;
var id = hash.substr(1,hash.length);
var head = document.getElementsByTagName('head').item(0);
var script = document.createElement('script');

script.setAttribute('type', 'text/javascript');
script.setAttribute('src', 'https://');
head.appendChild(script);

myFunction(); // Fails because it hasn't loaded from my.js yet.    
    window.onload = function() {
        // Works most of the time but not all of the time.
        // Especially if my.js injects another script that contains myFunction().
        myFunction();
    };

How do I load it into an html page appears inside the specific div?

Example:

<div id="script" class="#">/div>
  • A doubt... what has in the váriavel ts?

  • Refers to this part Math.round(ts/3600 ? there will appear an embed

  • I took that part out. It wasn’t for this one

  • As you’ve been told here (By the way, it’s the same question, right? ), there’s no such thing as "the script appears inside a div". It depends on what the script does. It can write content somewhere or not. What script are you trying to run? Taking this example, what would be the content of myFunction?

2 answers

5


Remove this part of the script, it is unnecessary:

myFunction(); // Fails because it hasn't loaded from my.js yet.

window.onload = function() {
    // Works most of the time but not all of the time.
    // Especially if my.js injects another script that contains myFunction().
    myFunction();
};

Now look at this line:

script.setAttribute('src', 'https://?authuser=0&alt=jsonm&urlredir=1&commentreason=1&fd=shapes&thumbsize=d&max-results=100&callback=picasa_callback&t=');

In particular, in this here:

callback=picasa_callback

When the script is inserted, the function indicated as callback will be called. In this case, it is the function picasa_callback. Now see how she is:

function picasa_callback(obj) {
    document.body.appendChild(get_embed(obj['feed']['media']['content']));
}

It takes an HTML (generated by get_embed) and inserts at the end of <body>, with document.body.appendChild. If you want to insert this HTML into your div with id script, make the append on her and not on the body:

function picasa_callback(obj) {
    document.getElementById('script').appendChild(get_embed(obj['feed']['media']['content']));
}

Important: to ensure that div exists when callback is called, include your script at the end of the HTML. Make sure the script is after the <div id="script" class="#"></div> in the source code.

  • But in this case the user will be exposed in html?

  • Yeah, you can’t help it. In HTML ("display source code" option) it will not appear because it has been injected, but any code inspector will be able to see that url.

  • Would it be possible to exchange the user id only for the div? type '+id+'

  • I don’t understand ...

  • I say instead of using the script in several places, I would use the same script, only changing by div the user or uploaded video

  • I think so, playing with the script and experimenting.

  • I tried to get him to charge by the div using the class but I couldn’t, do you have any idea how to do it? <div id="script" class="100642868990821651444/albumid/5720909216955340593/photoid/5720909218315234178"></div>

Show 2 more comments

1

I suggest using the Jquery pro mater library compatibility with several browsers and can use the code:

link to include lib:

<script src ="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Javascript code:

$(function() {
  $('#script').append('<div></div>');
});

You can take a look at JS Fiddle: http://jsfiddle.net/L1ufwdt9/4/

  • Can only be done with java?

  • You mean Javascript? There’s no reason why, yes, I’ll modify it in JS Fiddle.

  • So it actually does, but it’s not cross-browser and if you use more than one image, or iframe on the page, it will load several times. http://stackoverflow.com/questions/595808/is-it-possible-to-append-to-innerhtml-without-destroying-descendants-onclick-fu

  • The code does not work, only appears the letter you added there

  • I guess I didn’t understand your question so what do you want to add inside the div? I added another div with the content 'b'

  • The goal is to make the script load in the div, the script loads and appears in the div

  • The script I gave you carries a div inside another div, which you want to appear inside it?

Show 2 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.