Код Half-Life: Uplink в браузере

Привет! Я тут порыскал и нашел код халфы уплинк)
Я тут новичок так что надеюсь вы не будете судить строго.

Ладно вот он -

<html m_init="2341021-16202006231616"><head>

<title>Half-Life: Uplink</title>

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min..."></script>

<link href="app.css" rel="stylesheet">

<script src="app.js"></script>

<meta name="shimejiBrowserExtensionId" content="gohjpllcolmccldfdggmamodembldgpc" data-version="1.6.3"><style type="text/css">

@Charset "UTF-8";

/*!

* jQuery contextMenu - Plugin for simple contextMenu handling

*

* Version: v2.5.0

*

* Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF)

* Web: http://swisnl.github.io/jQuery-contextMenu/

*

* Copyright (c) 2011-2017 SWIS BV and contributors

*

* Licensed under

* MIT License http://www.opensource.org/licenses/mit-license

*

* Date: 2017-05-25T11:30:28.663Z

*/

@-webkit-keyframes cm-spin {

0% {

-webkit-transform: translateY(-50%) rotate(0deg);

transform: translateY(-50%) rotate(0deg);

}

100% {

-webkit-transform: translateY(-50%) rotate(359deg);

transform: translateY(-50%) rotate(359deg);

}

}

@-o-keyframes cm-spin {

0% {

-webkit-transform: translateY(-50%) rotate(0deg);

-o-transform: translateY(-50%) rotate(0deg);

transform: translateY(-50%) rotate(0deg);

}

100% {

-webkit-transform: translateY(-50%) rotate(359deg);

-o-transform: translateY(-50%) rotate(359deg);

transform: translateY(-50%) rotate(359deg);

}

}

@keyframes cm-spin {

0% {

-webkit-transform: translateY(-50%) rotate(0deg);

-o-transform: translateY(-50%) rotate(0deg);

transform: translateY(-50%) rotate(0deg);

}

100% {

-webkit-transform: translateY(-50%) rotate(359deg);

-o-transform: translateY(-50%) rotate(359deg);

transform: translateY(-50%) rotate(359deg);

}

}

@font-face {

font-family: "context-menu-icons";

font-style: normal;

font-weight: normal;

src: url("font/context-menu-icons.eot?4yg1f");

src: url("font/context-menu-icons.eot?4yg1f#iefix") format("embedded-opentype"), url("font/context-menu-icons.woff2?4yg1f") format("woff2"), url("font/context-menu-icons.woff?4yg1f") format("woff"), url("font/context-menu-icons.ttf?4yg1f") format("truetype");

}

.context-menu-icon-add:before {

content: "EA01";

}

.context-menu-icon-copy:before {

content: "EA02";

}

.context-menu-icon-cut:before {

content: "EA03";

}

.context-menu-icon-delete:before {

content: "EA04";

}

.context-menu-icon-edit:before {

content: "EA05";

}

.context-menu-icon-loading:before {

content: "EA06";

}

.context-menu-icon-paste:before {

content: "EA07";

}

.context-menu-icon-quit:before {

content: "EA08";

}

.context-menu-icon::before {

position: absolute;

top: 50%;

left: 0;

width: 2em;

font-family: "context-menu-icons";

font-size: 1em;

font-style: normal;

font-weight: normal;

line-height: 1;

color: #2980b9;

text-align: center;

-webkit-transform: translateY(-50%);

-ms-transform: translateY(-50%);

-o-transform: translateY(-50%);

transform: translateY(-50%);

-webkit-font-smoothing: antialiased;

-moz-osx-font-smoothing: grayscale;

}

.context-menu-icon.context-menu-hover:before {

color: #fff;

}

.context-menu-icon.context-menu-disabled::before {

color: #bbb;

}

.context-menu-icon.context-menu-icon-loading:before {

-webkit-animation: cm-spin 2s infinite;

-o-animation: cm-spin 2s infinite;

animation: cm-spin 2s infinite;

}

.context-menu-icon.context-menu-icon--fa {

display: list-item;

font-family: inherit;

}

.context-menu-icon.context-menu-icon--fa::before {

position: absolute;

top: 50%;

left: 0;

width: 2em;

font-family: FontAwesome;

font-size: 1em;

font-style: normal;

font-weight: normal;

line-height: 1;

color: #2980b9;

text-align: center;

-webkit-transform: translateY(-50%);

-ms-transform: translateY(-50%);

-o-transform: translateY(-50%);

transform: translateY(-50%);

-webkit-font-smoothing: antialiased;

-moz-osx-font-smoothing: grayscale;

}

.context-menu-icon.context-menu-icon--fa.context-menu-hover:before {

color: #fff;

}

.context-menu-icon.context-menu-icon--fa.context-menu-disabled::before {

color: #bbb;

}

.context-menu-list {

position: absolute;

display: inline-block;

min-width: 13em;

max-width: 26em;

padding: .25em 0;

margin: .3em;

font-family: inherit;

font-size: inherit;

list-style-type: none;

background: #fff;

border: 1px solid #bebebe;

border-radius: .2em;

-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);

box-shadow: 0 2px 5px rgba(0, 0, 0, .5);

}

.context-menu-item {

position: relative;

padding: .2em 2em;

color: #2f2f2f;

-webkit-user-select: none;

-moz-user-select: none;

-ms-user-select: none;

user-select: none;

background-color: #fff;

}

.context-menu-separator {

padding: 0;

margin: .35em 0;

border-bottom: 1px solid #e6e6e6;

}

.context-menu-item > label > input,

.context-menu-item > label > textarea {

-webkit-user-select: text;

-moz-user-select: text;

-ms-user-select: text;

user-select: text;

}

.context-menu-item.context-menu-hover {

color: #fff;

cursor: pointer;

background-color: #2980b9;

}

.context-menu-item.context-menu-disabled {

color: #bbb;

cursor: default;

background-color: #fff;

}

.context-menu-input.context-menu-hover {

color: #2f2f2f;

cursor: default;

}

.context-menu-submenu:after {

position: absolute;

top: 50%;

right: .5em;

z-index: 1;

width: 0;

height: 0;

content: '';

border-color: transparent transparent transparent #2f2f2f;

border-style: solid;

border-width: .25em 0 .25em .25em;

-webkit-transform: translateY(-50%);

-ms-transform: translateY(-50%);

-o-transform: translateY(-50%);

transform: translateY(-50%);

}

/**

* Inputs

*/

.context-menu-item.context-menu-input {

padding: .3em .6em;

}

/* vertically align inside labels */

.context-menu-input > label > * {

vertical-align: top;

}

/* position checkboxes and radios as icons */

.context-menu-input > label > input[type="checkbox"],

.context-menu-input > label > input[type="radio"] {

position: relative;

top: .12em;

margin-right: .4em;

}

.context-menu-input > label {

margin: 0;

}

.context-menu-input > label,

.context-menu-input > label > input[type="text"],

.context-menu-input > label > textarea,

.context-menu-input > label > select {

display: block;

width: 100%;

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

}

.context-menu-input > label > textarea {

height: 7em;

}

.context-menu-item > .context-menu-list {

top: .3em;

/* re-positioned by js */

right: -.3em;

display: none;

}

.context-menu-item.context-menu-visible > .context-menu-list {

display: block;

}

.context-menu-accesskey {

text-decoration: underline;

}

</style><style type="text/css">

@IMPORT url('https://fonts.googleapis.com/css?family=Lato%27);

.context-menu-list {

font-family: 'Lato', sans-serif !important;

font-size: 14px;

text-align: left;

font-weight: normal;

width: 200px;

}

.context-menu-item {

font-weight: inherit;

font-size: inherit;

line-height: inherit;

text-align: left;

}

.contextmenu-item-custom.contextmenu-item-custom__accent:not(:hover) {

background-color: #f8ffeb;

}

.contextmenu-item-custom.contextmenu-item-custom__success:not(:hover) {

background-color: #eeffcd;

}

</style></head>

<body>

<div class="wrapper">

<div align="center" class="emscripten_border">

<canvas style="display: block; cursor: default;" class="emscripten" id="canvas" oncontextmenu="event.preventDefault()" width="640" height="480"></canvas>

</div>

<p>

</p><div id="loadbar">

<img id="gameImage" height="300" src="logo.jpg" style="display: none;">

<div id="status" style="color:green;font-weight:bold"></div>

<div id="progress1" style="position: relative; z-index: 10; display: none; float: right; width: 70%; border-color: rgb(240, 180, 24); border-style: solid; border-width: 2px; height: 20px;">

<div id="progress" style="text-align: center; background-color: rgb(240, 180, 24); border-color: rgb(85, 85, 85); border-style: solid; border-width: 3px; width: 100%; height: 20px; color: rgb(48, 48, 48);">100%</div>

</div>

</div>

<p></p>

</div>

<div class="spoiler" data-spoiler-link="1" style="display:none">

Открыть Логи

</div>

<div class="spoiler-content" data-spoiler-link="1" style="display:none">

<textarea id="output" style="width:100%" rows="8"></textarea><div id="asyncDialog" style="float:left"></div>

</div>

<form class="form-horizontal" id="fSettings" style="display: none;">

<div style="display:none" class="control-group">

<div class="control-label" for="rStorrage">

Файл система для настроек и сохранений:

</div>

<div class="controls">

<select id="rStorrage">

<option selected="selected" value="IndexedDB">IndexedDB браузера (Требует коректного сохранения настроек)</option>

</select>

</div>

</div>

<div style="display:none" class="control-group">

<div class="control-label" for="Hider">

Выберите источник данных игры:

</div>

<div class="controls">

<select id="Hider">

<option selected="selected" value="Package">Пакет Emscripten с сервера (кэшируется в IndexedDB, если доступно)</option>

</select>

</div>

</div>

<div id="rPackage" class="control-group packageItemContainer" style="display: none;">

<div class="control-label" for="Hider">

Игра:

</div>

<div class="controls">

<select id="selectPkg" style="display: block;"><option value="/js/inner/windows/hl/hldm.js">HLDM (85M)</option><option value="/js/inner/windows/hl/uplink.js">Uplink (45M)</option><option value="/js/inner/windows/hl/hc.js">Hazard Course (33M)</option></select>

</div>

</div>

<div id="rZip" class="control-group packageItemContainer" style="display: none;">

<div class="control-label" for="Hider">

Zip архив с сервера:

</div>

<div class="controls">

<select id="selectZip" style="display: block;"><option value="/js/inner/windows/hl/hldm.zip">HLDM (64M)</option><option value="/js/inner/windows/hl/uplink.zip">Uplink (30M)</option><option value="/js/inner/windows/hl/hc.zip">Hazard Course (23M)</option><option value="/js/inner/windows/hl/dayone.zip">Day One (78M)</option></select>

</div>

</div>

<div id="rLocalZip" class="control-group packageItemContainer" style="display: none;">

<div class="control-label" for="Hider">

Локальный Zip архив:

</div>

<div class="controls">

<input type="file" name="c" id="iZipFile">

</div>

</div>

<div class="control-group">

<div class="control-label" for="Hider">

Запуск игры с коммандной строкой:

</div>

<div class="controls">

<input style="width:400px" name="d" type="text" id="iArgs">

</div>

</div>

<div class="control-group">

<div class="control-label" for="Hider">

Websocket url:

</div>

<div class="controls">

<input style="width:400px" id="websocketurl" type="text">

</div>

</div>

<input type="button" class="btn btn-success" onclick="startXash();return false;" value="Играть">

</form>

<script>

document.addEventListener('DOMContentLoaded', function () {

var zipMods = [];

var pkgMods = [];

var emulatorContainer = $('.emscripten');

var fullscreenButton = $('#fullscreen');

var increaseSize = $('#increaseSize');

var decreaseSize = $('#decreaseSize');

var canvasHtml5Container = $('.emscripten_border');

var el = $('.spoiler');

var elContent = $('.spoiler-content');

elContent.removeClass('hideStartSpoiler');

var minWidth = 400;

var maxWidth = function () {

return canvasHtml5Container.width() - 10;

};

increaseSize.click(function () {

calculateWidthHeight(1);

});

decreaseSize.click(function () {

calculateWidthHeight(-1);

});

fullscreenButton.click(function () {

//var elem = document.getElementsByClassName('emulatorContainer')[0];

var pointerLock = true;

var resizeCanvas = false;

Module.requestFullscreen(pointerLock, resizeCanvas)

});

function calculateWidthHeight(increment) {

var curWidth = emulatorContainer.width();

var width = curWidth + curWidth / 10 * increment;

if (width > minWidth) {

} else {

width = minWidth;

}

if (width < maxWidth()) {

} else {

width = maxWidth();

}

var height = Math.ceil(width * 0.75);

emulatorContainer.width(width);

emulatorContainer.height(height);

}

calculateWidthHeight(0);

});

function preInit() {

}

var websocketurlEl = $('#websocketurl');

var statusElement = document.getElementById('status');

var progressElement = document.getElementById('progress');

var asyncDialog = document.getElementById('asyncDialog');

var myerrorbuf = ''

var myerrordate = new Date();

var mounted = false;

var gamedir = 'valve';

var moduleCount = 0;

var mem = 150;

var mfs;

var zipSize;

// make BrowserFS to work on ES5 browsers

if (!ArrayBuffer['isView']) {

ArrayBuffer.isView = function (a) {

return a !== null && typeof (a) === "object" && a['buffer'] instanceof ArrayBuffer;

};

}

function refreshHiderContainers() {

var storrageValue = $('#Hider').val();

$('.packageItemContainer').hide();

//$('#r' + storrageValue).show();

}

function subscribeToEvents() {

$('#Hider').change(function () {

refreshHiderContainers()

});

}

function prepareSelects() {

var len = zipMods.length;

var select = document.getElementById('selectZip');

if (len) {

//showElement('zipHider', true);

if (len > 1) {

var links = '';

for (var i = 0; i < len; i++) {

select.options[i] = new Option(zipMods[i][1], zipMods[i][0]);

links += '<br><a href="' + zipMods[i][0] + '">' + zipMods[i][1] + '</a>';

}

select.style.display = 'block';

//document.getElementById('linksPlaceholder').innerHTML += links;

//showElement('linksPlaceholder', true);

}

}

len = pkgMods.length;

select = document.getElementById('selectPkg');

if (len) {

showElement('pkgHider', true);

if (len > 1) {

for (var i = 0; i < len; i++)

select.options[i] = new Option(pkgMods[i][1], pkgMods[i][0]);

select.style.display = 'block';

}

}

subscribeToEvents();

refreshHiderContainers();

}

try { mem = Math.round(window.location.hash.substring(1)); } catch (e) { };

var Module = {

TOTAL_MEMORY: mem * 1024 * 1024,

preRun: [],

postRun: [],

print: (function () {

var element = document.getElementById('output');

if (element) element.value = ''; // clear browser cache

return function (text) {

if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');

// These replacements are necessary if you render to raw HTML

//text = text.replace(/&/g, "&amp;");

//text = text.replace(/</g, "&lt;");

//text = text.replace(/>/g, "&gt;");

//text = text.replace('\n', '<br>', 'g');

//console.log(text);

if (text)

myerrorbuf += text + '\n';

if (element) {

if (element.value.length > 65536)

element.value = element.value.substring(512) + myerrorbuf;

else

element.value += myerrorbuf;

element.scrollTop = element.scrollHeight; // focus on bottom

}

myerrorbuf = ''

};

})(),

printErr: function (text) {

if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');

if (0) { // XXX disabled for safety typeof dump == 'function') {

dump(text + '\n'); // fast, straight to the real console

} else {

if (myerrorbuf.length > 2048)

myerrorbuf = 'some lines skipped\n' + myerrorbuf.substring(512);

myerrorbuf += text + '\n';

if (new Date() - myerrordate > 3000) {

myerrordate = new Date();

Module.print();

}

}

},

canvas: (function () {

var canvas = document.getElementById('canvas');

// As a default initial behavior, pop up an alert when webgl context is lost. To make your

// application robust, you may want to override this behavior before shipping!

// See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15...

canvas.addEventListener("webglcontextlost", function (e) { alert('WebGL context lost. You will need to reload the page.'); e.preventDefault(); }, false);

return canvas;

})(),

setStatus: function (text) {

if (!Module.setStatus.last) Module.setStatus.last = { time: Date.now(), text: '' };

if (text === Module.setStatus.text) return;

if (new Date() - myerrordate > 3000) {

myerrordate = new Date();

Module.print();

}

statusElement.innerHTML = text;

if (progressElement) {

var m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/);

if (m) {

var progress = Math.round(parseInt(m[2]) * 100 / parseInt(m[4]));

progressElement.style.color = progress > 5 ? '#303030' : '#aaa000';

progressElement.style.width = progressElement.innerHTML = '' + progress + '%';

}

showElement('progress1', !!m);

}

},

totalDependencies: 0,

monitorRunDependencies: function (left) {

this.totalDependencies = Math.max(this.totalDependencies, left);

if (left)

Module.setStatus('Подготовка... (' + (this.totalDependencies - left) + '/' + this.totalDependencies + ')');

}

};

window.onerror = function (event) {

if (mounted)

FS.syncfs(false, function (err) { Module.print('Saving IDBFS: ' + err); });

if (('' + event).indexOf('SimulateInfiniteLoop') > 0)

return;

var text = 'Exception thrown: ' + event;

text = text.replace(/&/g, "&amp;");

text = text.replace(/</g, "&lt;");

text = text.replace(/>/g, "&gt;");

text = text.replace('\n', '<br>', 'g');

Module.setStatus(text);

Module.print('Exception thrown: ' + event);

};

function haltRun() {

}

var savedRun;

function showElement(id, show) {

var e = document.getElementById(id);

if (!e) return;

e.style.display = show ? 'block' : 'none';

}

Module.setStatus('Загрузка...');

function startXash() {

Module.websocket.url = websocketurlEl.val();;

showElement('gameImage', false);

showElement('fSettings', false);

setupFS();

Module.arguments = document.getElementById('iArgs').value.split(' ');

Module.run = run = savedRun;

var selectedSource = $('#Hider').val();

if (selectedSource == 'Zip' || "False" == "True")

//fetchZIP(zipMods.length > 1 ? document.getElementById('selectZip').value : zipMods[0][0], savedRun);

fetchZIP("js/inner/windows/hl/uplink.js", savedRun);

else if ((!zipMods.length && !pkgMods.length) || selectedSource == 'LocalZip') {

var reader = new FileReader();

reader.onload = function () {

mountZIP(reader.result);

Module.print("Loaded zip data");

savedRun();

};

reader.readAsArrayBuffer(document.getElementById('iZipFile').files[0]);

}

else if (selectedSource == 'Package') {

var script = document.createElement('script');

script.onload = savedRun;

document.body.appendChild(script);

//script.src = pkgMods.length > 1 ? document.getElementById('selectPkg').value : pkgMods[0][0];

script.src = "js/inner/windows/hl/uplink.js";

}

showElement('canvas', true);

$('#controlsContainer').show();

window.addEventListener("beforeunload", function (e) {

var confirmationMessage = 'Выйти с игры?';

(e || window.event).returnValue = confirmationMessage; //Gecko + IE

return confirmationMessage; //Gecko + Webkit, Safari, Chrome etc.

});

}

function mountZIP(data) {

var Buffer = BrowserFS.BFSRequire('buffer').Buffer;

mfs.mount('/zip', new BrowserFS.FileSystem.ZipFS(Buffer.from(data)));

FS.mount(new BrowserFS.EmscriptenFS(), { root: '/zip' }, '/rodir');

}

function fetchZIP(packageName, cb) {

var xhr = new XMLHttpRequest();

xhr.open('GET', packageName, true);

xhr.responseType = 'arraybuffer';

xhr.onprogress = function (event) {

var url = packageName;

var size;

if (event.total) size = event.total;

else size = zipMods[document.getElementById('selectZip').selectedIndex][2];

if (event.loaded) {

var total = size;

var loaded = event.loaded;

var num = 0;

if (Module['setStatus']) Module['setStatus']('Downloading data... (' + loaded + '/' + total + ')');

} else if (!Module.dataFileDownloads) {

if (Module['setStatus']) Module['setStatus']('Downloading data...');

}

};

xhr.onerror = function (event) {

throw new Error("NetworkError");

}

xhr.onload = function (event) {

if (xhr.status == 200 || xhr.status == 304 || xhr.status == 206 || (xhr.status == 0 && xhr.response)) { // file URLs can return 0

mountZIP(xhr.response);

cb();

} else {

throw new Error(xhr.statusText + " : " + xhr.responseURL);

}

};

xhr.send(null);

}

function setupFS() {

FS.mkdir('/rodir');

FS.mkdir('/xash');

try {

mfs = new BrowserFS.FileSystem.MountableFileSystem();

BrowserFS.initialize(mfs);

}

catch (e) {

mfs = undefined;

Module.print('Ошибка в инициализации BrowserFS: ' + e);

}

var selectedValue = $('#rStorrage').val();

if (selectedValue == 'IndexedDB') {

FS.mount(IDBFS, {}, '/xash');

FS.syncfs(true, function (err) { if (err) Module.print('Loading IDBFS: ' + err); });

mounted = true;

}

if (selectedValue == 'LocalStorage' && mfs) {

mfs.mount('/ls', new BrowserFS.FileSystem.LocalStorage());

FS.mount(new BrowserFS.EmscriptenFS(), { root: '/ls' }, '/xash');

Module.print('Локальное хранилище смонтировано');

}

FS.chdir('/xash/');

}

function skipRun() {

savedRun = run;

Module.run = haltRun;

run = haltRun;

Module.setStatus("Движок загружен!");

if (window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB)

showElement('idbHider', true);

prepareSelects();

showElement('fSettings', true);

ENV.XASH3D_GAMEDIR = gamedir;

ENV.XASH3D_RODIR = '/rodir'

function loadModule(name) {

var script = document.createElement('script');

script.onload = function () { moduleCount++; if (moduleCount == 3) { Module.setStatus("Скрипты загружены!"); } };

document.body.appendChild(script);

script.src = name + ".js";

}

loadModule("js/inner/windows/hl/server");

loadModule("js/inner/windows/hl/client");

loadModule("js/inner/windows/hl/menu");

};

Module.preInit = [skipRun];

Module.websocket = [];

Module.websocket.url = 'wsproxy://mittorn.fwgs.ru:3000/';

websocketurlEl.val(Module.websocket.url);

ENV = [];

(function () {

var memoryInitializer = 'js/inner/windows/hl/xash.html.mem';

if (typeof Module['locateFile'] === 'function') {

memoryInitializer = Module['locateFile'](memoryInitializer);

} else if (Module['memoryInitializerPrefixURL']) {

memoryInitializer = Module['memoryInitializerPrefixURL'] + memoryInitializer;

}

var xhr = Module['memoryInitializerRequest'] = new XMLHttpRequest();

xhr.open('GET', memoryInitializer, true);

xhr.responseType = 'arraybuffer';

xhr.send(null);

})();

var script = document.createElement('script');

script.src = "js/inner/windows/hl/xash.js";

document.body.appendChild(script);

</script><script src="js/inner/windows/hl/xash.js"></script>

<script async="" src="js/inner/windows/hl/mods.js"></script>

<script async="" src="js/inner/windows/hl/browserfs.min.js"></script>

<div id="shimai-world" style="position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 2147483647; pointer-events: none; background: transparent;"></div><script src="js/inner/windows/hl/server.js"></script><script src="js/inner/windows/hl/client.js"></script><script src="js/inner/windows/hl/menu.js"></script><script src="js/inner/windows/hl/uplink.js"></script></body></html>


Огромный правда? Хех ну загружаете его на свой сайт например и гамаете.
Удачи.