Add old BitwiseCmd to /old folder

2026-01-15 08:22:37 +01:00 · 2017-05-16 22:45:51 +03:00
parent 386dea9ef6
commit 9127386b85
12 changed files with 192 additions and 0 deletions
--- a/old/css/styles.css
+++ b/old/css/styles.css
@@ -0,0 +1 @@
+.help ul,.top-links{list-style-type:none}body{font-family:Verdana;font-size:.8em;margin:0;padding:20px 100px 0}.expression,.indicator,.mono{font-family:monospace}code{font-size:1.2em;font-weight:700}.social-container{position:fixed;bottom:10px;right:10px}.top-links{position:absolute;right:10px;top:10px;margin:0}.top-links li{float:left}.top-links a{display:inline-block;padding:10px 15px}.top-links .icon{margin-right:5px}.mono{font-size:1.3em}.expressionInput{width:500px;padding:3px;border:1px solid #d3d3d3}.result{margin:10px 10px 30px}.result .input{margin-bottom:10px}.result .content{padding-left:10px}.result .cur{margin-right:5px}.hashLink{text-decoration:none;margin-left:5px;visibility:hidden}.hashLink:hover{text-decoration:underline;margin-left:5px}.input:hover .hashLink{visibility:visible}.expression .label{font-weight:700;padding-right:5px;text-align:right}.expression .bin{letter-spacing:3px}.expression .byte{margin:0 3px}.expression .flipable{cursor:pointer;opacity:1}.expression .flipable:hover{opacity:.8}.expression-result td{border-top:dotted 1px gray}.expression{font-size:1.5em}.expression .prefix{font-weight:400;display:none;font-size:.9em}.expression .other{font-size:.9em}.expression .sign{text-align:right}.hex .prefix{display:inline}.help{padding:10px}.help ul{margin:0;padding:0}.help p{margin-top:0}.indicator{padding:2px 5px;font-size:1.3em;background:0 0;border:none;cursor:pointer}.error{color:maroon}#view{padding:10px}.cur{color:#d3d3d3}.icon{width:16px;height:16px;display:inline-block}.light .twitter{background:url(../img/twitter-light.png)}.dark .twitter{background:url(../img/twitter-dark.png)}.light .feedback{background:url(../img/feedback-light.png)}.dark .feedback{background:url(../img/feedback-dark.png)}.dark .github{background:url(../img/github-dark.png)}.light .github{background:url(../img/github-light.png)}.light{background:#fafafa}.light a,.light a:visited{color:#222}.light .one{color:#000}.light .zero{color:#888}.light .indicator{color:#ddd}.light .on{color:#121212}.light .prefix{color:#888}.light .other{color:#bbb}.light .hashLink,.light .hashLink:visited{color:#ddd}.light .hashLink:hover{color:#888}.light ul.top-links li:hover{background:#ddd}.dark,.dark .expressionInput{background:#121212;color:#fff}.dark a,.dark a:visited{color:#fff}.dark .indicator{color:#555}.dark .on{color:#fff}.dark .prefix,.dark .zero{color:#999}.dark .other{color:#444}.dark .hashLink,.dark .hashLink:visited{color:#333}.dark .hashLink:hover{color:#999}.dark ul.top-links li:hover{background:#333}@media (max-width:800px){.top-links .link-text{display:none}}@media (max-width:700px){body{padding:10px}.expressionInput{width:500px}}@media (max-width:500px){.expressionInput{width:350px}.top-links a{display:inline-block;padding:5px 10px}}@media (max-width:350px){.expressionInput{width:200px}}
--- a/old/favicon.ico
+++ b/old/favicon.ico
--- a/old/img/feedback-dark.png
+++ b/old/img/feedback-dark.png
--- a/old/img/feedback-light.png
+++ b/old/img/feedback-light.png
--- a/old/img/github-dark.png
+++ b/old/img/github-dark.png
--- a/old/img/github-light.png
+++ b/old/img/github-light.png
--- a/old/img/social-avatar.png
+++ b/old/img/social-avatar.png
--- a/old/img/twitter-dark.png
+++ b/old/img/twitter-dark.png
--- a/old/img/twitter-light.png
+++ b/old/img/twitter-light.png
--- a/old/index.html
+++ b/old/index.html
@@ -0,0 +1,175 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+    <meta name="description" content="Free Text Online Bitwise Calculator">
+
+    <title>BitwiseCmd</title>
+    <link rel="shortcut icon" href="http://bitwisecmd.com/favicon.ico">
+
+    <meta property="og:url"           content="http://bitwisecmd.com" />
+    <meta property="og:type"          content="website" />
+    <meta property="og:title"         content="BitwiseCmd" />
+    <meta property="og:description"   content="Free Text Online Bitwise Calculator" />
+    <meta property="og:image"         content="http://bitwisecmd.com/img/social-avatar.png" />
+
+    <script src="js/bitwisecmd.js"></script>
+
+    <link rel="stylesheet" type="text/css" href="css/styles.css" />
+</head>
+<body id="rootView" class="dark">
+
+<header>
+    <div class="header">
+        <h1>Bitwise<span style="color: #c5c5c5;">Cmd</span>  <span>
+
+        </span></h1>
+
+        <ul class="top-links">
+            <li>
+                <a href="https://github.com/BorisLevitskiy/BitwiseCmd"><i class="icon github">&nbsp;</i><span class="link-text">Project on GitHub</span></a>
+            </li>
+            <li>
+                <a href="https://twitter.com/BitwiseCmd"><i class="icon twitter">&nbsp;</i><span class="link-text">Twitter</span></a>
+            </li>
+            <li>
+                <a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback"><i class="icon feedback">&nbsp;</i><span class="link-text">Send Feedback</span></a>
+            </li>
+        </ul>
+    </div>
+
+    <div class="expressionInput-container">
+        <input id="in" type="text" class="expressionInput mono" data-controller="expressionInputCtrl" placeholder="type expression like '1>>2' or 'help' "/>
+
+        <span data-controller="configPanelCtrl" class="configPnl">
+             <span id="emphasizeBytes" data-cmd="em" class="indicator on" title="Emphasize Bytes">[em]</span>
+        </span>
+    </div>
+</header>
+
+<div id="output" data-controller="cmdController">
+</div>
+
+<script data-template="helpResultTpl" type="text/template">
+    <div class="help helpResultTpl">
+        <div style="overflow: hidden">
+            <div style="float: left; margin-right: 20px">
+                <p class="section">
+                    <strong>Supported Commands</strong>
+                <ul>
+                    <li><code>23 ^ 34</code> — type bitwise expression to see result in binary (only positive integers are supported now)</li>
+                    <li><code>23 34</code> — type one or more numbers to see their binary representations</li>
+                    <li><code>clear</code> — clear output pane</li>
+                    <li><code>help</code> — display this help</li>
+                    <li><code>em</code> — turn On/Off Emphasize Bytes</li>
+                    <li><code>dark</code> — set Dark theme</li>
+                    <li><code>light</code> — set Light theme</li>
+                    <li><code>about</code> — about the app</li>
+                </ul>
+                </p>
+            </div>
+            <div class="float:left">
+                <p class="section">
+                    <strong>Supported Bitwise Operations</strong><br/>
+                    <small>
+                        <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">
+                            as implemented in JavaScript engine
+                        </a>
+                    </small>
+                <ul>
+                    <li><code>&</code> — bitwise AND</li>
+                    <li><code>|</code> — bitwise inclusive OR</li>
+                    <li><code>^</code> — bitwise exclusive XOR</li>
+                    <li><code>~</code> — bitwise NOT</li>
+                    <li><code>&lt;<</code> — left shift</li>
+                    <li><code>&gt;&gt;</code> — sign propagating right shift</li>
+                    <li><code>&gt;&gt;&gt;</code> — zero-fill right shift</li>
+
+                </ul>
+                </p>
+            </div>
+        </div>
+
+        <p style="font-style: italic">
+            <strong>Tip:</strong> Use Up and Down keys to navigate trough executed commands.
+        </p>
+    </div>
+</script>
+
+<script data-template="aboutTpl" type="text/template">
+    <div class="aboutTpl">
+        <p> Created by <a href="http://boryslevytskyi.github.io/">Borys Levytskyi</a>. Please give it a like if BitwiseCmd has helped you in your work.</p>
+        <p>If you have an idea, suggestion or you've spotted a bug here, please send it to <a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback">&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;</a> or tweet on <a href="http://twitter.com/BitwiseCmd">@BitwiseCmd</a>. Your feedback is greatly appreciated.</p>
+        <p><a href="https://github.com/BorisLevitskiy/BitwiseCmd">Project on <strong>GitHub</strong></a></p>
+    </div>
+</script>
+
+<script data-template="resultView" data-compiled="" type="text/template">
+    <div class="result">
+        <div class="input mono"><span class="cur">&gt;</span>{m.input}<a class="hashLink" title="Link for this expression" href="{window.location.pathname}#{m.inputHash}">#</a></div>
+        <div class="content"></div>
+    </div>
+</script>
+
+<script data-template="bitwiseExpressionView" data-compiled="" type="text/template">
+    <table class="expression" cellspacing="0">
+        {each itm in m.items}
+        <tr class="{itm.css}">
+            <td class="sign">{itm.sign}</td>
+            <td class="label">{itm.label}</td>
+            <td class="bin">{itm.bin.padLeft(m.maxNumberOfBits, '0')}</td>
+            <td class="other">{itm.other}</td>
+        </tr>
+        {/}
+    </table>
+</script>
+
+<script data-template="numbersList" data-compiled="" type="text/template">
+    <table class="expression" cellspacing="0">
+        {each op in m.operands}
+        <tr data-kind="{op.kind}">
+            <td class="label">{op.input}</td>
+            <td class="bin">{op.bin.padLeft(m.bitsSize, '0')}</td>
+            <td class="other">{op.other}</td>
+        </tr>
+        {/}
+    </table>
+</script>
+
+<script type="text/javascript">
+
+    var app = window.app;
+    app.bootstrap(document.getElementById('rootView'));
+
+    var cmd = app.get('cmd');
+    var hashArgs = app.get('hashArgs');
+
+    if(hashArgs.commands.length > 0) {
+        hashArgs.commands.forEach(cmd.execute.bind(cmd));
+    }
+    else {
+        cmd.execute('help');
+        cmd.execute('1|2&6');
+        cmd.execute('1<<0x2a');
+        cmd.execute('2 4 8 16 32');
+    }
+
+</script>
+
+<script src="js/analytics.js"></script>
+
+<div id="fb-root"></div>
+<script>(function(d, s, id) {
+    var js, fjs = d.getElementsByTagName(s)[0];
+    if (d.getElementById(id)) return;
+    js = d.createElement(s); js.id = id;
+    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
+    fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<div class="social-container">
+    <div class="fb-like" data-href="http://bitwisecmd.com" data-layout="box_count" data-action="like" data-show-faces="false" data-share="true"></div>
+</div>
+
+</body>
+</html>
--- a/old/js/analytics.js
+++ b/old/js/analytics.js
@@ -0,0 +1,14 @@
+(function() {
+
+    if(window.location.host != 'bitwisecmd.com' ||  window.location.hash.indexOf('-notrack') > -1) {
+        return;
+    }
+
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+    ga('create', 'UA-61569164-1', 'auto');
+    ga('send', 'pageview');
+})();
--- a/old/js/bitwisecmd.js
+++ b/old/js/bitwisecmd.js
				`@@ -0,0 +1 @@`
				.help ul,.top-links{list-style-type:none}body{font-family:Verdana;font-size:.8em;margin:0;padding:20px 100px 0}.expression,.indicator,.mono{font-family:monospace}code{font-size:1.2em;font-weight:700}.social-container{position:fixed;bottom:10px;right:10px}.top-links{position:absolute;right:10px;top:10px;margin:0}.top-links li{float:left}.top-links a{display:inline-block;padding:10px 15px}.top-links .icon{margin-right:5px}.mono{font-size:1.3em}.expressionInput{width:500px;padding:3px;border:1px solid #d3d3d3}.result{margin:10px 10px 30px}.result .input{margin-bottom:10px}.result .content{padding-left:10px}.result .cur{margin-right:5px}.hashLink{text-decoration:none;margin-left:5px;visibility:hidden}.hashLink:hover{text-decoration:underline;margin-left:5px}.input:hover .hashLink{visibility:visible}.expression .label{font-weight:700;padding-right:5px;text-align:right}.expression .bin{letter-spacing:3px}.expression .byte{margin:0 3px}.expression .flipable{cursor:pointer;opacity:1}.expression .flipable:hover{opacity:.8}.expression-result td{border-top:dotted 1px gray}.expression{font-size:1.5em}.expression .prefix{font-weight:400;display:none;font-size:.9em}.expression .other{font-size:.9em}.expression .sign{text-align:right}.hex .prefix{display:inline}.help{padding:10px}.help ul{margin:0;padding:0}.help p{margin-top:0}.indicator{padding:2px 5px;font-size:1.3em;background:0 0;border:none;cursor:pointer}.error{color:maroon}#view{padding:10px}.cur{color:#d3d3d3}.icon{width:16px;height:16px;display:inline-block}.light .twitter{background:url(../img/twitter-light.png)}.dark .twitter{background:url(../img/twitter-dark.png)}.light .feedback{background:url(../img/feedback-light.png)}.dark .feedback{background:url(../img/feedback-dark.png)}.dark .github{background:url(../img/github-dark.png)}.light .github{background:url(../img/github-light.png)}.light{background:#fafafa}.light a,.light a:visited{color:#222}.light .one{color:#000}.light .zero{color:#888}.light .indicator{color:#ddd}.light .on{color:#121212}.light .prefix{color:#888}.light .other{color:#bbb}.light .hashLink,.light .hashLink:visited{color:#ddd}.light .hashLink:hover{color:#888}.light ul.top-links li:hover{background:#ddd}.dark,.dark .expressionInput{background:#121212;color:#fff}.dark a,.dark a:visited{color:#fff}.dark .indicator{color:#555}.dark .on{color:#fff}.dark .prefix,.dark .zero{color:#999}.dark .other{color:#444}.dark .hashLink,.dark .hashLink:visited{color:#333}.dark .hashLink:hover{color:#999}.dark ul.top-links li:hover{background:#333}@media (max-width:800px){.top-links .link-text{display:none}}@media (max-width:700px){body{padding:10px}.expressionInput{width:500px}}@media (max-width:500px){.expressionInput{width:350px}.top-links a{display:inline-block;padding:5px 10px}}@media (max-width:350px){.expressionInput{width:200px}}