sdk3
/
livecodingspace-app


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
							<!DOCTYPE html>

<!-- Copyright 2012 United States Government, as represented by the Secretary of Defense, Under  -->
<!-- Secretary of Defense (Personnel & Readiness).                                               -->
<!--                                                                                             -->
<!-- Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file   -->
<!-- except in compliance with the License. You may obtain a copy of the License at              -->
<!--                                                                                             -->
<!--   http://www.apache.org/licenses/LICENSE-2.0                                                -->
<!--                                                                                             -->
<!-- Unless required by applicable law or agreed to in writing, software distributed under the   -->
<!-- License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,   -->
<!-- either express or implied. See the License for the specific language governing permissions  -->
<!-- and limitations under the License.                                                          -->

<html>

<!-- The Virtual World Framework client is a collection of scripts and a world specification   -->
<!-- passed to an initialization call. In this sample, the world specification is provided     -->
<!-- inline for clarity, but it is normally provided by the reflector or may be specified as a -->
<!-- URI and loaded from a network-visible location.                                           -->

<head>

    <title>Virtual World Framework</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico" />

    <meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

    <script type="text/javascript" src="compatibilitycheck.js"></script>

    <script type="text/javascript" src="socket.io/socket.io.js"></script>
    <!-- <script type="text/javascript" src="socket.io-sessionid-patch.js"></script> -->
    <script src="vwf/view/webrtc/dist/adapter-latest.js"></script>


    <script type="text/javascript" src="vwf/view/lib/cell.js"></script>
    <script type="text/javascript" src="vwf/view/lib/he.js"></script>
    <script type="text/javascript" src="vwf/view/lib/draggabilly.pkgd.js"></script>
    <script type="text/javascript" src="js/screenfull.min.js"></script>
   <!-- <script type="text/javascript" src="vwf/view/lib/polyglot/polyglot.min.js"></script> -->
    

    <link rel="stylesheet" href="vwf/view/lib/mdc/dist/material-components-web.css">
    <script src="vwf/view/lib/mdc/dist/material-components-web.js"></script>

    <script type="text/javascript" src="require.js"></script>

    <script type="text/javascript" src="async.js"></script>


    <script type="text/javascript" src="crypto.js"></script>
    <script type="text/javascript" src="md5.js"></script>

    <script type="text/javascript" src="alea.js"></script>
    <script type="text/javascript" src="mash.js"></script>

    <script type="text/javascript" src="Class.create.js"></script>
    <script type="text/javascript" src="rAF.js"></script>
    <script type="text/javascript" src="performance.now-polyfill.js"></script>

    <!-- This is the main client library. vwf.js creates a framework manager and attaches it to  -->
    <!-- the global window object as window.vwf. All access to the framework is through that     -->
    <!-- reference, and no other objects are globally visible.                                   -->

    <script type="text/javascript" src="vwf.js"></script>

    <!-- The core framework manages the simulation and synchronizes it across worlds shared by   -->
    <!-- multiple users. But, the manner in which the simulation is expressed is controlled by   -->
    <!-- extension modules. There are two flavors. Models directly control the simulation but    -->
    <!-- cannot accept external input. The model configuration is identical for all participants -->
    <!-- in a shared world. Views may accept external input -such as pointer and key events or   -->
    <!-- directives from a connection to an outside engine that is not visible to all users- but -->
    <!-- may only affect the simulation indirectly through the synchronization server.           -->

    <script type="text/javascript">
        // Users can specify which libraries the application will load by adding parameters to the URL.
        // Model libraries are specified as a query parameter and view libraries as a hash fragment.
        var queryString = window.location.search.substring(1);
        var hashString = window.location.hash.substring(2);
        var userLibraries = { model: {}, view: {} };
        var googleEarth = false;
        var match;
        var application;
        var regex = /([^&=]+)=?([^&]*)/g;


        var requireConfig = {
            paths: {
                jquery: "jquery-1.10.2.min",
                "jquery-ui": "jquery-ui-1.10.3.custom.min"
            },
            shim: {
                "jquery-ui": {
                    deps: ["jquery"],
                    exports: "$"
                },
                "jquery-encoder-0.1.0": ["jquery"]
            }
        };
        require(requireConfig, ["jquery", "jquery-encoder-0.1.0"], function ($) {
            while (match = regex.exec(queryString)) {
                var key = $.encoder.canonicalize(match[1]);
                var parameters = $.encoder.canonicalize(match[2]);
                if (key == "application") {
                    // Get the application specification if one is provided in the query string.
                    application = parameters;
                }
                else {
                    try {
                        parameters = JSON.parse(parameters);
                    }
                    catch (e) {
                    }
                    userLibraries["model"]["vwf/model/" + key] = (parameters && parameters != "") ? parameters : undefined;
                }
            }

            while (match = regex.exec(hashString)) {
                var key = $.encoder.canonicalize(match[1]);
                var parameters = $.encoder.canonicalize(match[2]);
                try {
                    parameters = JSON.parse(parameters);
                }
                catch (e) {
                }
                userLibraries["view"]["vwf/view/" + key] = (parameters && parameters != "") ? parameters : undefined;
                if (key == "google-earth") {
                    googleEarth = true;
                }
            }

            googleEarth && document.write("<scr" + "ipt type='text/javascript' src='http://www.google.com/jsapi?hl=en&amp;key=ABQIAAAAwbkbZLyhsmTCWXbTcjbgbRSzHs7K5SvaUdm8ua-Xxy_-2dYwMxQMhnagaawTo7L1FE1-amhuQxIlXw'></scr" + "ipt>");

            vwf.loadConfiguration(application, userLibraries, compatibilityCheck);

        });
    </script>

    <!-- This is the common view implementation and an example view that summarizes the          -->
    <!-- simulation state in HTML on the main page.                                              -->

    <link rel="stylesheet" type="text/css" href="index.css" />

    <!-- Global Site Tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-11815598-9"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments) };
        gtag('js', new Date());
        gtag('config', 'UA-11815598-9');
    </script>


</head>

<body class="mdc-typography">
    <!-- Generic clients may have nearly empty pages, but pages for custom clients may be laid   -->
    <!-- out in any manner desired. Any view and models that render to the page should be        -->
    <!-- instructed where to attach their content.                                               -->

    <!-- The main content renders to "#vwf-root", the item with the id "vwf-root".               -->

    <!-- The loading spinner -->
    <div id="vwf-loading-spinner" class="pace pace-active">
        <div class="pace-activity"></div>
    </div>

    <div id="incompatibleBrowser">
        <div>
            <span style="color:#3090C7;">
                <br/>
                <br/>Your browser does not support Virtual World Framework. Please review our
                <a href='https://virtual.wf/requirements.html'>requirements</a> for supported browser versions.</span>
        </div>
    </div>
    <div id="vwf-root"></div>

    <div id="ui-controls" class="guiwindow">
        <i id="hideui" class="mdc-icon-toggle material-icons" role="button" aria-pressed="true" aria-label="Hide Toollbar" tabindex="0"
        data-toggle-on='{"label": "Hide", "content": "grid_on"}' data-toggle-off='{"label": "Show", "content": "grid_off"}'>
        grid_on
        </i>

        <i id="fullscreenui" class="mdc-icon-toggle material-icons" role="button" aria-pressed="true" aria-label="Hide Toollbar" tabindex="0"
        data-toggle-on='{"label": "Hide", "content": "fullscreen"}' data-toggle-off='{"label": "Show", "content": "fullscreen_exit"}'>
        fullscreen
    </i>

    </div>


    <script>
        mdc.autoInit();
        window.addEventListener("load", function (event) {

            console.log("All resources finished loading!");

        });

        const iconEl = document.querySelector('#hideui');
        iconEl.addEventListener('MDCIconToggle:change', (e) => {

            let ui = document.querySelector('.mdc-toolbar');
            if (ui) {

            let chkAttr = e.detail.isOn;
            if (chkAttr) {
                ui.style.visibility = 'visible'
            } else {
                ui.style.visibility = 'hidden'
            }
        }

        });

       
        const fullScreenToggle = document.querySelector('#fullscreenui');
        fullScreenToggle.addEventListener('MDCIconToggle:change', (e) => {

            if (screenfull.enabled) {
                screenfull.toggle();
            } else {
                // Ignore or do something else
            }
        });

    </script>

</body>

</html>