diff --git a/BiwiseCmdPages/styles.css b/BiwiseCmdPages/styles.css
deleted file mode 100644
index 694c6bb..0000000
--- a/BiwiseCmdPages/styles.css
+++ /dev/null
@@ -1,110 +0,0 @@
-body { padding:0; margin:0; height: 100%; overflow: hidden; }
-html { height: 100% }
-
-.app-root { font-family: Verdana; font-size: 0.8em; margin: 0; padding: 20px 100px 0 100px; height: 100%; overflow: auto; }
-code { font-size: 1.2em; font-weight: bold; }
-
-.top-links { position: absolute; right: 10px; top: 10px; list-style-type: none; margin: 0 }
-.top-links li { float: left; }
-.top-links a { display: inline-block; padding: 10px 15px}
-.top-links .icon { margin-right: 5px; }
-
-.mono { font-family: monospace; font-size: 1.3em }
-.expressionInput { width: 500px; padding: 3px; border: solid 1px lightgray; }
-
-.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: bold; padding-right: 5px; text-align: right; }
-.expression .bin { letter-spacing: 3px; }
-.expression .flipable { cursor: pointer; opacity: 1 }
-.expression .flipable:hover { opacity: 0.8 }
-.expression .byte { margin: 0 3px; }
-.expression .flipable { cursor: pointer; opacity: 1 }
-.expression .flipable:hover { opacity: 0.8 }
-.expression-result td { border-top: dotted 1px gray; }
-.expression { font-size: 1.5em; font-family: monospace }
-.expression .prefix { font-weight: normal; display: none; font-size: 0.9em }
-.expression .other { font-size: 0.9em}
-.expression .sign { text-align: right}
-
-.hex .prefix { display: inline; }
-
-.help { padding: 10px; }
-.help ul { list-style-type: none; margin: 0; padding: 0; }
-.help p { margin-top: 0 }
-
-.indicator { padding: 2px 5px; font-family: monospace; font-size: 1.3em; background: transparent; border: none; cursor: pointer }
-.error { color: maroon; }
-
-#view { padding: 10px}
-
-.cur { color: lightgray; }
-
-.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 */
-.light { background: #fafafa; }
-.light a, .light a:visited { color: #222; }
-.light .one { color: black; }
-.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 { background: #121212; color: white;}
-.dark .expression { color: white;}
-.dark .expressionInput { background: #121212; color: white; }
-.dark a, .dark a:visited { color: white; }
-.dark .indicator { color: #555; }
-.dark .on { color: white; }
-.dark .zero { color: #999;}
-.dark .prefix { 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 }
-.dark .error { color: mediumvioletred}
-
-/* Top Links Shrink */
-@media (max-width: 800px) {
-
- .top-links .link-text { display: none }
-}
-
-.social-container{ position:fixed; bottom:10px; right:10px }
-
-/* Remove margin space on body. Inline top links with header */
-@media (max-width: 700px) {
- body { padding: 10px; }
- .expressionInput { width: 500px; }
-}
-
-/* Further shrink */
-@media (max-width: 500px) {
- .expressionInput { width: 350px; }
- .top-links a { display: inline-block; padding: 5px 10px}
-}
-
-@media (max-width: 350px) {
- .expressionInput { width: 200px; }
-}
diff --git a/package.json b/package.json
index 6aa9f5f..c4fdf8e 100644
--- a/package.json
+++ b/package.json
@@ -4,9 +4,9 @@
"description": "Bitwise Operations Console",
"main": "index.js",
"scripts": {
- "build": "webpack -p && rm -rf ./BitwiseCmdPages/* && cp ./src/index.html ./BitwiseCmdPages && cp ./src/*.js ./BitwiseCmdPages && cp ./src/bundle.js.map ./BitwiseCmdPages && cp -r ./src/css ./BitwiseCmdPages && cp -r ./src/img ./BitwiseCmdPages && cp -r ./src/css ./BiwiseCmdPages",
- "stage": "cp -r ./BitwiseCmdPages/* ../BitwiseCmdPages",
- "stage:react": "cp -r ./BitwiseCmdPages/* ../BitwiseCmdPages/react",
+ "build": "webpack -p && rm -rf ./BitwiseCmdPages/* && cp ./src/index.html ./BitwiseCmdPages && cp ./src/*.js ./BitwiseCmdPages && cp ./src/bundle.js.map ./BitwiseCmdPages && cp -r ./src/css ./BitwiseCmdPages && cp -r ./src/img ./BitwiseCmdPages && cp -r ./src/css ./BitwiseCmdPages",
+ "stage": "npm run build && cp -r ./BitwiseCmdPages/* ../BitwiseCmdPages",
+ "stage:react": "npm run build && cp -r ./BitwiseCmdPages/* ../BitwiseCmdPages/react",
"serv": "webpack-dev-server --content-base ./src",
"e2e": "protractor ./tests/e2e.chrome.js --params.appUrl='http://localhost:8080/#clear'",
"e2e:build": "protractor ./tests/e2e.chrome.js --params.appUrl='http://localhost:3000/#clear'",
diff --git a/src/app/appState.js b/src/app/appState.js
index 09dd3e1..f457c9e 100644
--- a/src/app/appState.js
+++ b/src/app/appState.js
@@ -5,6 +5,10 @@ export default class AppState {
this.handlers = [];
this.uiTheme = persistData.uiTheme || 'dark';
this.debugMode = false;
+
+ this.version = 1;
+ this.persistedVersion = persistData.version || 0.9;
+ this.wasOldVersion = this.version > this.persistedVersion;
}
addCommandResult(result) {
@@ -40,7 +44,8 @@ export default class AppState {
getPersistData() {
return {
emphasizeBytes: this.emphasizeBytes,
- uiTheme: this.uiTheme
+ uiTheme: this.uiTheme,
+ version: this.version
}
}
};
\ No newline at end of file
diff --git a/src/app/components/results/HelpResultView.jsx b/src/app/components/results/HelpResultView.jsx
index 7e1cdff..e8436f9 100644
--- a/src/app/components/results/HelpResultView.jsx
+++ b/src/app/components/results/HelpResultView.jsx
@@ -12,6 +12,7 @@ export default class HelpResultView extends React.Component {
23 34 — type one or more numbers to see their binary representations
clear — clear output pane
help — display this help
+ whatsnew — display changelog
em — turn On/Off Emphasize Bytes
dark — set Dark theme
light — set Light theme
diff --git a/src/app/index.jsx b/src/app/index.jsx
index 228ce48..13fa039 100644
--- a/src/app/index.jsx
+++ b/src/app/index.jsx
@@ -43,6 +43,10 @@ function executeStartupCommands() {
var startupCommands = ['help', '1|2&6','1<<0x2a','2 4 8 16 32'];
+ if(appState.wasOldVersion) {
+ startupCommands = ["whatsnew"];
+ }
+
if(hashArgs.commands.length > 0) {
startupCommands = hashArgs.commands;
}
diff --git a/src/index.html b/src/index.html
index 1de5f3f..309021a 100644
--- a/src/index.html
+++ b/src/index.html
@@ -15,7 +15,11 @@
- Ooops... Something went wrong ¯\_(ツ)_/¯
+
+
Ooops... Something went wrong.
+
Either you have an old browser or I screwed something up ¯\_(ツ)_/¯
+
No worries! There is a still old version avaliable at http://bitwisecmd.com/old.
+