Personal_mirrors/bitburner-src
1
0
Fork 0
mirror of https://github.com/bitburner-official/bitburner-src.git synced 2024-12-29 17:37:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

Adding basic theme command

Browse Source
This commit is contained in:
0x726564646974 2017-06-06 21:23:51 -04:00
parent 77e6bdbfdc
commit 47e01ee2eb
6 changed files with 114 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
css/menupages.css
View File

@ -26,7 +26,7 @@
height: 100%; height: 100%;
margin-left: 10%; margin-left: 10%;
width: 99%; width: 99%;
color: #66ff33; color: var(--my-font-color);
overflow-y: scroll; overflow-y: scroll;
} }
@ -62,7 +62,7 @@
margin-right: 0px; margin-right: 0px;
padding-left: 6px; padding-left: 6px;
width: 100%; width: 100%;
border: 2px solid white; border: 2px solid var(--my-highlight-color);
} }
#script-editor-filename-tag { #script-editor-filename-tag {
@ -71,6 +71,7 @@
padding-bottom: 0px; padding-bottom: 0px;
float:center; float:center;
background-color: #555; background-color: #555;
color: white;
} }
#script-editor-filename { #script-editor-filename {
@ -83,7 +84,7 @@ background-color: #555;
padding: 2px; padding: 2px;
border: 2px solid white; border: 2px solid var(--my-highlight-color);
-webkit-box-shadow: -webkit-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1), inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1); 0 0 16px rgba(0,0,0,0.1);
@ -101,7 +102,7 @@ background-color: #555;
} }
#script-editor-text { #script-editor-text {
color: #66ff33; color: var(--my-font-color);
height: 80%; height: 80%;
width: 100%; width: 100%;
margin-left: 6px; margin-left: 6px;
@ -110,7 +111,7 @@ background-color: #555;
padding-top: 6px; padding-top: 6px;
padding-bottom: 6px; padding-bottom: 6px;
border: 2px solid white; border: 2px solid var(--my-highlight-color);
-webkit-box-shadow: -webkit-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1), inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1); 0 0 16px rgba(0,0,0,0.1);
@ -198,7 +199,7 @@ background-color: #555;
.active-scripts-script-header { .active-scripts-script-header {
background-color: #555; background-color: #555;
color: #66ff33; color: var(--my-font-color);
padding: 4px; padding: 4px;
padding-left: 10px; padding-left: 10px;
cursor: pointer; cursor: pointer;
@ -220,7 +221,7 @@ background-color: #555;
.active-scripts-script-header:after { .active-scripts-script-header:after {
content: '\02795'; /* "plus" sign (+) */ content: '\02795'; /* "plus" sign (+) */
font-size: 13px; font-size: 13px;
color: #66ff33; color: var(--my-font-color);
float: right; float: right;
margin-left: 5px; margin-left: 5px;
} }
@ -228,7 +229,7 @@ background-color: #555;
.active-scripts-script-header.active:after { .active-scripts-script-header.active:after {
content: "\2796"; /* "minus" sign (-) */ content: "\2796"; /* "minus" sign (-) */
font-size: 13px; font-size: 13px;
color: #66ff33; color: var(--my-font-color);
float: right; float: right;
margin-left: 5px; margin-left: 5px;
} }
@ -291,7 +292,7 @@ background-color: #555;
margin: 6px; margin: 6px;
padding: 6px; padding: 6px;
width: 85%; width: 85%;
border: 2px solid white; border: 2px solid var(--my-highlight-color);
-webkit-box-shadow: -webkit-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1), inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1); 0 0 16px rgba(0,0,0,0.1);
@ -375,7 +376,7 @@ background-color: #555;
height: 100%; height: 100%;
margin-left: 10%; margin-left: 10%;
width: 99%; width: 99%;
color: #66ff33; color: var(--my-font-color);
overflow-y: auto; overflow-y: auto;
} }
@ -425,7 +426,7 @@ background-color: #555;
padding: 6px; padding: 6px;
margin: 6px; margin: 6px;
display: inline-block; display: inline-block;
color: #66ff33; color: var(--my-font-color);
} }
#faction-donate-amount-txt { #faction-donate-amount-txt {
@ -450,7 +451,7 @@ div.faction-clear {
height: 100%; height: 100%;
margin-left: 10%; margin-left: 10%;
width: 99%; width: 99%;
color: #66ff33; color: var(--my-font-color);
} }
#faction-augmentations-container p, #faction-augmentations-container p,
@ -480,7 +481,7 @@ div.faction-clear {
height: 100%; height: 100%;
margin-left: 10%; margin-left: 10%;
width: 99%; width: 99%;
color: #66ff33; color: var(--my-font-color);
overflow-y: scroll; overflow-y: scroll;
} }
@ -492,7 +493,7 @@ div.faction-clear {
#augmentations-list h2, #augmentations-list h2,
#augmentations-list p { #augmentations-list p {
margin: 4px; margin: 4px;
color: #66ff33; color: var(--my-font-color);
padding: 8px; padding: 8px;
width: 70%; width: 70%;
background-color: #333; background-color: #333;
@ -522,7 +523,7 @@ div.faction-clear {
/* Location */ /* Location */
#location-container { #location-container {
color: #66ff33; color: var(--my-font-color);
position: fixed; position: fixed;
padding: 6px; padding: 6px;
height: 100%; height: 100%;

61
css/popupboxes.css
View File

@ -8,8 +8,9 @@
width: 100%; /* Full width */ width: 100%; /* Full width */
height: 100%; /* Full height */ height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */ overflow: auto; /* Enable scroll if needed */
background-color: black; /* Fallback color */ /*background-color: black; /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ /*background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
background-color: var(--my-background-color);
} }
.dialog-box-container { .dialog-box-container {
@ -23,15 +24,15 @@
left: 50%; left: 50%;
margin: -10% 0 0 -25%; margin: -10% 0 0 -25%;
overflow: auto; overflow: auto;
background-color: black; background-color: var(--my-background-color);
background-color: rgba(0,0,0,0.4); border: 5px solid var(--my-highlight-color);
border: 5px solid #FFFFFF;
} }
.dialog-box-content { .dialog-box-content {
z-index: 2; z-index: 2;
background-color: black; background-color: var(--my-background-color);
padding: 10px; padding: 10px;
border: 5px solid var(--my-highlight-color);;
} }
.dialog-box-close-button { .dialog-box-close-button {
@ -60,12 +61,12 @@
} }
#purchase-server-box-content { #purchase-server-box-content {
background-color: black; background-color: background-color: var(--my-background-color);
margin: 15% auto; /* 15% from the top and centered */ margin: 15% auto; /* 15% from the top and centered */
padding: 12px; padding: 12px;
border: 5px solid #FFFFFF; border: 5px solid var(--my-highlight-color);;
width: 80%; /* Could be more or less, depending on screen size */ width: 80%; /* Could be more or less, depending on screen size */
color: #66ff33; color: var(--my-font-color);
} }
#purchase-server-box-input { #purchase-server-box-input {
@ -85,14 +86,14 @@
#purchase-server-box-confirm:hover, #purchase-server-box-confirm:hover,
#purchase-server-box-confirm:focus { #purchase-server-box-confirm:focus {
color: #66ff33; color: var(--my-font-color);
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
#purchase-server-box-cancel:hover, #purchase-server-box-cancel:hover,
#purchase-server-box-cancel:focus { #purchase-server-box-cancel:focus {
color: #66ff33; color: var(--my-font-color);
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
@ -103,12 +104,12 @@
} }
#purchase-ram-for-home-box-content { #purchase-ram-for-home-box-content {
background-color: black; background-color: var(--my-background-color);
margin: 15% auto; /* 15% from the top and centered */ margin: 15% auto; /* 15% from the top and centered */
padding: 12px; padding: 12px;
border: 5px solid #FFFFFF; border: 5px solid var(--my-highlight-color);
width: 50%; /* Could be more or less, depending on screen size */ width: 50%; /* Could be more or less, depending on screen size */
color: #66ff33; color: var(--my-font-color);
} }
#purchase-ram-for-home-box-confirm, #purchase-ram-for-home-box-confirm,
@ -124,14 +125,14 @@
#purchase-ram-for-home-box-confirm:hover, #purchase-ram-for-home-box-confirm:hover,
#purchase-ram-for-home-box-confirm:focus { #purchase-ram-for-home-box-confirm:focus {
color: #66ff33; color: var(--my-font-color);
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
#purchase-ram-for-home-box-cancel:hover, #purchase-ram-for-home-box-cancel:hover,
#purchase-ram-for-home-box-cancel:focus { #purchase-ram-for-home-box-cancel:focus {
color: #66ff33; color: var(--my-font-color);
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
@ -142,12 +143,12 @@
} }
#purchase-augmentation-box-content { #purchase-augmentation-box-content {
background-color: black; background-color: var(--my-background-color);
margin: 15% auto; /* 15% from the top and centered */ margin: 15% auto; /* 15% from the top and centered */
padding: 8px; padding: 8px;
border: 5px solid #FFFFFF; border: 5px solid var(--my-highlight-color);;
width: 80%; /* Could be more or less, depending on screen size */ width: 80%; /* Could be more or less, depending on screen size */
color: #66ff33; color: var(--my-font-color);
} }
#purchase-augmentation-box-confirm, #purchase-augmentation-box-confirm,
@ -163,14 +164,14 @@
#purchase-augmentation-box-confirm:hover, #purchase-augmentation-box-confirm:hover,
#purchase-augmentation-box-confirm:focus { #purchase-augmentation-box-confirm:focus {
color: #66ff33; color: var(--my-font-color);
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
#purchase-augmentation-box-cancel:hover, #purchase-augmentation-box-cancel:hover,
#purchase-augmentation-box-cancel:focus { #purchase-augmentation-box-cancel:focus {
color: #66ff33; color: var(--my-font-color);
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
@ -181,12 +182,12 @@
} }
#faction-invitation-box-content { #faction-invitation-box-content {
background-color: black; background-color: var(--my-background-color);
margin: 15% auto; /* 15% from the top and centered */ margin: 15% auto; /* 15% from the top and centered */
padding: 10px; padding: 10px;
border: 5px solid #FFFFFF; border: 5px solid var(--my-highlight-color);;
width: 80%; /* Could be more or less, depending on screen size */ width: 80%; /* Could be more or less, depending on screen size */
color: #66ff33; color: var(--my-font-color);
} }
#faction-invitation-box-warning { #faction-invitation-box-warning {
@ -225,12 +226,12 @@
} }
#travel-box-content { #travel-box-content {
background-color: black; background-color: var(--my-background-color);
margin: 15% auto; /* 15% from the top and centered */ margin: 15% auto; /* 15% from the top and centered */
padding: 10px; padding: 10px;
border: 5px solid #FFFFFF; border: 5px solid var(--my-highlight-color);;
width: 50%; /* Could be more or less, depending on screen size */ width: 50%; /* Could be more or less, depending on screen size */
color: #66ff33; color: var(--my-font-color);
} }
#travel-box-text { #travel-box-text {
@ -268,12 +269,12 @@
} }
#game-options-content { #game-options-content {
background-color: black; background-color: var(--my-background-color);
margin: 15% auto; /* 15% from the top and centered */ margin: 15% auto; /* 15% from the top and centered */
padding: 10px; padding: 10px;
border: 5px solid #FFFFFF; border: 5px solid var(--my-highlight-color);
width: 50%; /* Could be more or less, depending on screen size */ width: 50%; /* Could be more or less, depending on screen size */
color: #66ff33; color: var(--my-font-color);
} }
#game-options-close-button { #game-options-close-button {

25
css/styles.css
View File

@ -1,25 +1,34 @@
/** This removes all padding and margins as well as /** This removes all padding and margins as well as
setting a default font size and family for the page **/ setting a default font size and family for the page **/
:root{
--my-font-color: #66ff33;
--my-background-color: #000000;
--my-highlight-color: #ffffff;
}
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
font-size: 16px; font-size: 16px;
font-family: 'Lucida Console', 'Lucida Sans Unicode', 'Fira Mono', 'Consolas', 'Courier New', Courier, monospace, 'Times New Roman'; font-family: 'Lucida Console', 'Lucida Sans Unicode', 'Fira Mono', 'Consolas', 'Courier New', Courier, monospace, 'Times New Roman';
background-color: #252527; /*background-color: #252527;*/
background-color: black; background-color: var(--my-background-color);
} }
p { p {
color: #66ff33; color: var(--my-font-color);
} }
h1 { h1 {
font-size: 22px; font-size: 22px;
color: #66ff33; color: var(--my-font-color);
} }
h2 { h2 {
color: #66ff33; color: var(--my-font-color);
} }
ul { ul {
@ -151,8 +160,8 @@ tr:focus {
.tooltip .tooltiptext { .tooltip .tooltiptext {
visibility: hidden; visibility: hidden;
width: 300px; width: 300px;
background-color: black; background-color: var(--my-background-color);
border: 2px solid white; border: 2px solid var(--my-highlight-color);;
color: white; color: white;
text-align: center; text-align: center;
padding: 4px; padding: 4px;
@ -244,7 +253,7 @@ tr:focus {
height: 175px; /* Full height */ height: 175px; /* Full height */
/*margin: 50% auto;*/ /*margin: 50% auto;*/
padding: 5px; padding: 5px;
border: 2px solid #66ff33; border: 2px solid var(--my-highlight-color);
width: 18%; width: 18%;
overflow: auto; /* Enable scroll if needed */ overflow: auto; /* Enable scroll if needed */
background-color: #444; /* Fallback color */ background-color: #444; /* Fallback color */

9
css/terminal.css
View File

@ -15,11 +15,12 @@
font-size: 16px; font-size: 16px;
overflow: auto; overflow: auto;
overflow-y: scroll; overflow-y: scroll;
background-color: var(--my-background-color);
} }
#terminal-input { #terminal-input {
background-color: black; background-color: var(--my-background-color);
color: #66ff33; color: var(--my-font-color);
transition: height 1s; transition: height 1s;
} }
@ -29,10 +30,10 @@
padding: 0px !important; padding: 0px !important;
margin: 0px !important; margin: 0px !important;
border: 0px; border: 0px;
background-color: black; background-color: var(--my-background-color);
font-size: 16px; font-size: 16px;
outline: none; outline: none;
color: #66ff33; color: var(--my-font-color);
} }

4
css/workinprogress.css
View File

@ -1,5 +1,5 @@
#work-in-progress-container { #work-in-progress-container {
color: #66ff33; color: var(--my-font-color);
position: fixed; position: fixed;
padding-top: 10px; padding-top: 10px;
padding-left: 10px; padding-left: 10px;
@ -8,7 +8,7 @@
} }
#work-in-progress-text { #work-in-progress-text {
color: #66ff33; color: var(--my-font-color);
width: 70%; width: 70%;
} }

45
src/Terminal.js
View File

@ -2,18 +2,18 @@
/* Write text to terminal */ /* Write text to terminal */
var post = function(input) { var post = function(input) {
$("#terminal-input").before('<tr class="posted"><td style="color: #66ff33;">' + input.replace( / /g, "&nbsp;" ) + '</td></tr>'); $("#terminal-input").before('<tr class="posted"><td style="color: var(--my-font-color); background-color: var(--my-background-color);">' + input.replace( / /g, "&nbsp;" ) + '</td></tr>');
updateTerminalScroll(); updateTerminalScroll();
} }
//Same thing as post but the td cells have ids so they can be animated for the hack progress bar //Same thing as post but the td cells have ids so they can be animated for the hack progress bar
var hackProgressBarPost = function(input) { var hackProgressBarPost = function(input) {
$("#terminal-input").before('<tr class="posted"><td id="hack-progress-bar" style="color: #66ff33;">' + input + '</td></tr>'); $("#terminal-input").before('<tr class="posted"><td id="hack-progress-bar" style="color: var(--my-font-color); background-color: var(--my-background-color);">' + input + '</td></tr>');
updateTerminalScroll(); updateTerminalScroll();
} }
var hackProgressPost = function(input) { var hackProgressPost = function(input) {
$("#terminal-input").before('<tr class="posted"><td id="hack-progress" style="color: #66ff33;">' + input + '</td></tr>'); $("#terminal-input").before('<tr class="posted"><td id="hack-progress" style="color: var(--my-font-color); background-color: var(--my-background-color);">' + input + '</td></tr>');
updateTerminalScroll(); updateTerminalScroll();
} }
@ -238,7 +238,7 @@ function determineAllPossibilitiesForTabCompletion(input, index=0) {
return ["alias", "analyze", "cat", "clear", "cls", "connect", "free", return ["alias", "analyze", "cat", "clear", "cls", "connect", "free",
"hack", "help", "home", "hostname", "ifconfig", "kill", "killall", "hack", "help", "home", "hostname", "ifconfig", "kill", "killall",
"ls", "mem", "nano", "ps", "rm", "run", "scan", "scan-analyze", "ls", "mem", "nano", "ps", "rm", "run", "scan", "scan-analyze",
"scp", "sudov", "tail", "top"]; "scp", "sudov", "tail", "theme", "top"];
} }
if (input.startsWith("scp ") && index == 1) { if (input.startsWith("scp ") && index == 1) {
@ -933,6 +933,43 @@ var Terminal = {
} }
post("Error: No such script exists"); post("Error: No such script exists");
}
break;
case "theme":
//todo support theme saving
var args = commandArray[1] ? commandArray[1].split(" ") : [];
if(args.length != 1 && args.length != 3) {
post("Incorrect number of arguments. Usage: theme [default|muted|solarized] | [background color hex] [text color hex] [highlight color hex]");
}else if(args.length == 1){
var themeName = args[0];
if(themeName == "default"){
document.body.style.setProperty('--my-highlight-color',"#ffffff");
document.body.style.setProperty('--my-font-color',"#66ff33");
document.body.style.setProperty('--my-background-color',"#000000");
}else if(themeName == "muted"){
document.body.style.setProperty('--my-highlight-color',"#ffffff");
document.body.style.setProperty('--my-font-color',"#66ff33");
document.body.style.setProperty('--my-background-color',"#252527");
}else if(themeName == "solarized"){
document.body.style.setProperty('--my-highlight-color',"#6c71c4");
document.body.style.setProperty('--my-font-color',"#839496");
document.body.style.setProperty('--my-background-color',"#002b36");
}else{
post("Theme not found");
}
}else{
inputBackgroundHex = args[0];
inputTextHex = args[1];
inputHighlightHex = args[2];
if(/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(inputBackgroundHex) &&
/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(inputTextHex) &&
/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(inputHighlightHex)){
document.body.style.setProperty('--my-highlight-color',inputHighlightHex);
document.body.style.setProperty('--my-font-color',inputTextHex);
document.body.style.setProperty('--my-background-color',inputBackgroundHex);
}else{
post("Invalid Hex Input for theme");
}
} }
break; break;
case "top": case "top":