PubliHub :: Source Code Viewer

Opgelet: Bij PHP-pagina's of serverpagina's wordt enkel de gerenderde html getoond.



Broncode van https://cdn.publihub.media/demos/app/sl.html

<html lang="nl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MyAPP</title>

    <!--APP STYLING-->
    <link rel="stylesheet" href="https://cdn.publihub.media/css/app.css?v4.5">

    <!--APP FUNCTIES :: CDN-connecties-->
    <script src="https://cdn.publihub.media/lib/app.js?v95"></script>
    <script src="https://www.leerschool.be/smarticles/bricks/crowl.fsbutton.js?v7"></script>
    <script src="https://www.leerschool.be/smarticles/bricks/crowl.layers.js"></script>
    <script src="https://cdn.publihub.media/lib/crowl.processing.js"></script>
    <script src="https://cdn.publihub.media/lib/crowl.snapshotcamera.js?v13"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.9.4/p5.min.js"></script>
    <script src="https://unpkg.com/ml5@1/dist/ml5.min.js"></script>
    <script src="https://cdn.publihub.media/lib/crowl.faceparts.js?v2"></script>  
    <script src="https://cdn.publihub.media/lib/crowl.layers.js?v2"></script>  

</head>
<body data-theme="teletext">

    <app-layers height="100vh">
        <app-layer id="canvas-layer" z="2">
            <app-part id="snapshot" style="opacity:0.9;"></app-part>
            <app-snapshot target="snapshot" id="camera" nobutton label="MAAK FOTO" mirror="false" width="100%" height="100%" downloadimage uploadimage="https://cdn.publihub.media/uploads/?prefix=krismerckx&keycode=abc123"></app-snapshot>
        </app-layer>
        <app-layer id="overlay-layer1" z="10">
            <app-facepart type="mouth"></app-facepart>
            <app-facepart type="lefteye"></app-facepart>
            <app-facepart type="righteye"></app-facepart>
        </app-layer>
        <app-layer id="overlay-layer2" z="3" x="100px" y="100px" backgroundcolor="rgba(0, 0, 255, 0.5)">
            <app-part innerspace="13">
                <h3>Extra inhoud boven canvas</h3>
            </app-part>
        </app-layer>
    </app-layers>

    <app-voice command="foto" id="maakfoto"></app-voice>
    
    <script>
        app.ready(function(){
            id("maakfoto").after("listen").do(function(){
                id("camera").takeSnapshot(camera.p5Context);
            });
        });
    </script>

</body>
</html>