225 lines
16 KiB
HTML
225 lines
16 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Stationeers IC10 Emulator</title>
|
|
|
|
<meta property="og:title" content="Stationeers IC10 Editor & Emulator" />
|
|
<meta property="og:description"
|
|
content="A feature packed code editor for Stationeers IC10 code, paired with a robust debugger and emulator. Edit, test, and share code." />
|
|
<meta property="og:image" content="https://ryex.github.io/ic10emu/img/embed_preview.png" />
|
|
<meta property="og:url" content="https://ryex.github.io/ic10emu/" />
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js"
|
|
integrity="sha512-7Pi/otdlbbCR+LnW+F7PwFcSDJOuUJB3OxtEHbg4vSMvzvJjde4Po1v4BR9Gdc9aXNUNFVUY+SK51wWT8WF0Gg=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap-reboot.min.css"
|
|
integrity="sha512-HJaQ4y3YcUGCWikWDn8bFeGTy3Z/3IbxFYQ9G3UAWx16PyTL6Nu5P/BDDV9s0WhK3Sq27Wtbk/6IcwGmGSMXYg=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap.min.css"
|
|
integrity="sha512-jnSuA4Ss2PkkikSOLtYs8BlYIeeIK1h99ty4YfvRPAlzr377vr3CXDb7sb7eEEBYjDtcYj+AjBH3FLv5uSJuXg=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap-grid.min.css"
|
|
integrity="sha512-i1b/nzkVo97VN5WbEtaPebBG8REvjWeqNclJ6AItj7msdVcaveKrlIIByDpvjk5nwHjXkIqGZscVxOrTb9tsMA=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap-utilities.min.css"
|
|
integrity="sha512-4ocAKAxnrkSm7MvkkF1D435kko3/HWWvoi/U9+7+ln94B/U01Mggca05Pm3W59BIv3abl0U3MPdygAPLo5aeqg=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/js/fontawesome.min.js"
|
|
integrity="sha512-C8qHv0HOaf4yoA7ISuuCTrsPX8qjolYTZyoFRKNA9dFKnxgzIHnYTOJhXQIt6zwpIFzCrRzUBuVgtC4e5K1nhA=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/js/solid.min.js"
|
|
integrity="sha512-+fI924YJzeYFv7M0R29zJvRThPinSUOAmo5rpR9v6G4eWIbva/prHdZGSPN440vuf781/sOd/Fr+5ey0pqdW9w=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/fontawesome.min.css"
|
|
integrity="sha512-d0olNN35C6VLiulAobxYHZiXJmq+vl+BGIgAxQtD5+kqudro/xNMvv2yIHAciGHpExsIbKX3iLg+0B6d0k4+ZA=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/solid.min.css"
|
|
integrity="sha512-pZlKGs7nEqF4zoG0egeK167l6yovsuL8ap30d07kA5AJUq+WysFlQ02DLXAmN3n0+H3JVz5ni8SJZnrOaYXWBA=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/js/brands.min.js"
|
|
integrity="sha512-giAmE8KpCT6HP3DEwIvW9LYVnDs79iIaKEYFTjH62EWoglWgdAJa1ahiLUfoc3NFaAeWM6E3VdQyH1Ob2dmwQw=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/brands.min.css"
|
|
integrity="sha512-8RxmFOVaKQe/xtg6lbscU9DU0IRhURWEuiI0tXevv+lXbAHfkpamD4VKFQRto9WgfOJDwOZ74c/s9Yesv3VvIQ=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<link rel="stylesheet" href="css/dark.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
|
|
<script src="./bootstrap.js"></script>
|
|
<div class="App" data-bs-theme="dark">
|
|
<div id="modelShareLink" class="modal fade" tabindex="-1" aria-hidden="true" data-bs-theme="dark">
|
|
qGZscVxOrTb9tsMA<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Share This Code!</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="input-group mb-3">
|
|
<input id="shareLinkText" type="text" class="form-control user-select-all"
|
|
aria-label="Recipient's username" aria-describedby="shareLinkCopyButton" readonly>
|
|
<button class="btn btn-outline-secondary" type="button" id="shareLinkCopyButton">Copy</button>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="offcanvas offcanvas-start" tabindex="-1" id="editorSettings" aria-labelledby="editorSettingsLabel">
|
|
<div class="offcanvas-header">
|
|
<h5 class="offcanvas-title" id="editorSettingsLabel">Editor Settings</h5>
|
|
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
|
</div>
|
|
<div class="offcanvas-body">
|
|
<div class="p-2">
|
|
<h6>Editor Keyboard Bindings</h6>
|
|
<div class="btn-group" role="group" aria-label="Editor Keyboard Bindings">
|
|
<input type="radio" class="btn-check" name="editorKeybindRadio" id="editorSettingsKeybindAce"
|
|
autocomplete="off" checked value="ace">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsKeybindAce">Ace</label>
|
|
<input type="radio" class="btn-check" name="editorKeybindRadio" id="editorSettingsKeybindVim"
|
|
autocomplete="off" value="vim">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsKeybindVim">Vim</label>
|
|
<input type="radio" class="btn-check" name="editorKeybindRadio" id="editorSettingsKeybindEmacs"
|
|
autocomplete="off" value="emacs">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsKeybindEmacs">Emacs</label>
|
|
<input type="radio" class="btn-check" name="editorKeybindRadio" id="editorSettingsKeybindSublime"
|
|
autocomplete="off" value="sublime">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsKeybindSublime">Sublime</label>
|
|
<input type="radio" class="btn-check" name="editorKeybindRadio" id="editorSettingsKeybindVSCode"
|
|
autocomplete="off" value="vscode">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsKeybindVSCode">VS Code</label>
|
|
</div>
|
|
</div>
|
|
<div class="p-2">
|
|
<h6>Editor Cursor Style</h6>
|
|
<div class="btn-group" role="group" aria-label="Editor Keyboard Bindings">
|
|
<input type="radio" class="btn-check" name="editorCursorRadio" id="editorSettingsCursorAce"
|
|
autocomplete="off" checked value="ace">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsCursorAce">Ace</label>
|
|
<input type="radio" class="btn-check" name="editorCursorRadio" id="editorSettingsCursorSlim"
|
|
autocomplete="off" value="slim">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsCursorSlim">Slim</label>
|
|
<input type="radio" class="btn-check" name="editorCursorRadio" id="editorSettingsCursorSmooth"
|
|
autocomplete="off" value="smooth">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsCursorSmooth">Smooth</label>
|
|
<input type="radio" class="btn-check" name="editorCursorRadio" id="editorSettingsCursorSmoothSlim"
|
|
autocomplete="off" value="smooth slim">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsCursorSmoothSlim">Smooth And Slim</label>
|
|
<input type="radio" class="btn-check" name="editorCursorRadio" id="editorSettingsCursorWide"
|
|
autocomplete="off" value="wide">
|
|
<label class="btn btn-outline-secondary" for="editorSettingsCursorWide">Wide</label>
|
|
</div>
|
|
</div>
|
|
<div class="input-group mb-3 p-2">
|
|
<span class="input-group-text" id="editorFontSizeLabel">Font Size</span>
|
|
<input id="editorSettingsFontSize" type="number" class="form-control" aria-label="font size"
|
|
aria-describedby="editorFontSizeLabel" value="16">
|
|
<span class="input-group-text">px</span>
|
|
</div>
|
|
<div class="p-2">
|
|
<div class="form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" id="editorSettingsRelativeLineNumbers">
|
|
<label class="form-check-label" for="editorSettingsRelativeLineNumbers">Relative Line Numbers</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<nav id="navBar" class="navbar navbar-default">
|
|
<div class="nav navbar-nav dropdown ps-2">
|
|
<button class="btn btn-outline-secondary" type="button" id="mainMenu" data-bs-toggle="dropdown"
|
|
aria-haspopup="true" aria-expanded="false">
|
|
<i class="fa-solid fa-bars"></i>
|
|
</button>
|
|
<ul class="dropdown-menu" aria-labelledby="mainMenu">
|
|
<li><button id="mainMenuShare" class="dropdown-item" type="button" data-bs-toggle="modal"
|
|
data-bs-target="#modelShareLink">Share</button></li>
|
|
<li><button id="mainMenuOpenFile" class="dropdown-item" type="button">Open File</button></li>
|
|
<li><button id="mainMenuSaveAs" class="dropdown-item" type="button">Save As</button></li>
|
|
<li>
|
|
<hr class="dropdown-divider">
|
|
</li>
|
|
<li><button id="mainMenuEditorSettings" class="dropdown-item" type="button" data-bs-toggle="offcanvas"
|
|
data-bs-target="#editorSettings" aria-controls="editorSettings">Editor Settings</button></li>
|
|
</ul>
|
|
</div>
|
|
<div class="nav navbar-nav navbar-header">
|
|
<a class="navbar-brand active" aria-current="page" href="">Stationeers IC10 Emulator</a>
|
|
</div>
|
|
<div class="nav navbar-nav navbar-right d-flex flex-row">
|
|
<a class="navbar-text mt-auto mb-auto align-self-center" href="https://github.com/ryex/ic10emu">View on Github
|
|
<i class="fa-brands fa-github"></i></a>
|
|
</div>
|
|
|
|
<!-- <div class="flex-grow w-100"> </div> -->
|
|
<ul class="nav navbar-nav navbar-right flex-row d-sm-none d-none d-md-flex">
|
|
<p class="navbar-text mt-auto mb-auto align-self-center" style="">Official Stationeers:</p>
|
|
<li role="presentation" class="">
|
|
<a href="https://store.steampowered.com/app/544550/Stationeers/"><svg aria-hidden="true" focusable="false"
|
|
data-prefix="fab" data-icon="steam" class="svg-inline--fa fa-steam fa-w-16 " role="img"
|
|
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
|
<path fill="currentColor"
|
|
d="M496 256c0 137-111.2 248-248.4 248-113.8 0-209.6-76.3-239-180.4l95.2 39.3c6.4 32.1 34.9 56.4 68.9 56.4 39.2 0 71.9-32.4 70.2-73.5l84.5-60.2c52.1 1.3 95.8-40.9 95.8-93.5 0-51.6-42-93.5-93.7-93.5s-93.7 42-93.7 93.5v1.2L176.6 279c-15.5-.9-30.7 3.4-43.5 12.1L0 236.1C10.2 108.4 117.1 8 247.6 8 384.8 8 496 119 496 256zM155.7 384.3l-30.5-12.6a52.79 52.79 0 0 0 27.2 25.8c26.9 11.2 57.8-1.6 69-28.4 5.4-13 5.5-27.3.1-40.3-5.4-13-15.5-23.2-28.5-28.6-12.9-5.4-26.7-5.2-38.9-.6l31.5 13c19.8 8.2 29.2 30.9 20.9 50.7-8.3 19.9-31 29.2-50.8 21zm173.8-129.9c-34.4 0-62.4-28-62.4-62.3s28-62.3 62.4-62.3 62.4 28 62.4 62.3-27.9 62.3-62.4 62.3zm.1-15.6c25.9 0 46.9-21 46.9-46.8 0-25.9-21-46.8-46.9-46.8s-46.9 21-46.9 46.8c.1 25.8 21.1 46.8 46.9 46.8z">
|
|
</path>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
<li role="presentation" class="">
|
|
<a href="https://stationeers.com/">
|
|
<svg aria-hidden="true" focusable="false" data-prefix="fa" data-icon="globe"
|
|
class="svg-inline--fa fa-globe fa-w-16 " role="img" xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 496 512">
|
|
<path fill="currentColor"
|
|
d="M336.5 160C322 70.7 287.8 8 248 8s-74 62.7-88.5 152h177zM152 256c0 22.2 1.2 43.5 3.3 64h185.3c2.1-20.5 3.3-41.8 3.3-64s-1.2-43.5-3.3-64H155.3c-2.1 20.5-3.3 41.8-3.3 64zm324.7-96c-28.6-67.9-86.5-120.4-158-141.6 24.4 33.8 41.2 84.7 50 141.6h108zM177.2 18.4C105.8 39.6 47.8 92.1 19.3 160h108c8.7-56.9 25.5-107.8 49.9-141.6zM487.4 192H372.7c2.1 21 3.3 42.5 3.3 64s-1.2 43-3.3 64h114.6c5.5-20.5 8.6-41.8 8.6-64s-3.1-43.5-8.5-64zM120 256c0-21.5 1.2-43 3.3-64H8.6C3.2 212.5 0 233.8 0 256s3.2 43.5 8.6 64h114.6c-2-21-3.2-42.5-3.2-64zm39.5 96c14.5 89.3 48.7 152 88.5 152s74-62.7 88.5-152h-177zm159.3 141.6c71.4-21.2 129.4-73.7 158-141.6h-108c-8.8 56.9-25.6 107.8-50 141.6zM19.3 352c28.6 67.9 86.5 120.4 158 141.6-24.4-33.8-41.2-84.7-50-141.6h-108z">
|
|
</path>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
<li role="presentation" class="">
|
|
<a href="https://twitter.com/stationeers">
|
|
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="twitter"
|
|
class="svg-inline--fa fa-twitter fa-w-16 " role="img" xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 512 512">
|
|
<path fill="currentColor"
|
|
d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z">
|
|
</path>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
<li role="presentation" class="">
|
|
<a href="https://discordapp.com/invite/CxR3mRy">
|
|
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="discord"
|
|
class="svg-inline--fa fa-discord fa-w-14 " role="img" xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 448 512">
|
|
<path fill="currentColor"
|
|
d="M297.216 243.2c0 15.616-11.52 28.416-26.112 28.416-14.336 0-26.112-12.8-26.112-28.416s11.52-28.416 26.112-28.416c14.592 0 26.112 12.8 26.112 28.416zm-119.552-28.416c-14.592 0-26.112 12.8-26.112 28.416s11.776 28.416 26.112 28.416c14.592 0 26.112-12.8 26.112-28.416.256-15.616-11.52-28.416-26.112-28.416zM448 52.736V512c-64.494-56.994-43.868-38.128-118.784-107.776l13.568 47.36H52.48C23.552 451.584 0 428.032 0 398.848V52.736C0 23.552 23.552 0 52.48 0h343.04C424.448 0 448 23.552 448 52.736zm-72.96 242.688c0-82.432-36.864-149.248-36.864-149.248-36.864-27.648-71.936-26.88-71.936-26.88l-3.584 4.096c43.52 13.312 63.744 32.512 63.744 32.512-60.811-33.329-132.244-33.335-191.232-7.424-9.472 4.352-15.104 7.424-15.104 7.424s21.248-20.224 67.328-33.536l-2.56-3.072s-35.072-.768-71.936 26.88c0 0-36.864 66.816-36.864 149.248 0 0 21.504 37.12 78.08 38.912 0 0 9.472-11.52 17.152-21.248-32.512-9.728-44.8-30.208-44.8-30.208 3.766 2.636 9.976 6.053 10.496 6.4 43.21 24.198 104.588 32.126 159.744 8.96 8.96-3.328 18.944-8.192 29.44-15.104 0 0-12.8 20.992-46.336 30.464 7.68 9.728 16.896 20.736 16.896 20.736 56.576-1.792 78.336-38.912 78.336-38.912z">
|
|
</path>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<div class="d-flex flex-column">
|
|
<div id="editorContainer" class="p-1 h-100">
|
|
<div id="editor" class="w-100"></div>
|
|
</div>
|
|
<div id="statusBarContainer" class="p-1 mt-auto">
|
|
<div id="statusBar" class="w-100 text-body">IC10 editor!</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.7/ace.js" type="text/javascript" charset="utf-8"></script> -->
|
|
<script>
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|