BinBashBanana / webretro

RetroArch in your browser
https://binbashbanana.github.io/webretro/
MIT License
239 stars 342 forks source link

Embedding #84

Closed TheOGCoolNinjaGamerNM closed 1 year ago

TheOGCoolNinjaGamerNM commented 1 year ago

So i am really dumb can you put simpler instructions or possibly make if a vid if have time and this time on a google site

TheOGCoolNinjaGamerNM commented 1 year ago

@BinBashBanana Plz Help

foxsouns commented 1 year ago

what is your end goal here? what do you want to accomplish? if you just need a new site url, follow the instructions here.

TheOGCoolNinjaGamerNM commented 1 year ago

@foxsouns Hi thank you for replying but i was wondering what the embed code would be if you have a published site on google sites and not a new github site

foxsouns commented 1 year ago

if you don't understand the steps at the readme; you probably should look into learning html/js. there is an example with valid code in that section; you would copy it over to the google site, in theory. again, gh sites is significantly easier, and you could use gitlab or codeberg if you need a non-github.io domain: import from this repository and follow the instructions on the site.

TheOGCoolNinjaGamerNM commented 1 year ago

??

TheOGCoolNinjaGamerNM commented 1 year ago

can you share the embed code for google sites

TheOGCoolNinjaGamerNM commented 1 year ago

@foxsouns

foxsouns commented 1 year ago
  1. i have post notifications for this entire repository. you do not have to ping me.
  2. it's in the source for embed/embed-example.html in the repository.
TheOGCoolNinjaGamerNM commented 1 year ago

Tried it on google sites doesnt work

foxsouns commented 1 year ago

what is with the hyperfix on google sites; do you have a genuine need for it or what

TheOGCoolNinjaGamerNM commented 1 year ago

?? can you add it on the page on the top named plz add code here https://sites.google.com/d/1UaAA4NVDLxs4vFN5gECHOI3LjRoz27Y5/p/199ccOam9MnpcTjUfR4dWDY15phgKWrF8/edit

TheOGCoolNinjaGamerNM commented 1 year ago

@foxsouns sorry

TheOGCoolNinjaGamerNM commented 1 year ago

Hello @foxsouns

foxsouns commented 1 year ago

sigh. try this. replace path_to_rom with a url that links to your rom.

<div id="webretro-container"></div>
<br>
<input type="button" id="fullscreen" value="Fullscreen">
<br>
<br>

<script>
function webretroEmbed(node, path, queries) {
    var frame = document.createElement("iframe");
    frame.style = "border: none; display: block; width: 100%; height: 100%;";

    // change rom path to absolute if it isn't already
    if (queries.rom) {
        var link = document.createElement("a");
        link.href = (/^(https?:)?\/\//i).test(queries.rom) ? queries.rom : "roms/" + queries.rom;
        queries.rom = link.href;
    }

    frame.src = path + "?" + Object.entries(queries).map(i => i.map(i => i && encodeURIComponent(i))).map(i => i[1] ? i.join("=") : i[0]).join("&");
    node.appendChild(frame);

    return frame;
}
</script>
<script>
var frame = webretroEmbed(document.getElementById("webretro-container"), "../", {system: "auto", rom: "path_to_rom"});
document.getElementById("fullscreen").onclick = function() {
frame.requestFullscreen();
};
</script>
TheOGCoolNinjaGamerNM commented 1 year ago

Thank you but i have one more question if you have the file of the rom, how would you make that into a url

foxsouns commented 1 year ago

upload it somewhere online and just use the url in place of path_to_rom

TheOGCoolNinjaGamerNM commented 1 year ago

Like how do you upload it online

foxsouns commented 1 year ago

jesus dude we live in 2023 use a search engine, "file hosting site"

TheOGCoolNinjaGamerNM commented 1 year ago

will onedrive work

foxsouns commented 1 year ago

if you make sure to get direct access i believe so https://www.startpage.com/sp/search?query=onedrive+direct+access+link

TheOGCoolNinjaGamerNM commented 1 year ago

Like this

foxsouns commented 1 year ago

try it: i don't have a google account so you're on your own to test it out

TheOGCoolNinjaGamerNM commented 1 year ago

I think there is an issue with the code it doesent work and im pretty sure google sites has to start with an <html

TheOGCoolNinjaGamerNM commented 1 year ago

"https://onedrive.live.com/?authkey=%21AEFh9kGJkUY%5FwNI&cid=929E45F927E98E19&id=929E45F927E98E19%211555&parId=root&o=OneUp"}); this is the link to file but when i put it in the code it didnt work

BinBashBanana commented 1 year ago

@foxsouns thank you for helping, but please don't feel like you have to do so.