uccser / cs-field-guide Goto Github PK

<p id="arrowEx13Text">Try putting in the final matrix here and see if it does scale by 2 and rotate by 45 degrees.</p><div align="center"><a href="" onclick= "linkSend(this, 'arrowEx13Text', '_static/widgets/CG/CG-arrow/CG-arrow-singlematrix.html','&zoom=-10.0 &quiz=1.4 1.4 0 0 -1.4 1.4 0 0 0 0 1 0 0 0 0 1 &allPrize=5'); return true" target="_blank"><img class="widgetimage" src="_static/widgets/CG/CG-arrow/CG-arrow-example1.png" alt=""><br />Click to load the widget.</a></div><br />

<div class="widget-holder"><a href="_static/widgets/HCI/HCI-Delay/index.html"  target="_blank"><img class="widget-image" src="_static/images/hci-delay-thumbnail.png" alt=""><span class="widget-subtitle">Click to load the<br>delay interactive</span></a></div>

<a href="http://inspirit.github.com/jsfeat/sample_haar_face.html" target="_blank">Open the face recognition interactive using this link and experiment with the settings. You will need a webcam, and the widget will ask you to allow access to it.</a>

<div class="widget-holder"><a href="_static/widgets/DR/DR-Parity/public_html/index.html"  target="_blank"><img class="widget-image" src="_static/images/EC-ParityThumbnail.png" alt=""><span class="widget-subtitle">Click to load the parity widget</span></a></div>

<a href="http://www.cosc.canterbury.ac.nz/csfieldguide/dev/dev/_static/widgets/cv-noise-filters.html" target="_blank">Open the noise reduction filtering interactive using this link and experiment with settings as below. You will need a webcam, and the widget will ask you to allow access to it.</a>

<div align="center"><iframe width="450" height="515" src="_static/widgets/fsa-trainsylvania-v4.html?map=puzzle1" frameborder="0">Your browser does not support iframes. Please contact the computer's administrator and upgrade <a href="http://browsehappy.com/"> to a modern browser</a> (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<link rel="stylesheet" href="_static/interactives/dr/dr_inline_interactives.css" type="text/css" />
<script type="text/javascript" src="_static/interactives/dr/dr_inline_interactives.js"></script>
<script type="text/javascript" src="_static/interactives/dr/jquery-ui.min.js"></script>
<div class="interactive row text-center">
<h4>CMY Colour Mixer</h4>
    <div class="col-xs-12 col-sm-4">
        <label for="cyan-colour">Cyan</label>
        <div id="cyan-colour" class="slider"></div>
        <label class="pull-left">0</label>
        <label id="cyan-value"></label>
        <label class="pull-right">255</label>
    </div>
    <div class="col-xs-12 col-sm-4">
        <label for="magenta-colour">Magenta</label>
        <div id="magenta-colour" class="slider"></div>
        <label class="pull-left">0</label>
        <label id="magenta-value"></label>
        <label class="pull-right">255</label>
    </div>
    <div class="col-xs-12 col-sm-4">
        <label for="yellow-colour">Yellow</label>
        <div id="yellow-colour" class="slider"></div>
        <label class="pull-left">0</label>
        <label id="yellow-value"></label>
        <label class="pull-right">255</label>
    </div>
    <div class="clearfix"></div>
    <div class="col-xs-12" id="cmyk-colour-output">
    </div>
</div>

<p class="text-center">Move your cursor or tap the image to compare the two images</p>
<!-- Code provided by http://codepen.io/dudleystorey/pen/JDphy -->
<!-- Photo from http://www.publicdomainpictures.net/view-image.php?image=101219&picture=fisherman-bait-casting -->
<div style="width: 90%; margin: 0 auto; padding-bottom: 20px;">
<div id="inked-painted">
<img src="_static/images/cc-introduction-high.jpg" id="inked" alt>
<div id="colored"></div>
</div>
</div>
<p class="text-center"><b>Left is low quality JPEG (20Kb) - Right is high quality JPEG (88Kb)</b></p>

<div><iframe width="100%" height="270" src="_static/widgets/DR/DR-color/CG-ColorBits_1.html" frameborder="0"></iframe></div>

<div><iframe width="100%" height="520" src="_static/widgets/DR/DR-color/CG-ColorBits_4.html" frameborder="0"></iframe></div>

<div align="center"><iframe width="830" height="620" src="_static/widgets/FL/FL-Regex/RegexDic.html" frameborder="0">Your browser does not support iframes. Please contact the computer's administrator and upgrade <a href="http://browsehappy.com/"> to a modern browser</a> (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<section id="test_text"></section><div align="center"><a href="" onclick="linkSend(this,'test_text','_static/widgets/CG/CG-matrix-simplifier/CG-matrix-simplifier.html',null); return true" target="_blank"><img class="widgetimage" src="_static/widgets/CG/CG-matrix-simplifier/CG-image.png" alt=""><br />Click to load the widget.</a></div><br />

<a href="http://inspirit.github.com/jsfeat/sample_canny_edge.html" target="_blank">Open the edge detection interactive using this link and experiment with settings as below. You will need a webcam, and the widget will ask you to allow access to it.</a>

<div class="widget-holder"><a href="_static/widgets/DR/DR-base-conversion/public_html/index.html?base=2&columns=7&lines=A,B,C&offset=0"  target="_blank"><img class="widget-image" src="_static/data_representation/images/DR-BaseConversionBinaryThumbnail.png" alt=""><span class="widget-subtitle">Click to load the<br>binary number interactive</span></a></div>

<section id="teapot1Text">

<div align="center"><iframe width="450" height="350" src="_static/widgets/fsa-2state-v3.html?map=two" frameborder="0" allowfullscreen>Your browser does not support iframes. Please contact the computer's administrator and upgrade to a modern browser (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<div class="col-xs-12 col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel-heading">RSA Key Generator</div>
<div class="panel-body">
    <div class="row">
        <form id="modeSelect" class="form-horizontal" role="form">
            <div class="form-group">
                <div class="col-xs-12 text-center">
                <input type="button" id="generate" onclick="generate_new_keys()" value="Generate New Keys" class="btn btn-primary">
                </div>
            </div>
            <div class="form-group">
                <label for="pub_key" class="col-xs-3 control-label text-right">Public Key</label>
                <div class="col-xs-8">
                    <textarea id="pub_key" class="form-control" rows="1" readonly="true"></textarea>
                </div>
            </div>
            <div class="form-group">
                <label for="priv_key" class="col-xs-3 control-label text-right">Private Key</label>
                <div class="col-xs-8">
                    <textarea id="priv_key" class="form-control" rows="1" readonly="true"></textarea>
                </div>
            </div>
        </form>
    </div>
</div>
</div>
</div>
<div class="clearfix visible-xs-block"></div>

<div class="interactive">
<div id="interactive-deceiver-question" class="interactive-text"><br></div>
<div id="startButton" class="row">
<div class="col-xs-8 col-xs-offset-1 col-sm-4 col-sm-offset-4">
<button type="button" id="buttonStart" class="btn btn-success btn-block">Start</button>
</div>
</div>
<div id="gameButtons" class="row" style="display:none;" >
<div class="col-xs-4 col-xs-offset-2 col-sm-2 col-sm-offset-4">
<button type="button" id="buttonLeft" class="btn btn-default btn-block interactive-deceiver-button">No</button>
</div>
<div class="col-xs-4 col-sm-2">
<button type="button" id="buttonRight" class="btn btn-default btn-block interactive-deceiver-button">Yes</button>
</div>
</div>
<div id="interactive-deceiver-feedback-container">
<div id="interactive-deceiver-feedback" class="interactive-text"><br></div>
</div>
<div id="interactive-deceiver-timer" class="interactive-text"><span id="interactive-deceiver-seconds">15</span> seconds left</div>
</div>

<div class="widget-holder"><a href="_static/widgets/DR/DR-base-conversion/public_html/index.html?base=2&columns=14&lines=A,B,C&offset=-8" target="_blank"><img class="widget-image" src="_static/images/DR-BaseConversionBinaryDecimals.png" alt=""><span class="widget-subtitle">Click to load the widget</span></a></div>

<div class="widget-holder"><a href="_static/interactives/cc/run-length-encoding/index.html"  target="_blank"><img class="widget-image" src="_static/interactives/cc/run-length-encoding/thumbnail-full.png" alt=""><span class="widget-subtitle">Click to load<br>Run Length Encoding</span></a></div>
<p class="text-center">Created by Hannah Taylor</p>

<div class="interactive row">
<div class="col-xs-12 col-sm-4">  
<h4>Plaintext</h4>
<textarea id="caesar-plaintext" class="form-control" rows="5"></textarea>
<button id="caesar-encrypt" type="button" class="btn btn-primary btn-block" style="margin-top:10px;">Encrypt</button>
</div>
<div class="col-xs-12 col-sm-4">
<h4>Rotation Amount</h4>
<input id="rotation-input" type="number" min="1" max="26" value="1" onkeydown="return isNumber(event,this);" class="interactive-input">
</div>
<div class="col-xs-12 col-sm-4">
<h4>Ciphertext</h4>
<textarea id="caesar-ciphertext" class="form-control" rows="5"></textarea>
<button id="caesar-decrypt" type="button" class="btn btn-primary btn-block" style="margin-top:10px;">Decrypt</button>
</div>
</div>

<section id="test_text">Multiple transforms</section><div align="center"><a href="" onclick="linkSend(this,'test_text','_static/widgets/CG/CG-matrix-simplifier/CG-matrix-simplifier.html',null); return true" target="_blank"><img class="widgetimage" src="_static/widgets/CG/CG-matrix-simplifier/CG-image.png" alt=""><br />Click to load the widget.</a></div><br />

<div align="center"><iframe width="900" height="460" src="_static/widgets/COMPRESSION/LWZ/public_html/index.html" frameborder="0">Your browser does not support iframes. Please contact the computer's administrator and upgrade <a href="http://browsehappy.com/"> to a modern browser</a> (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<div class="col-xs-12 col-md-6 col-md-offset-3">
<div class="row panel panel-default">
<div class="panel-heading">RSA Encrypter &amp; Decrypter</div>
<div class="panel-body">
    <div class="row">
        <form id="modeSelect" class="form-horizontal" role="form">
            <div class="form-group">
                <label class="col-xs-2 control-label text-right">Mode</label>
                <div class="col-xs-9">
                    <label class="radio-inline">
                        <input type="radio" name="modeSelect" id="encrypt" onchange="modeChanged('Encrypt')" checked="true"> Encrypt </input>
                    </label>
                    <label class="radio-inline">
                        <input type="radio" name="modeSelect" id="decrypt" onchange="modeChanged('Decrypt')"> Decrypt </input>
                    </label>
                </div>
            </div>
            <div class="form-group">
                <label for="key" class="col-xs-2 control-label text-right">Key</label>
                <div class="col-xs-9">
                    <textarea id="key" class="form-control" rows="2" placeholder="Put an RSA key here"></textarea>
                </div>

            </div>
            <div class="form-group">
                <label for="text_to_encrypt" class="col-xs-2 control-label text-right">Text</label>
                <div class="col-xs-9">
                    <textarea id="text_to_encrypt" class="form-control" rows="3" placeholder="Put the text to encrypt or decrypt here"></textarea>
                </div>

            </div>
            <div class="form-group">
                <div class="col-xs-5 col-xs-offset-4">
                    <input type="button" id="generate" onclick="encodeText()" value="Encrypt with Key" class="btn btn-primary btn-block">
                </div>
            </div>
            <div class="form-group" id="output-group">
                <label for="output" class="col-xs-2 control-label text-right">Output</label>
                <div class="col-xs-9">
                    <textarea id="output" class="form-control" rows="3" readonly="" placeholder="Output will appear here"></textarea>
                </div>
            </div>
    </form>
</div>
</div>
</div>
</div>
<div class="clearfix visible-xs-block"></div>

<div class="widget-holder"><a href="_static/widgets/big-calculator.html?plain=true frameborder="0"" target="_blank"><img class="widget-image" src="_static/complexity_and_tractability/images/CT-BigCalculatorThumbnail.png" alt=""><span class="widget-subtitle">Click to load<br>big number calculator</span></a></div>

<div align="center"><iframe width="450" height="350" src="_static/widgets/fsa-2state-v3.html?map=one" frameborder="0" allowfullscreen>Your browser does not support iframes. Please contact the computer's administrator and upgrade to a modern browser (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<div><iframe width="100%" height="650" src="_static/widgets/DR/DR-color/CG-ColorBits_3.html" frameborder="0"></iframe></div>

<div align="center"><iframe width="450" height="450" src="_static/widgets/fsa-spin-graphic.html" frameborder="0" allowfullscreen>Your browser does not support iframes. Please contact the computer's administrator and upgrade to a modern browser (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<p><a href="_static/interactives/ec/isbncreditcardcheckerv2.xlsx">Click here to download the spreadsheet.</a></p>

<div align="center"><iframe width="450" height="450" src="_static/widgets/fsa-strangelight-v3.html" frameborder="0" allowfullscreen>Your browser does not support iframes. Please contact the computer's administrator and upgrade to a modern browser (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<div class="widget-holder"><a href="_static/interactives/dr/pixel-values/index.html"  target="_blank"><img class="widget-image" src="_static/interactives/dr/pixel-values/thumbnail.png" alt=""><span class="widget-subtitle">Click to load<br>Pixel Interactive</span></a></div>

<div align="center"><iframe width="810" height="630" src="_static/widgets/FL/FL-Regex/RegexTxt.html" frameborder="0">Your browser does not support iframes. Please contact the computer's administrator and upgrade <a href="http://browsehappy.com/"> to a modern browser</a> (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>

<div class="widget-holder"><a href="_static/widgets/tract-scaling-v2.html" target="_blank"><img class="widget-image" src="_static/images/CT-TimeCalculatorThumbnail.png" alt=""><span class="widget-subtitle">Click to load<br>big number calculator</span></a></div>

<div class="widget-holder"><a href="_static/widgets/PacketAttack/"  target="_blank"><img class="widget-image" src="_static/images/net-packet-attack.png" alt=""><span class="widget-subtitle">Click to play<br>Packet Attack</span></a></div>

<div align="center"><iframe width="700" height="500" src="_static/widgets/tract-tsp-basic-v2.html" frameborder="0"></iframe></div>

<section id="test_text"></section><div align="center"><a href="" onclick="linkSend(this,'test_text','_static/widgets/CG/CG-mini-editor/main.html',null); return true" target="_blank"><img class="widgetimage" src="_static/widgets/CG/CG-mini-editor/CG-mini-editor.png" alt=""><br />Click to load the widget.</a></div><br />

<div class="widget-holder"><a href="_static/widgets/DR/DR-base-conversion/public_html/index.html?base=16&columns=7&lines=A,B,C&offset=0"  target="_blank"><img class="widget-image" src="_static/images/DR-BaseConversionHexidecimal.png" alt=""><span class="widget-subtitle">Click to load the widget</span></a></div>

<div><iframe width="100%" height="500" src="_static/widgets/DR/DR-color/CG-ColorBits_2.html" frameborder="0"></iframe></div>

<div class="widget-holder"><a href="_static/widgets/big-calculator.html?plain=true frameborder="0"" target="_blank"><img class="widget-image" src="_static/complexity_and_tractability/images/CT-BigCalculatorThumbnail.png" alt=""><span class="widget-subtitle">Click to load<br>big number calculator</span></a></div>

<div align="center"><iframe width="450" height="350" src="_static/widgets/fsa-trip-planner-v4.html" frameborder="0" allowfullscreen>Your browser does not support iframes. Please contact the computer's administrator and upgrade to a modern browser (like Google Chrome) to enable all functionality of this online textbook.</iframe></div>