<commit_before><!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>

<title>MiniASM</title>

<style>
.grid {
    margin: 1em auto;
    border-collapse: collapse;
}

.grid td {
    cursor: pointer;
    width:  10px;
    height: 10px;
    border: 0.5px solid #fff;
    text-align: center;
    font-family: "Lucida Console", Monaco, monospace;
    font-size: 13px;
}

.grid td.clicked {
    background-color: yellow;
    font-weight: bold;
    color: red;
}

textarea {
    resize: none;
    font-family: "Lucida Console", Monaco, monospace;
}

label {
    resize: none;
    font-family: "Lucida Console", Monaco, monospace !important;
}

.fa-refresh {
    cursor: pointer;
}

.div-inline {
    display: inline-block;
}
</style>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/font-awesome-animation.min.css">
</head>

<body>
<div class="container">
    <h1>MiniASM Sandbox</h1>
    <div class="row">
        <div class="col-lg-6" id="ram"></div>
        <div class="col-lg-6">
            <h3>Register File</h3>

            <div id="regs">
            </div>

            <div class="row">
                <div class="col-xs-3" id="regs_col_0"></div>
                <div class="col-xs-3" id="regs_col_1"></div>
                <div class="col-xs-3" id="regs_col_2"></div>
                <div class="col-xs-3" id="regs_col_3"></div>
            </div>

            <h3>Selected Memory Cell</h3>
            <label style="font:13px Lucida Console;"><b>address:</b></label>
            <label id="mem-addr" style="font:13px Lucida Console;">0</label>
            <i class="fa fa-circle" style="color:blue"></i><br />
            <label style="font:13px Lucida Console;"><b>value:&nbsp;&nbsp;</b></label>
            <label id="mem-val" style="font:13px Lucida Console;">0</label><br />

            <br />

            <ul id="bottom-pane" class="nav nav-tabs">
                <li class="active">
                    <a href = "#code-tab" data-toggle="tab">
                        Code
                    </a>
                </li>

                <li>
                    <a href = "#io" data-toggle="tab">
                        I/O
                    </a>
                </li>

                <li>
                    <a href = "#compiler" data-toggle="tab">
                        Compiler
                    </a>
                </li>

                <li>
                    <a href = "#about" data-toggle="tab">
                        About
                    </a>
                </li>
            </ul>

            <div id = "bottom-pane-content" class = "tab-content">
                <div class="tab-pane fade in active" id="code-tab">
                    <h3>Program Code</h3>
                    <textarea rows="4" cols="50" id="code" placeholder="Paste code string here."></textarea><br />
                    <button onclick="loadInput();">load</button>
                    <button onclick="execInput();">execute</button>
                    <button onclick="stepInput();">step</button>
                    <button id="pause-button" onclick="togglePaused();">pause</button>
                    <br />
                    <br />
                    <div id="message"></div>
                </div>

                <div class="tab-pane fade" id="io">
                    <b>Standard Out&nbsp;&nbsp;</b><i class="fa fa-refresh faa-spin animated-hover" onclick="stdoutReset();"></i><br />
                    <label id="stdout" style="font:13px Lucida Console;"></label><br />
                    <br />
                    <b>Standard In&nbsp;&nbsp;</b><i class="fa fa-refresh faa-spin animated-hover" onclick="stdinReset();"></i><br />
                    <textarea rows="2" cols="50" id="stdin"></textarea><br />
                </div>

                <div class="tab-pane fade" id="compiler">
                    <h3>Compiler</h3>
                    <textarea rows="4" cols="50" id="source"></textarea><br />
                    <button onclick="compileSource();">compile</button>
                    <button onclick="pasteCompiled();">paste to program</button>
                    <div class="dropdown div-inline">
                        <button class="btn btn-default dropdown-toggle btn-sm" type="button" id="menu1" data-toggle="dropdown">sample programs<span class="caret"></span></button>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onclick="loadSampleProgram(1);">factorial</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onclick="loadSampleProgram(2);">string reversal</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onclick="loadSampleProgram(3);">functions</a></li>
                        </ul>
                    </div>
                    <br />
                    <br />
                    <div id="compilerMessage"></div>
                </div>

                <div class="tab-pane fade" id="about">
                    <p>MiniASM &ndash; a tool for teaching low-level programming concepts</p>
                    <p><a href="mini-asm-spec.pdf" target="_blank">MiniASM Specification</a> (Version: 0.0.1)</p>
                    <p>Copyright &copy; 2017 <a href="http://ars.me" target="_blank"><NAME></a> under <a href="https://opensource.org/licenses/MIT" target="_blank">MIT License</a></p>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="vm.js" type="text/javascript"></script>
<script src="compiler.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
    $("[rel=tooltip]").tooltip({placement: "above"});
});

const ICON_MEM_CELL = '<i class="fa fa-circle-o" style="color:gray" rel="tooltip">&nbsp;</i>';
const ICON_ERROR    = '<i class="fa fa-warning" style="color:red"></i>';
const ICON_SUCCESS  = '<i class="fa fa-check" style="color:green"></i>';
const ICON_PROGRESS = '<i class="fa fa-cog fa-spin"></i>';
const ICON_PAUSED   = '<i class="fa fa-pause-circle"></i>';

const CLASS_FILLED   = "fa fa-circle"
const CLASS_UNFILLED = "fa fa-circle-o"<commit_msg>Update "about" tab<commit_after><!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>

<title>MiniASM</title>

<style>
.grid {
    margin: 1em auto;
    border-collapse: collapse;
}

.grid td {
    cursor: pointer;
    width:  10px;
    height: 10px;
    border: 0.5px solid #fff;
    text-align: center;
    font-family: "Lucida Console", Monaco, monospace;
    font-size: 13px;
}

.grid td.clicked {
    background-color: yellow;
    font-weight: bold;
    color: red;
}

textarea {
    resize: none;
    font-family: "Lucida Console", Monaco, monospace;
}

label {
    resize: none;
    font-family: "Lucida Console", Monaco, monospace !important;
}

.fa-refresh {
    cursor: pointer;
}

.div-inline {
    display: inline-block;
}
</style>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/font-awesome-animation.min.css">
</head>

<body>
<div class="container">
    <h1>MiniASM Sandbox</h1>
    <div class="row">
        <div class="col-lg-6" id="ram"></div>
        <div class="col-lg-6">
            <h3>Register File</h3>

            <div id="regs">
            </div>

            <div class="row">
                <div class="col-xs-3" id="regs_col_0"></div>
                <div class="col-xs-3" id="regs_col_1"></div>
                <div class="col-xs-3" id="regs_col_2"></div>
                <div class="col-xs-3" id="regs_col_3"></div>
            </div>

            <h3>Selected Memory Cell</h3>
            <label style="font:13px Lucida Console;"><b>address:</b></label>
            <label id="mem-addr" style="font:13px Lucida Console;">0</label>
            <i class="fa fa-circle" style="color:blue"></i><br />
            <label style="font:13px Lucida Console;"><b>value:&nbsp;&nbsp;</b></label>
            <label id="mem-val" style="font:13px Lucida Console;">0</label><br />

            <br />

            <ul id="bottom-pane" class="nav nav-tabs">
                <li class="active">
                    <a href = "#code-tab" data-toggle="tab">
                        Code
                    </a>
                </li>

                <li>
                    <a href = "#io" data-toggle="tab">
                        I/O
                    </a>
                </li>

                <li>
                    <a href = "#compiler" data-toggle="tab">
                        Compiler
                    </a>
                </li>

                <li>
                    <a href = "#about" data-toggle="tab">
                        About
                    </a>
                </li>
            </ul>

            <div id = "bottom-pane-content" class = "tab-content">
                <div class="tab-pane fade in active" id="code-tab">
                    <h3>Program Code</h3>
                    <textarea rows="4" cols="50" id="code" placeholder="Paste code string here."></textarea><br />
                    <button onclick="loadInput();">load</button>
                    <button onclick="execInput();">execute</button>
                    <button onclick="stepInput();">step</button>
                    <button id="pause-button" onclick="togglePaused();">pause</button>
                    <br />
                    <br />
                    <div id="message"></div>
                </div>

                <div class="tab-pane fade" id="io">
                    <b>Standard Out&nbsp;&nbsp;</b><i class="fa fa-refresh faa-spin animated-hover" onclick="stdoutReset();"></i><br />
                    <label id="stdout" style="font:13px Lucida Console;"></label><br />
                    <br />
                    <b>Standard In&nbsp;&nbsp;</b><i class="fa fa-refresh faa-spin animated-hover" onclick="stdinReset();"></i><br />
                    <textarea rows="2" cols="50" id="stdin"></textarea><br />
                </div>

                <div class="tab-pane fade" id="compiler">
                    <h3>Compiler</h3>
                    <textarea rows="4" cols="50" id="source"></textarea><br />
                    <button onclick="compileSource();">compile</button>
                    <button onclick="pasteCompiled();">paste to program</button>
                    <div class="dropdown div-inline">
                        <button class="btn btn-default dropdown-toggle btn-sm" type="button" id="menu1" data-toggle="dropdown">sample programs<span class="caret"></span></button>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onclick="loadSampleProgram(1);">factorial</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onclick="loadSampleProgram(2);">string reversal</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onclick="loadSampleProgram(3);">functions</a></li>
                        </ul>
                    </div>
                    <br />
                    <br />
                    <div id="compilerMessage"></div>
                </div>

                <div class="tab-pane fade" id="about">
                    <p>MiniASM &ndash; a tool for teaching low-level programming concepts</p>
                    <p>Source code is available <a href="https://github.com/arshajii/mini-asm">on GitHub</a>.</p>
                    <p><a href="mini-asm-spec.pdf" target="_blank">MiniASM Specification</a> (Version: 0.0.1)</p>
                    <p>Copyright &copy; 2017 <a href="http://ars.me"><NAME></a> under <a href="https://github.com/arshajii/mini-asm/blob/master/LICENSE">MIT License</a></p>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="vm.js" type="text/javascript"></script>
<script src="compiler.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
    $("[rel=tooltip]").tooltip({placement: "above"});
});

const ICON_MEM_CELL = '<i class="fa fa-circle-o" style="color:gray" rel="tooltip">&nbsp;</i>';
const ICON_ERROR    = '<i class="fa fa-warning" style="color:red"></i>';
const ICON_SUCCESS  = '<i class="fa fa-check" style="color:green"></i>';
const ICON_PROGRESS = '<i class="fa fa-cog fa-spin"></i>';
const ICON_PAUSED   = '<i class="fa fa-pause-circle"></i>';

const CLASS_FILLED   = "fa fa-circle"
const CLASS_UNFILLED = "fa fa-circle-o"
{'fraction_non_alphanumeric': 0.1792706620833956, 'fraction_numerical': 0.011059632341951876, 'mean_word_length': 1.9368005266622779, 'pattern_counts': {'":': 0, '<': 377, '<?xml version=': 0, '>': 377, 'https://': 7, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2422039', 'n_tokens_mistral': 4233, 'n_tokens_neox': 3964, 'n_words': 786}