CODEWITHSUNDEEP
htmlcssflashruffle
Quinn Hayes
Quinn Hayes

Reputation: 9

Is there a way to add ruffle to my website?

I don't have access to the code on ruffle.js and when I try to use other methods it says extension blocked but ruffle has worked on this computer and anyone help?

"My" code rn is:

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset='utf8'>
    </head>
    <body>
        <div id='ruffle'></div>
<script>
    window.RufflePlayer = window.RufflePlayer || {};

    window.addEventListener("DOMContentLoaded", () => {
        let ruffle = window.RufflePlayer.newest();
        let player = ruffle.createPlayer();
        let container = document.getElementById("container");
        container.appendChild(player);
        player.load("movie.swf");
    });
</script>
<script src="https://flash-games.penguinbotcoder.repl.co/ruffle/ruffle.js"></script>
<object width="600" height="400">
    <param name="movie" value="https://flash-games.penguinbotcoder.repl.co/flashgames/thinice.swf">
    <embed src="https://flash-games.penguinbotcoder.repl.co/flashgames/thinice.swf">
    </embed>
</object>
<script src="path/to/ruffle/ruffle.js"></script>
    </body>
    <div class=ruffle>
    </div>
    <p>This is a test page for flash content</p>
</html>

as I said up there it's just not working :(

Upvotes: 0

Views: 1470

Answers (2)

Dave
Dave

Reputation: 1

Make sure your Ruffle script path and the Flash file -https://flash-games.penguinbotcoder.repl.co/ruffle/ruffle.js and path/to/ruffle/ruffle.js- is accessible as they aren't accessible for me.

You can try updating your Ruffle path to the CDN release at https://unpkg.com/@ruffle-rs/ruffle or hosting it yourself.

Your code should look something like this

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset='utf8'>
    </head>
    <body>
        <div id='ruffle'></div>
        <script>
            window.RufflePlayer = window.RufflePlayer || {};
            window.addEventListener("DOMContentLoaded", () => {
                let ruffle = window.RufflePlayer.newest();
                let player = ruffle.createPlayer();
                let container = document.getElementById("container");
            container.appendChild(player);
        });
        </script>
        <script src="https://unpkg.com/@ruffle-rs/ruffle"></script>
        <object width="600" height="400">
            <param name="movie" value="https://flash-games.penguinbotcoder.repl.co/flashgames/thinice.swf">
            <embed src="https://flash-games.penguinbotcoder.repl.co/flashgames/thinice.swf" />
        </object>
        <p>This is a test page for flash content</p>
    </body>
</html>

Please note that I'm not able to access your Flash file.

Upvotes: 0

amel
amel

Reputation: 1154

I don't understand well what is exactly the problem but this is what I noticed from you code: You are trying to get an element by id container but you don't have that element in your HTML, I think you try to use the element with id ruffle instead.

window.addEventListener("DOMContentLoaded", () => {
    let ruffle = window.RufflePlayer.newest();

    let player = ruffle.createPlayer();
    let container = document.getElementById("ruffle");
    container.appendChild(player);
player.load("movie.swf");
});

Update:
If still not working then try this example code and see if it loads the Flash content...

<!DOCTYPE HTML>
<html>
    <head> <meta charset='utf8'> </head>
    
    <body>
    
        <script src="https://flash-games.penguinbotcoder.repl.co/ruffle/ruffle.js"></script>
    
        <div id='ruffle'></div>
        
        <p>This is a test page for Adobe Flash content</p>
        
    </body>
    
    <script>
    
        window.RufflePlayer = window.RufflePlayer || {};
        window.addEventListener("DOMContentLoaded", start_Ruffle, false );
        
        function start_Ruffle()
        {
            let ruffle = window.RufflePlayer.newest();
            let player = ruffle.createPlayer();
            let container = document.getElementById("ruffle");
            container.appendChild(player);
            player.load("https://flash-games.penguinbotcoder.repl.co/flashgames/thinice.swf");
            
        }
        
    </script>

</html>

Upvotes: 1

Related Questions