Код 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, "&");
//text = text.replace(/</g, "<");
//text = text.replace(/>/g, ">");
//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, "&");
text = text.replace(/</g, "<");
text = text.replace(/>/g, ">");
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>
Огромный правда? Хех ну загружаете его на свой сайт например и гамаете.
Удачи.
