From fe5764a877e352e350844af8f2f0db76ae356f54 Mon Sep 17 00:00:00 2001 From: SKANKHUNTER <31552675+MrBurrBurr@users.noreply.github.com> Date: Sun, 18 Feb 2018 16:32:07 +0100 Subject: [PATCH] IPC GUI Update Nr.3 (#747) * Added error handling for config changer * Added error handling for log * Added prepareBotConfigForSaving function * Misc * Misc * prepareBotConfigForSaving is now dynamic * Misc * Misc * Add quick example for new skin * Added new skin "teal" Prepare for nightmode * Cleanup new skin * Added nightmode support * Misc * Added basic nightmode theme * Misc * Misc * Remove light skins * for testing purposes * Misc * [Global] Fix loading animation 'overlay' (broke w/ font-awesome 5 upgrade) * [Global] Add updated font-awesome values from AdminLTE.css to app.css * Update nightmode * Misc * Added loading animation for bot box * Changed design of checkbox in sidebar * Changed design of checkboxes on commands page and bots page * Fixed commands dropdown and bots dropdown on commands page being cut off * Cleanup * Fixed loading animation showing on expanding box * Latest nightmode changes * Fix * Misc * Misc * Misc * fix * Added basic multi select for bots Misc Updated nightmode theme * Fix for description of commands * Added new design for scrollbars, thx JourneyOver * Misc * Fix * Misc * Misc --- ArchiSteamFarm/www/css/_all-skins.min.css | 1 + ArchiSteamFarm/www/css/_nightmode.min.css | 1 + ArchiSteamFarm/www/css/app.css | 73 ++- ArchiSteamFarm/www/js/app.js | 726 ++++++++++++---------- ArchiSteamFarm/www/pages/bots.html | 289 +++++---- ArchiSteamFarm/www/pages/command.html | 236 ++++--- ArchiSteamFarm/www/pages/config.html | 95 ++- ArchiSteamFarm/www/pages/log.html | 107 ++-- 8 files changed, 864 insertions(+), 664 deletions(-) create mode 100644 ArchiSteamFarm/www/css/_all-skins.min.css create mode 100644 ArchiSteamFarm/www/css/_nightmode.min.css diff --git a/ArchiSteamFarm/www/css/_all-skins.min.css b/ArchiSteamFarm/www/css/_all-skins.min.css new file mode 100644 index 000000000..cd0941635 --- /dev/null +++ b/ArchiSteamFarm/www/css/_all-skins.min.css @@ -0,0 +1 @@ +.skin-blue .main-header .navbar{background-color:#3c8dbc }.skin-blue .main-header .navbar .nav>li>a{color:#fff }.skin-blue .main-header .navbar .nav>li>a:hover,.skin-blue .main-header .navbar .nav>li>a:active,.skin-blue .main-header .navbar .nav>li>a:focus,.skin-blue .main-header .navbar .nav .open>a,.skin-blue .main-header .navbar .nav .open>a:hover,.skin-blue .main-header .navbar .nav .open>a:focus,.skin-blue .main-header .navbar .nav>.active>a{background:rgba(0,0,0,0.1);color:#f6f6f6 }.skin-blue .main-header .navbar .sidebar-toggle{color:#fff }.skin-blue .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,0.1) }.skin-blue .main-header .navbar .sidebar-toggle{color:#fff }.skin-blue .main-header .navbar .sidebar-toggle:hover{background-color:#367fa9 }@media (max-width:767px){.skin-blue .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,0.1) }.skin-blue .main-header .navbar .dropdown-menu li a{color:#fff }.skin-blue .main-header .navbar .dropdown-menu li a:hover{background:#367fa9 }}.skin-blue .main-header .logo{background-color:#367fa9;color:#fff;border-bottom:0 solid transparent }.skin-blue .main-header .logo:hover{background-color:#357ca5 }.skin-blue .main-header li.user-header{background-color:#3c8dbc }.skin-blue .content-header{background:transparent }.skin-blue .wrapper,.skin-blue .main-sidebar,.skin-blue .left-side{background-color:#222d32 }.skin-blue .user-panel>.info,.skin-blue .user-panel>.info>a{color:#fff }.skin-blue .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-blue .sidebar-menu>li>a{border-left:3px solid transparent }.skin-blue .sidebar-menu>li:hover>a,.skin-blue .sidebar-menu>li.active>a,.skin-blue .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-blue .sidebar-menu>li.active>a{border-left-color:#3c8dbc }.skin-blue .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-blue .sidebar a{color:#b8c7ce }.skin-blue .sidebar a:hover{text-decoration:none }.skin-blue .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-blue .sidebar-menu .treeview-menu>li.active>a,.skin-blue .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-blue .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-blue .sidebar-form input[type="text"],.skin-blue .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-blue .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-blue .sidebar-form input[type="text"]:focus,.skin-blue .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-blue .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-blue .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 }.skin-blue.layout-top-nav .main-header>.logo{background-color:#3c8dbc;color:#fff;border-bottom:0 solid transparent }.skin-blue.layout-top-nav .main-header>.logo:hover{background-color:#3b8ab8 }.skin-black .main-header{-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.05);box-shadow:0 1px 1px rgba(0,0,0,0.05) }.skin-black .main-header .navbar-toggle{color:#333 }.skin-black .main-header .navbar-brand{color:#333;border-right:1px solid #eee }.skin-black .main-header .navbar{background-color:#fff }.skin-black .main-header .navbar .nav>li>a{color:#333 }.skin-black .main-header .navbar .nav>li>a:hover,.skin-black .main-header .navbar .nav>li>a:active,.skin-black .main-header .navbar .nav>li>a:focus,.skin-black .main-header .navbar .nav .open>a,.skin-black .main-header .navbar .nav .open>a:hover,.skin-black .main-header .navbar .nav .open>a:focus,.skin-black .main-header .navbar .nav>.active>a{background:#fff;color:#999 }.skin-black .main-header .navbar .sidebar-toggle{color:#333 }.skin-black .main-header .navbar .sidebar-toggle:hover{color:#999;background:#fff }.skin-black .main-header .navbar>.sidebar-toggle{color:#333;border-right:1px solid #eee }.skin-black .main-header .navbar .navbar-nav>li>a{border-right:1px solid #eee }.skin-black .main-header .navbar .navbar-custom-menu .navbar-nav>li>a,.skin-black .main-header .navbar .navbar-right>li>a{border-left:1px solid #eee;border-right-width:0 }.skin-black .main-header>.logo{background-color:#fff;color:#333;border-bottom:0 solid transparent;border-right:1px solid #eee }.skin-black .main-header>.logo:hover{background-color:#fcfcfc }@media (max-width:767px){.skin-black .main-header>.logo{background-color:#222;color:#fff;border-bottom:0 solid transparent;border-right:none }.skin-black .main-header>.logo:hover{background-color:#1f1f1f }}.skin-black .main-header li.user-header{background-color:#222 }.skin-black .content-header{background:transparent;box-shadow:none }.skin-black .wrapper,.skin-black .main-sidebar,.skin-black .left-side{background-color:#222d32 }.skin-black .user-panel>.info,.skin-black .user-panel>.info>a{color:#fff }.skin-black .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-black .sidebar-menu>li>a{border-left:3px solid transparent }.skin-black .sidebar-menu>li:hover>a,.skin-black .sidebar-menu>li.active>a,.skin-black .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-black .sidebar-menu>li.active>a{border-left-color:#fff }.skin-black .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-black .sidebar a{color:#b8c7ce }.skin-black .sidebar a:hover{text-decoration:none }.skin-black .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-black .sidebar-menu .treeview-menu>li.active>a,.skin-black .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-black .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-black .sidebar-form input[type="text"],.skin-black .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-black .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-black .sidebar-form input[type="text"]:focus,.skin-black .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-black .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-black .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 }.skin-black .pace .pace-progress{background:#222 }.skin-black .pace .pace-activity{border-top-color:#222;border-left-color:#222 }.skin-green .main-header .navbar{background-color:#00a65a }.skin-green .main-header .navbar .nav>li>a{color:#fff }.skin-green .main-header .navbar .nav>li>a:hover,.skin-green .main-header .navbar .nav>li>a:active,.skin-green .main-header .navbar .nav>li>a:focus,.skin-green .main-header .navbar .nav .open>a,.skin-green .main-header .navbar .nav .open>a:hover,.skin-green .main-header .navbar .nav .open>a:focus,.skin-green .main-header .navbar .nav>.active>a{background:rgba(0,0,0,0.1);color:#f6f6f6 }.skin-green .main-header .navbar .sidebar-toggle{color:#fff }.skin-green .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,0.1) }.skin-green .main-header .navbar .sidebar-toggle{color:#fff }.skin-green .main-header .navbar .sidebar-toggle:hover{background-color:#008d4c }@media (max-width:767px){.skin-green .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,0.1) }.skin-green .main-header .navbar .dropdown-menu li a{color:#fff }.skin-green .main-header .navbar .dropdown-menu li a:hover{background:#008d4c }}.skin-green .main-header .logo{background-color:#008d4c;color:#fff;border-bottom:0 solid transparent }.skin-green .main-header .logo:hover{background-color:#008749 }.skin-green .main-header li.user-header{background-color:#00a65a }.skin-green .content-header{background:transparent }.skin-green .wrapper,.skin-green .main-sidebar,.skin-green .left-side{background-color:#222d32 }.skin-green .user-panel>.info,.skin-green .user-panel>.info>a{color:#fff }.skin-green .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-green .sidebar-menu>li>a{border-left:3px solid transparent }.skin-green .sidebar-menu>li:hover>a,.skin-green .sidebar-menu>li.active>a,.skin-green .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-green .sidebar-menu>li.active>a{border-left-color:#00a65a }.skin-green .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-green .sidebar a{color:#b8c7ce }.skin-green .sidebar a:hover{text-decoration:none }.skin-green .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-green .sidebar-menu .treeview-menu>li.active>a,.skin-green .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-green .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-green .sidebar-form input[type="text"],.skin-green .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-green .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-green .sidebar-form input[type="text"]:focus,.skin-green .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-green .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-green .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 }.skin-red .main-header .navbar{background-color:#dd4b39 }.skin-red .main-header .navbar .nav>li>a{color:#fff }.skin-red .main-header .navbar .nav>li>a:hover,.skin-red .main-header .navbar .nav>li>a:active,.skin-red .main-header .navbar .nav>li>a:focus,.skin-red .main-header .navbar .nav .open>a,.skin-red .main-header .navbar .nav .open>a:hover,.skin-red .main-header .navbar .nav .open>a:focus,.skin-red .main-header .navbar .nav>.active>a{background:rgba(0,0,0,0.1);color:#f6f6f6 }.skin-red .main-header .navbar .sidebar-toggle{color:#fff }.skin-red .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,0.1) }.skin-red .main-header .navbar .sidebar-toggle{color:#fff }.skin-red .main-header .navbar .sidebar-toggle:hover{background-color:#d73925 }@media (max-width:767px){.skin-red .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,0.1) }.skin-red .main-header .navbar .dropdown-menu li a{color:#fff }.skin-red .main-header .navbar .dropdown-menu li a:hover{background:#d73925 }}.skin-red .main-header .logo{background-color:#d73925;color:#fff;border-bottom:0 solid transparent }.skin-red .main-header .logo:hover{background-color:#d33724 }.skin-red .main-header li.user-header{background-color:#dd4b39 }.skin-red .content-header{background:transparent }.skin-red .wrapper,.skin-red .main-sidebar,.skin-red .left-side{background-color:#222d32 }.skin-red .user-panel>.info,.skin-red .user-panel>.info>a{color:#fff }.skin-red .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-red .sidebar-menu>li>a{border-left:3px solid transparent }.skin-red .sidebar-menu>li:hover>a,.skin-red .sidebar-menu>li.active>a,.skin-red .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-red .sidebar-menu>li.active>a{border-left-color:#dd4b39 }.skin-red .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-red .sidebar a{color:#b8c7ce }.skin-red .sidebar a:hover{text-decoration:none }.skin-red .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-red .sidebar-menu .treeview-menu>li.active>a,.skin-red .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-red .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-red .sidebar-form input[type="text"],.skin-red .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-red .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-red .sidebar-form input[type="text"]:focus,.skin-red .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-red .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-red .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 }.skin-yellow .main-header .navbar{background-color:#f39c12 }.skin-yellow .main-header .navbar .nav>li>a{color:#fff }.skin-yellow .main-header .navbar .nav>li>a:hover,.skin-yellow .main-header .navbar .nav>li>a:active,.skin-yellow .main-header .navbar .nav>li>a:focus,.skin-yellow .main-header .navbar .nav .open>a,.skin-yellow .main-header .navbar .nav .open>a:hover,.skin-yellow .main-header .navbar .nav .open>a:focus,.skin-yellow .main-header .navbar .nav>.active>a{background:rgba(0,0,0,0.1);color:#f6f6f6 }.skin-yellow .main-header .navbar .sidebar-toggle{color:#fff }.skin-yellow .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,0.1) }.skin-yellow .main-header .navbar .sidebar-toggle{color:#fff }.skin-yellow .main-header .navbar .sidebar-toggle:hover{background-color:#e08e0b }@media (max-width:767px){.skin-yellow .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,0.1) }.skin-yellow .main-header .navbar .dropdown-menu li a{color:#fff }.skin-yellow .main-header .navbar .dropdown-menu li a:hover{background:#e08e0b }}.skin-yellow .main-header .logo{background-color:#e08e0b;color:#fff;border-bottom:0 solid transparent }.skin-yellow .main-header .logo:hover{background-color:#db8b0b }.skin-yellow .main-header li.user-header{background-color:#f39c12 }.skin-yellow .content-header{background:transparent }.skin-yellow .wrapper,.skin-yellow .main-sidebar,.skin-yellow .left-side{background-color:#222d32 }.skin-yellow .user-panel>.info,.skin-yellow .user-panel>.info>a{color:#fff }.skin-yellow .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-yellow .sidebar-menu>li>a{border-left:3px solid transparent }.skin-yellow .sidebar-menu>li:hover>a,.skin-yellow .sidebar-menu>li.active>a,.skin-yellow .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-yellow .sidebar-menu>li.active>a{border-left-color:#f39c12 }.skin-yellow .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-yellow .sidebar a{color:#b8c7ce }.skin-yellow .sidebar a:hover{text-decoration:none }.skin-yellow .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-yellow .sidebar-menu .treeview-menu>li.active>a,.skin-yellow .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-yellow .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-yellow .sidebar-form input[type="text"],.skin-yellow .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-yellow .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-yellow .sidebar-form input[type="text"]:focus,.skin-yellow .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-yellow .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-yellow .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 }.skin-purple .main-header .navbar{background-color:#605ca8 }.skin-purple .main-header .navbar .nav>li>a{color:#fff }.skin-purple .main-header .navbar .nav>li>a:hover,.skin-purple .main-header .navbar .nav>li>a:active,.skin-purple .main-header .navbar .nav>li>a:focus,.skin-purple .main-header .navbar .nav .open>a,.skin-purple .main-header .navbar .nav .open>a:hover,.skin-purple .main-header .navbar .nav .open>a:focus,.skin-purple .main-header .navbar .nav>.active>a{background:rgba(0,0,0,0.1);color:#f6f6f6 }.skin-purple .main-header .navbar .sidebar-toggle{color:#fff }.skin-purple .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,0.1) }.skin-purple .main-header .navbar .sidebar-toggle{color:#fff }.skin-purple .main-header .navbar .sidebar-toggle:hover{background-color:#555299 }@media (max-width:767px){.skin-purple .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,0.1) }.skin-purple .main-header .navbar .dropdown-menu li a{color:#fff }.skin-purple .main-header .navbar .dropdown-menu li a:hover{background:#555299 }}.skin-purple .main-header .logo{background-color:#555299;color:#fff;border-bottom:0 solid transparent }.skin-purple .main-header .logo:hover{background-color:#545096 }.skin-purple .main-header li.user-header{background-color:#605ca8 }.skin-purple .content-header{background:transparent }.skin-purple .wrapper,.skin-purple .main-sidebar,.skin-purple .left-side{background-color:#222d32 }.skin-purple .user-panel>.info,.skin-purple .user-panel>.info>a{color:#fff }.skin-purple .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-purple .sidebar-menu>li>a{border-left:3px solid transparent }.skin-purple .sidebar-menu>li:hover>a,.skin-purple .sidebar-menu>li.active>a,.skin-purple .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-purple .sidebar-menu>li.active>a{border-left-color:#605ca8 }.skin-purple .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-purple .sidebar a{color:#b8c7ce }.skin-purple .sidebar a:hover{text-decoration:none }.skin-purple .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-purple .sidebar-menu .treeview-menu>li.active>a,.skin-purple .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-purple .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-purple .sidebar-form input[type="text"],.skin-purple .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-purple .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-purple .sidebar-form input[type="text"]:focus,.skin-purple .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-purple .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-purple .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 }.skin-teal .main-header .navbar{background-color:#359392 }.skin-teal .main-header .navbar .nav>li>a{color:#fff }.skin-teal .main-header .navbar .nav>li>a:hover,.skin-teal .main-header .navbar .nav>li>a:active,.skin-teal .main-header .navbar .nav>li>a:focus,.skin-teal .main-header .navbar .nav .open>a,.skin-teal .main-header .navbar .nav .open>a:hover,.skin-teal .main-header .navbar .nav .open>a:focus,.skin-teal .main-header .navbar .nav>.active>a{background:rgba(0,0,0,.1);color:#f6f6f6 }.skin-teal .main-header .navbar .sidebar-toggle{color:#fff }.skin-teal .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,.1) }.skin-teal .main-header .navbar .sidebar-toggle{color:#fff }.skin-teal .main-header .navbar .sidebar-toggle:hover{background-color:#297776 }@media (max-width:767px){.skin-teal .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,.1) }.skin-teal .main-header .navbar .dropdown-menu li a{color:#fff }.skin-teal .main-header .navbar .dropdown-menu li a:hover{background:#e08e0b }}.skin-teal .main-header .logo{background-color:#297776;color:#fff;border-bottom:0 solid transparent }.skin-teal .main-header .logo:hover{background-color:#216362 }.skin-teal .main-header li.user-header{background-color:#359392 }.skin-teal .content-header{background:transparent }.skin-teal .wrapper,.skin-teal .main-sidebar,.skin-teal .left-side{background-color:#222d32 }.skin-teal .user-panel>.info,.skin-teal .user-panel>.info>a{color:#fff }.skin-teal .sidebar-menu>li.header{color:#4b646f;background:#1a2226 }.skin-teal .sidebar-menu>li>a{border-left:3px solid transparent }.skin-teal .sidebar-menu>li:hover>a,.skin-teal .sidebar-menu>li.active>a,.skin-teal .sidebar-menu>li.menu-open>a{color:#fff;background:#1e282c }.skin-teal .sidebar-menu>li.active>a{border-left-color:#359392 }.skin-teal .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41 }.skin-teal .sidebar a{color:#b8c7ce }.skin-teal .sidebar a:hover{text-decoration:none }.skin-teal .sidebar-menu .treeview-menu>li>a{color:#8aa4af }.skin-teal .sidebar-menu .treeview-menu>li.active>a,.skin-teal .sidebar-menu .treeview-menu>li>a:hover{color:#fff }.skin-teal .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px }.skin-teal .sidebar-form input[type="text"],.skin-teal .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px }.skin-teal .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:2px }.skin-teal .sidebar-form input[type="text"]:focus,.skin-teal .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666 }.skin-teal .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff }.skin-teal .sidebar-form .btn{color:#999;border-top-left-radius:0;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:0 } \ No newline at end of file diff --git a/ArchiSteamFarm/www/css/_nightmode.min.css b/ArchiSteamFarm/www/css/_nightmode.min.css new file mode 100644 index 000000000..a1328d33f --- /dev/null +++ b/ArchiSteamFarm/www/css/_nightmode.min.css @@ -0,0 +1 @@ +[class*=nightmode] ::-webkit-scrollbar{width:10px;height:10px;background-color:#333}[class*=nightmode] ::-webkit-scrollbar-thumb{-webkit-border-radius:2px;border-radius:2px;background:#555}[class*=nightmode] :focus{outline:0!important}[class*=nightmode].skin-black .main-header .navbar{background-color:#161616!important}[class*=nightmode].skin-blue .main-header .navbar,[class*=nightmode].skin-green .main-header .navbar,[class*=nightmode].skin-purple .main-header .navbar,[class*=nightmode].skin-red .main-header .navbar,[class*=nightmode].skin-teal .main-header .navbar,[class*=nightmode].skin-yellow .main-header .navbar{box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-black .main-header .logo{border:transparent;color:#6e7375;background-color:#161616}[class*=nightmode].skin-black .main-header .logo:hover{background-color:#232323}[class*=nightmode].skin-blue .main-header .logo,[class*=nightmode].skin-green .main-header .logo,[class*=nightmode].skin-purple .main-header .logo,[class*=nightmode].skin-red .main-header .logo,[class*=nightmode].skin-teal .main-header .logo,[class*=nightmode].skin-yellow .main-header .logo{border-bottom:transparent;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-blue .main-header .logo:hover,[class*=nightmode].skin-green .main-header .logo:hover,[class*=nightmode].skin-purple .main-header .logo:hover,[class*=nightmode].skin-red .main-header .logo:hover,[class*=nightmode].skin-teal .main-header .logo:hover,[class*=nightmode].skin-yellow .main-header .logo:hover{box-shadow:inset 0 0 0 1000px rgba(64,64,64,.72)!important}[class*=nightmode] .content-wrapper{background-color:#111}[class*=nightmode].layout-boxed{background:rgba(22,22,22,.8901960784313725)}[class*=nightmode] .main-footer{border-top:1px solid #161616;color:#6e7375;background:#161616}[class*=nightmode] .main-footer a{color:#23527c}[class*=nightmode] .main-footer a:hover{color:#337ab7}[class*=nightmode] .sweet-alert{color:#a6acaf;background-color:#161616}[class*=nightmode] .text-muted{color:#a6acaf}[class*=nightmode] .sweet-alert .sa-icon.sa-custom::after,[class*=nightmode] .sweet-alert .sa-icon.sa-custom::before,[class*=nightmode] .sweet-alert .sa-icon.sa-error::after,[class*=nightmode] .sweet-alert .sa-icon.sa-error::before,[class*=nightmode] .sweet-alert .sa-icon.sa-info::after,[class*=nightmode] .sweet-alert .sa-icon.sa-info::before,[class*=nightmode] .sweet-alert .sa-icon.sa-success::after,[class*=nightmode] .sweet-alert .sa-icon.sa-success::before,[class*=nightmode] .sweet-alert .sa-icon.sa-warning::after,[class*=nightmode] .sweet-alert .sa-icon.sa-warning::before,[class*=nightmode] [class=sa-fix]{background:0 0!important}[class*=nightmode] .btn-default,[class*=nightmode] .btn-primary{border-color:#000102;color:#aaadaf;background-color:#1d1e22}[class*=nightmode] .btn:focus{color:#6e7375;background-color:#1d1e22}[class*=nightmode] .btn-danger,[class*=nightmode] .btn-danger:focus{border-color:#000102!important;color:#aaadaf;box-shadow:inset 0 0 0 1000px rgba(58,4,4,.66)!important}[class*=nightmode] .btn-danger:focus{background-color:#dd4b39!important}[class*=nightmode] .btn-danger:hover{border-color:#000102!important;box-shadow:inset 0 0 0 1000px rgba(13,1,1,.66)!important}[class*=nightmode] .btn-default:active,[class*=nightmode] .btn-default:active:focus,[class*=nightmode] .btn-default:focus,[class*=nightmode] .btn-default:hover,[class*=nightmode] .btn-primary:hover,[class*=nightmode] .open>.dropdown-toggle.btn-default{border-color:#000102!important;color:#b9b4b4!important;background-color:#2c2c33!important}[class*=nightmode] .form-control{border-color:#000102;color:#a6acaf;background:#1d1e22}[class*=nightmode] .main-header .navbar .nav>li>a,[class*=nightmode] .main-header .navbar .sidebar-toggle{color:#a6acaf}[class*=nightmode].skin-black .main-header .navbar .nav .open>a,[class*=nightmode].skin-black .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-black .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-black .main-header .navbar .nav>.active>a,[class*=nightmode].skin-black .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-black .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-black .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-black .main-header .navbar .sidebar-toggle:hover{background:#232323}[class*=nightmode].skin-black .main-header .navbar .navbar-custom-menu .navbar-nav>li>a,[class*=nightmode].skin-black .main-header .navbar .navbar-right>li>a,[class*=nightmode].skin-black .main-header .navbar>.sidebar-toggle{border:none}[class*=nightmode].skin-blue .main-header .navbar .nav .open>a,[class*=nightmode].skin-blue .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-blue .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-blue .main-header .navbar .nav>.active>a,[class*=nightmode].skin-blue .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-blue .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-blue .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-blue .main-header .navbar .sidebar-toggle:hover{background:#075d8f;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-purple .main-header .navbar .nav .open>a,[class*=nightmode].skin-purple .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-purple .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-purple .main-header .navbar .nav>.active>a,[class*=nightmode].skin-purple .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-purple .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-purple .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-purple .main-header .navbar .sidebar-toggle:hover{background:#3f3982;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-green .main-header .navbar .nav .open>a,[class*=nightmode].skin-green .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-green .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-green .main-header .navbar .nav>.active>a,[class*=nightmode].skin-green .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-green .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-green .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-green .main-header .navbar .sidebar-toggle:hover{background:#258b4a;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-red .main-header .navbar .nav .open>a,[class*=nightmode].skin-red .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-red .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-red .main-header .navbar .nav>.active>a,[class*=nightmode].skin-red .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-red .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-red .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-red .main-header .navbar .sidebar-toggle:hover{background:#b92d2d;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-yellow .main-header .navbar .nav .open>a,[class*=nightmode].skin-yellow .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-yellow .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-yellow .main-header .navbar .nav>.active>a,[class*=nightmode].skin-yellow .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-yellow .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-yellow .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-yellow .main-header .navbar .sidebar-toggle:hover{background:#be7e1c;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode].skin-teal .main-header .navbar .nav .open>a,[class*=nightmode].skin-teal .main-header .navbar .nav .open>a:focus,[class*=nightmode].skin-teal .main-header .navbar .nav .open>a:hover,[class*=nightmode].skin-teal .main-header .navbar .nav>.active>a,[class*=nightmode].skin-teal .main-header .navbar .nav>li>a:active,[class*=nightmode].skin-teal .main-header .navbar .nav>li>a:focus,[class*=nightmode].skin-teal .main-header .navbar .nav>li>a:hover,[class*=nightmode].skin-teal .main-header .navbar .sidebar-toggle:hover{background:#216362;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode] .control-sidebar-dark,[class*=nightmode] .control-sidebar-dark+.control-sidebar-bg,[class*=nightmode] .main-sidebar{background-color:#1a1a1a}[class*=nightmode] .sidebar-menu>li.header{color:#a6acaf;background:#151414}[class*=nightmode].skin-black .sidebar-menu>li.active>a{border-left-color:#6e7375}[class*=nightmode] .sidebar-menu>li.active>a,[class*=nightmode] .sidebar-menu>li.menu-open>a,[class*=nightmode] .sidebar-menu>li:hover>a{color:#ebebeb;background:#272626;box-shadow:inset 0 0 0 1000px rgba(60,56,56,.1)!important}[class*=nightmode] .bg-blue,[class*=nightmode] .bg-gray,[class*=nightmode] .bg-olive,[class*=nightmode] .bg-yellow{color:#000!important;box-shadow:inset 0 0 0 1000px rgba(0,0,0,.2)!important}[class*=nightmode] .box-header,[class*=nightmode] .breadcrumb>.active,[class*=nightmode] .breadcrumb>li,[class*=nightmode] h1{color:#7d8284}[class*=nightmode] .box{border-top:none}[class*=nightmode] .box-header.with-border{border-bottom:none}[class*=nightmode] .box-body,[class*=nightmode] .box-footer,[class*=nightmode] .box-header{border:none;border-bottom-right-radius:0;border-bottom-left-radius:0;background:#222}[class*=nightmode] .info-box{border:1px solid #2b2929;color:#a6acaf;background:#161616}[class*=nightmode] [class*=info-box-icon]{border-right:1px solid #2b2929;border-bottom:1px solid #2b2929;box-shadow:inset 0 0 0 1000px rgba(64,64,64,.66)!important}[class*=nightmode] .box-header>.box-tools.pull-right .dropdown-menu,[class*=nightmode] .scrollable-menu{border:none;background:#161616}[class*=nightmode] .scrollable-menu>li>a{color:#a6acaf}[class*=nightmode] .scrollable-menu>li>a:hover{color:#b1b8bb;background-color:#232323}[class*=nightmode] .dropdown-menu>.divider{background-color:#000102}[class*=nightmode] #commandSent,[class*=nightmode] .box-content-command,[class*=nightmode] .box-content-log{border:1px solid #000102;color:#a8a8a8;background:#161616}[class*=nightmode] #commandSent{border-top:none}[class*=nightmode] .nav-tabs-custom,[class*=nightmode] .nav-tabs-custom>.nav-tabs>li.active:hover>a{color:#a8a8a8;background:#222}[class*=nightmode] .nav-tabs-custom>.nav-tabs{border-bottom:1px solid #000102}[class*=nightmode] .nav-tabs-custom>.nav-tabs>li>a{color:#a8a8a8}[class*=nightmode] .nav-tabs-custom>.nav-tabs>li.active>a{border-right-color:#000102;border-left-color:#000102;color:#a8a8a8;background:#222}[class*=nightmode] .nav-tabs-custom>.nav-tabs>li.active{border-top-color:#6e7375} \ No newline at end of file diff --git a/ArchiSteamFarm/www/css/app.css b/ArchiSteamFarm/www/css/app.css index 16d845f5a..14be7f171 100644 --- a/ArchiSteamFarm/www/css/app.css +++ b/ArchiSteamFarm/www/css/app.css @@ -6,7 +6,6 @@ width: auto; height: 400px; padding: 6px 12px; - overflow-y: scroll; white-space: pre-line; border-color: rgb(221, 221, 221); border-style: solid; @@ -18,26 +17,22 @@ width: auto; height: 400px; padding: 6px 12px; - overflow-y: scroll; white-space: pre-line; border-color: rgb(221, 221, 221); border-style: solid; border-width: 1px; - background-color: rgb(255, 255, 255); overflow: auto; -} - -.bg-gray { - color: #fff; -} - -#commandReply { font-family: monospace, monospace; color: rgb(255, 255, 255); font-size: 14px; background-color: #000000; } +.bg-gray { + color: rgb(255, 255, 255); + background-color: #bfc3cb !important; +} + #commandSent { font-family: monospace, monospace; font-size: 12px; @@ -122,7 +117,59 @@ button.bot-resumed:hover { } } -input[type=checkbox].dropdown-checkbox { - margin-left: 10px; - margin-right: 5px; +.btn-badge { + width: 18px; + height: 18px; + text-align: center; + padding: 6px 0; + font-size: 12px; + line-height: 1.42; + border-radius: .25em; +} + +.btn-badge-active { + border-color: white; +} + +.box .overlay, .overlay-wrapper .overlay { + background: none; + position: absolute; + top: 50%; + left: 50%; + margin-left: -15px; + margin-top: -15px; + font-size: 30px +} + +.box .overlay, .overlay-wrapper .overlay .bot-box-loading { + font-size: 20px +} + +.main-header .sidebar-toggle:before { + content: none; +} + +.form-group-config { + margin-bottom: 10px; +} + +::-webkit-scrollbar { + width: 10px; + height: 10px; + background-color: #333; +} + +::-webkit-scrollbar-thumb { + -webkit-border-radius: 2px; + border-radius: 2px; + background: rgb(167, 167, 167); +} + +#botRow .ui-selecting { + background: #FECA40; +} + +#botRow .ui-selected { + background: #F39814; + color: white; } diff --git a/ArchiSteamFarm/www/js/app.js b/ArchiSteamFarm/www/js/app.js index 5e7408d77..005c872f3 100644 --- a/ArchiSteamFarm/www/js/app.js +++ b/ArchiSteamFarm/www/js/app.js @@ -1,7 +1,5 @@ //#region Utils -if (typeof jQuery === 'undefined') { - throw new Error('ASF App requires jQuery'); -} +if (typeof jQuery === 'undefined') throw new Error('ASF App requires jQuery'); function get(name) { if (typeof Storage !== 'undefined') { @@ -41,21 +39,12 @@ function getIPCPassword() { title: "Success!", text: "Your IPC password has been saved.", type: "success" - }, function () { - location.reload(); - }); + }, function () { location.reload(); }); }); } var IPCPassword = get('IPCPassword'); - -if (IPCPassword) { - $.ajaxSetup({ - beforeSend: function (jqXHR) { - jqXHR.setRequestHeader('Authentication', IPCPassword); - } - }); -} +if (IPCPassword) $.ajaxSetup({ beforeSend: function (jqXHR) { jqXHR.setRequestHeader('Authentication', IPCPassword); } }); //#endregion Utils //#region Footer @@ -63,20 +52,13 @@ $('.main-footer').ready(function () { $.ajax({ url: "/Api/ASF", type: "GET", - statusCode: { - 401: function () { - getIPCPassword(); - } - }, + statusCode: { 401: function () { getIPCPassword(); } }, success: function (data) { var obj = data["Result"].Version, version = obj.Major + '.' + obj.Minor + '.' + obj.Build + '.' + obj.Revision; - - // Add version to footer + $("#version").html('Version ' + version); - - // Change changelog link according to currently running version - document.getElementById("changelog").href = "https://github.com/JustArchi/ArchiSteamFarm/releases/tag/" + version; + $('#changelog').attr('href', 'https://github.com/JustArchi/ArchiSteamFarm/releases/tag/' + version); } }); }); @@ -102,71 +84,56 @@ $('.bot-status').ready(function () { if (KeepRunning === false) { offlineBots++; - $("#offlineBots").text(offlineBots); } else { if (TimeRemaining === "00:00:00") { idleBots++; - $("#idleBots").text(idleBots); } else { activeBots++; - $("#activeBots").text(activeBots); } } } + + $("#offlineBots").text(offlineBots); + $("#idleBots").text(idleBots); + $("#activeBots").text(activeBots); } }); } displayBotStatus(); - - window.setInterval(function () { - displayBotStatus(); - }, 5000); + window.setInterval(function () { displayBotStatus(); }, 5000); }); //#endregion Bot Status Buttons //#region ASF Information $('.info-overview').ready(function () { - // Display RAM usage function displayRAMUsage() { $.ajax({ url: "/Api/ASF", type: "GET", - success: function (data) { - $("#ramUsage").html((data["Result"].MemoryUsage / 1024).toFixed(2) + " MB"); - } + success: function (data) { $("#ramUsage").html((data["Result"].MemoryUsage / 1024).toFixed(2) + " MB"); } }); } displayRAMUsage(); - - window.setInterval(function () { - displayRAMUsage(); - }, 10000); - - // Display uptime + window.setInterval(function () { displayRAMUsage(); }, 10000); + function displayUptime() { $.ajax({ url: "/Api/ASF", type: "GET", - success: function (data) { - $("#uptime").html(uptimeToString(data["Result"].ProcessStartTime)); - } + success: function (data) { $("#uptime").html(uptimeToString(data["Result"].ProcessStartTime)); } }); } displayUptime(); - - window.setInterval(function () { - displayUptime(); - }, 60000); + window.setInterval(function () { displayUptime(); }, 60000); }); function uptimeToString(startTime) { - var processStartTime = new Date(startTime); - var currentDate = new Date(); - - var diff = currentDate.getTime() - processStartTime.getTime(); + var processStartTime = new Date(startTime), + currentDate = new Date(), + diff = currentDate.getTime() - processStartTime.getTime(); var days = Math.floor(diff / (1000 * 60 * 60 * 24)); diff -= days * (1000 * 60 * 60 * 24); @@ -184,15 +151,9 @@ function uptimeToString(startTime) { //#endregion ASF Information //#region Command Page -var cmdInput = document.getElementById('commandInput'); - -function fillCommand(cmd) { - cmdInput.value = cmd; -} - -function fillBots(bot) { - cmdInput.value = cmdInput.value + " " + bot; -} +var $cmdInput = $('#commandInput'); +function fillCommand(cmd) { $cmdInput.val(cmd); } +function fillBots(bot) { $cmdInput.val($cmdInput.val() + ' ' + bot); } function getDateAndTime() { var currentdate = new Date(); @@ -219,13 +180,11 @@ function logCommand(state, cmd) { } function sendCommand() { - var command = cmdInput.value, + var command = $cmdInput.val(), requestURL = "/Api/Command/" + command, tmpAutoClear = get('autoClear'); - if (command === "") { - return; - } + if (command === "") return; logCommand(true, command); @@ -240,7 +199,7 @@ function sendCommand() { $(".box-content-command").text(getDateAndTime() + ' Waiting for response...'); } - $("#commandReply").append('
'); + $(".box-content-command").append('
'); $.ajax({ url: requestURL, @@ -255,85 +214,179 @@ function sendCommand() { } }); - if (tmpAutoClear !== 'false') { - cmdInput.value = ""; - } + if (tmpAutoClear !== 'false') $cmdInput.val(''); } //#endregion Command Page //#region Config Changer Page -var infoMessageHTML = '
' - + '

Under development

' - + '

This feature is currently being developed.

' - + '
'; + +//#region New stuff +//const cachedTypeDefinitions = new Map(); +//const cachedStructureDefinitions = new Map(); + +//function request(method, url, data) { +// return new Promise((resolve, reject) => { +// $.ajax(url, { method, data }) +// .done(resolve) +// .fail(reject); +// }); +//} + +//function extract(key) { +// return obj => obj[key]; +//} + +//const API = { +// get: (endpoint, data) => request('GET', `/Api/${endpoint}`, data).then(extract('Result')), +// post: (endpoint, data) => request('POST', `/Api/${endpoint}`, data).then(extract('Result')) +//}; + +//const subtypeRegex = /\[[^\]]+\]/g; + +//function resolveSubtypes(type) { +// return type.match(subtypeRegex).map(subtype => subtype.slice(1, subtype.length - 1)); +//} + +//async function getStructureDefinition(type) { +// if (cachedStructureDefinitions.has(type)) return cachedStructureDefinitions.get(type); + +// const structureDefinition = API.get(`Structure/${encodeURIComponent(type)}`); +// cachedStructureDefinitions.set(type, structureDefinition); + +// return structureDefinition; +//} + +//async function getTypeDefinition(type) { +// if (cachedTypeDefinitions.has(type)) return cachedTypeDefinitions.get(type); + +// const typeDefinition = API.get(`Type/${encodeURIComponent(type)}`); +// cachedTypeDefinitions.set(type, typeDefinition); + +// return typeDefinition; +//} + +//async function resolveType(type) { +// switch (type.split('`')[0]) { +// case 'System.Boolean': +// return { type: 'boolean' }; +// case 'System.String': +// return { type: 'string' }; +// case 'System.Byte': +// return { type: 'smallNumber' }; +// case 'System.UInt32': +// return { type: 'number' }; +// case 'System.Collections.Generic.HashSet': +// const [subtype] = resolveSubtypes(type); +// return { type: 'hashSet', values: await resolveType(subtype) }; +// case 'System.UInt64': +// return { type: 'bigNumber' }; +// case 'System.Collections.Generic.Dictionary': +// const subtypes = resolveSubtypes(type); +// return { type: 'dictionary', key: await resolveType(subtypes[0]), value: await resolveType(subtypes[1]) }; +// default: // Complex type +// return unwindType(type); +// } +//} + +//async function unwindObject(type, typeDefinition) { +// const resolvedStructure = { +// type: 'object', +// body: {} +// }; + +// const [structureDefinition, resolvedTypes] = await Promise.all([ +// getStructureDefinition(type), +// Promise.all(Object.keys(typeDefinition.Body).map(async param => ({ param, type: await resolveType(typeDefinition.Body[param]) }))) +// ]); + +// for (const { param, type } of resolvedTypes) { +// const paramName = typeDefinition.Body[param] !== 'System.UInt64' ? param : `s_${param}`; + +// resolvedStructure.body[param] = { +// defaultValue: structureDefinition[param], +// paramName, +// ...type +// }; +// } + +// return resolvedStructure; +//} + +//async function unwindType(type) { +// if (type === 'ArchiSteamFarm.BotConfig') getStructureDefinition(type); // Dirty trick, but 30% is 30% +// const typeDefinition = await getTypeDefinition(type); + +// switch (typeDefinition.Properties.BaseType) { +// case 'System.Object': +// return unwindObject(type, typeDefinition); +// case 'System.Enum': +// return { type: (typeDefinition.Properties.CustomAttributes || []).includes('System.FlagsAttribute') ? 'flag' : 'enum', values: typeDefinition.Body }; +// default: +// const structureDefinition = await getStructureDefinition(type); +// return { type: 'unknown', typeDefinition, structureDefinition }; +// } +//} +//#endregion New stuff function generateConfigChangerHTML() { $.ajax({ url: "/Api/Type/ArchiSteamFarm.BotConfig", type: "GET", success: function (data) { - var obj = data["Result"]; - var boxBodyHTML = ""; - var textBoxes = ''; - var checkBoxes = ''; - var numberBoxes = ''; - var defaultBoxes = ''; + var obj = data["Result"], + objBody = obj["Body"], + boxBodyHTML = "", + textBoxes = '', + checkBoxes = '', + numberBoxes = '', + defaultBoxes = '', + textAreas = ''; - //console.log(obj) - - for (var key in obj) { - if (obj.hasOwnProperty(key)) { - var value = obj[key]; - var keyOne = key.replace(/([A-Z])/g, ' $1').trim(); - var keyWithSpace = keyOne.replace(/([A-Z])\s(?=[A-Z])/g, '$1'); + for (var key in objBody) { + if (objBody.hasOwnProperty(key)) { + var value = objBody[key], + noSpaceKey = key.replace(/([A-Z])/g, ' $1').trim(), + readableKey = noSpaceKey.replace(/([A-Z])\s(?=[A-Z])/g, '$1'); switch (value) { case 'System.Boolean': - // Add checkbox - checkBoxes += '
' - + '' - + '
'; - break; - case 'System.Byte': - // Add textbox - numberBoxes += '
' - + '' - + '' + checkBoxes += '
' + + '' + + readableKey + '
'; break; case 'System.String': - // Add textbox - textBoxes += '
' - + '' - + '' + textBoxes += '
' + + '' + + '' + + '
'; + break; + case 'System.Byte': + numberBoxes += '
' + + '' + + '' + '
'; break; case 'System.Collections.Generic.Dictionary`2[System.UInt64][ArchiSteamFarm.BotConfig+EPermission]': - // Add textarea - textBoxes += '
' - + '' - + '' + textAreas += '
' + + '' + + '' + '
'; break; default: - // Default use textbox - defaultBoxes += '
' - + '' - + '' + defaultBoxes += '
' + + '' + + '' + '
'; } } boxBodyHTML = '
' + defaultBoxes + '
' + '
' + textBoxes + numberBoxes + '
' - + '
' + checkBoxes + '
'; + + '
' + checkBoxes + textAreas + '
'; } - $('#configChangerTab').html(infoMessageHTML - + '
' + $('#configChangerTab').html('
' + '

' + '
' + '
' @@ -348,41 +401,79 @@ function generateConfigChangerHTML() { + '
' + boxBodyHTML + '
'); + + createClickFunction(); } }); } +function createClickFunction() { + var myNodeList = document.querySelectorAll('[data-type="System.Boolean"]'); + + for (i = 0; i < myNodeList.length; i++) { + var myID = myNodeList[i].id; + + $('#' + myID).bind("click", function () { + var $key = $('#' + this.id); + + if ($key.hasClass('text-grey')) { + $key.removeClass('text-grey'); + $key.addClass('text-olive'); + $('#ico' + this.id).removeClass('fa-rotate-180'); + $key.blur(); + } else { + $key.removeClass('text-olive'); + $key.addClass('text-grey'); + $('#ico' + this.id).addClass('fa-rotate-180'); + $key.blur(); + } + }); + } +} + +var globalBotConfig = {}; + function loadConfigValuesForBot(botName) { $.ajax({ url: "/Api/Bot/" + encodeURIComponent(botName), type: "GET", success: function (data) { - var obj = data["Result"]; - var objBot = obj[0]; - var BotConfig = objBot.BotConfig; + var obj = data["Result"], + objBot = obj[0], + BotConfig = objBot.BotConfig; - //console.log(BotConfig) + globalBotConfig = BotConfig; for (var key in BotConfig) { if (BotConfig.hasOwnProperty(key)) { - var value = BotConfig[key]; + var value = BotConfig[key], + $key = $('#' + key), + keyObj = $key[0]; - var $key = $('#' + key); - var keyObj = $key[0]; - var inputType = keyObj.type; + if (typeof keyObj === 'undefined') continue; - //console.log(key + ' - ' + inputType) + var inputType = keyObj.dataset.type; switch (inputType) { - case 'checkbox': - $key.prop('checked', value); + case 'System.Boolean': + if (value) { + $key.removeClass('text-grey'); + $key.addClass('text-olive'); + $('#ico' + key).removeClass('fa-rotate-180'); + } else { + $key.removeClass('text-olive'); + $key.addClass('text-grey'); + $('#ico' + key).addClass('fa-rotate-180'); + } break; - case 'textarea': - for (var key in value) { - if (value.hasOwnProperty(key)) { - var value = value[key]; - $key.append(key + ':' + value); - } + case 'System.UInt64': + $key.val(BotConfig['s_' + key]); + break; + case 'System.Collections.Generic.Dictionary`2[System.UInt64][ArchiSteamFarm.BotConfig+EPermission]': + $key.text(''); // Reset textarea before filling + + for (var steamID64 in value) { + if (value.hasOwnProperty(steamID64)) $key.append(steamID64 + ':' + value[steamID64] + '\n'); } break; default: @@ -390,44 +481,104 @@ function loadConfigValuesForBot(botName) { } } } - //setDefaultValues(); - + loadBotsDropDown(botName); } }); } -//function setDefaultValues() { -// $.ajax({ -// url: "/Api/Structure/ArchiSteamFarm.BotConfig", -// type: "GET", -// success: function (data) { -// botConfigStructure = data["Result"]; -// console.log(botConfigStructure) +function prepareBotConfigForSaving() { + var botName = $("#saveButton").data("BotName"), + BotConfig = globalBotConfig; -// for (var key in botConfigStructure) { -// if (botConfigStructure.hasOwnProperty(key)) { -// var value = botConfigStructure[key]; + for (var key in BotConfig) { + if (BotConfig.hasOwnProperty(key)) { + var value = BotConfig[key], + $key = $('#' + key), + keyObj = $key[0]; -// console.log(key + ' - ' + value) + if (typeof keyObj === 'undefined') continue; -// var $key = $('#' + key); -// var keyObj = $key[0]; -// var inputType = keyObj.type; + var inputType = keyObj.dataset.type, + $keyValue = $key.val(); -// switch (inputType) { -// case 'checkbox': -// break; -// default: -// if ($key.val() === '') { -// $key.val(value); -// } -// } -// } -// } -// } -// }); -//} + switch (inputType) { + case 'System.Boolean': + var $keyState = $('#ico' + key).hasClass('fa-rotate-180') ? false : true; + if ($keyState !== value) BotConfig[key] = $keyState; + break; + + case 'System.String': + if ($keyValue === '') $keyValue = null; + if ($keyValue !== value) BotConfig[key] = $keyValue; + break; + case 'System.UInt64': + if ($keyValue !== BotConfig['s_' + key]) { + delete BotConfig[key]; + BotConfig['s_' + key] = $keyValue; + } + break; + case 'System.Collections.Generic.HashSet`1[System.UInt32]': + var items = $keyValue.split(','); + if (items.map(Number) !== value) BotConfig[key] = items.map(Number); + break; + + case 'System.Collections.Generic.Dictionary`2[System.UInt64][ArchiSteamFarm.BotConfig+EPermission]': + var steamUserPermissions = {}, + permissions = [], + lines = $key.val().split('\n'); + + for (var i = 0; i < lines.length; i++) { + if (lines[i] !== '') permissions.push(lines[i].split(':')); + } + + for (var j = 0; j < permissions.length; j++) { + var obj = permissions[j]; + steamUserPermissions[obj[0]] = parseInt(obj[1]); + } + + if (steamUserPermissions !== value) BotConfig[key] = steamUserPermissions; + break; + + default: + if (typeof value === 'object') { + var objItems = $keyValue.split(','); + if (objItems.map(Number) !== value) BotConfig[key] = objItems.map(Number); + } else if (typeof value === 'number') { + var number = Number($keyValue); + if (number !== value) BotConfig[key] = number; + } else { + if ($keyValue !== value) BotConfig[key] = $keyValue; + } + } + } + } + + saveConfig(botName, { BotConfig }); +} + +function saveConfig(botName, config) { + $.ajax({ + url: "/Api/Bot/" + encodeURIComponent(botName), + type: "POST", + data: JSON.stringify(config), + contentType: "application/json", + success: function (data) { + swal({ + title: "Success!", + text: "<" + botName + "> and its config file got updated.", + type: "success" + }, function () { location.reload(); }); + }, + error: function (jqXHR, textStatus, errorThrown) { + swal({ + title: "Error!", + text: jqXHR.status + ' - ' + errorThrown, + type: "error" + }, function () { location.reload(); }); + } + }); +} function loadBotsDropDown(botName) { var botsDropDownHTML = ''; @@ -442,13 +593,13 @@ function loadBotsDropDown(botName) { var currentBot = obj[i], currentBotName = currentBot.BotName; - if (botName !== currentBotName) { - botsDropDownHTML += '
  • ' + currentBotName + '
    • '; - } + if (botName === currentBotName) continue; + + botsDropDownHTML += '
  • ' + currentBotName + '
    • '; } $(".box-title").html("Currently editing: " + botName + ""); - $("#saveConfig").data("BotName", botName); + $("#saveButton").data("BotName", botName); $("#botsDropDown").html(botsDropDownHTML); } }); @@ -461,45 +612,26 @@ $(function () { var mySkins = [ 'skin-blue', + 'skin-teal', 'skin-black', 'skin-red', 'skin-yellow', 'skin-purple', - 'skin-green', - 'skin-blue-light', - 'skin-black-light', - 'skin-red-light', - 'skin-yellow-light', - 'skin-purple-light', - 'skin-green-light' + 'skin-green' ]; function changeSkin(cls) { $.each(mySkins, function (i) { $('body').removeClass(mySkins[i]); + $('[data-skin="' + mySkins[i] + '"]').removeClass('btn-badge-active'); }); $('body').addClass(cls); - changeSidebarSkin(cls); + $('[data-skin="' + cls + '"]').addClass('btn-badge-active'); store('skin', cls); return false; } - function changeSidebarSkin(cls) { - var $sidebar = $('.control-sidebar'); - if (cls.includes("-light")) { - if ($sidebar.hasClass('control-sidebar-dark')) { - $sidebar.removeClass('control-sidebar-dark'); - $sidebar.addClass('control-sidebar-light'); - } - } else { - if ($sidebar.hasClass('control-sidebar-light')) { - $sidebar.removeClass('control-sidebar-light'); - $sidebar.addClass('control-sidebar-dark'); - } - } - } - function changeSetting() { swal({ title: "Are you sure?", @@ -515,9 +647,7 @@ $(function () { title: "Success!", text: "Your IPC password has been reset.", type: "success" - }, function () { - location.reload(); - }); + }, function () { location.reload(); }); }); } @@ -526,6 +656,9 @@ $(function () { if ($('body').hasClass('fixed')) { $('body').removeClass('fixed'); $('body').addClass('layout-boxed'); + $('#toggleBoxed').removeClass('text-grey'); + $('#toggleBoxed').addClass('text-olive'); + $('#iconBoxed').removeClass('fa-rotate-180'); } } } @@ -534,64 +667,75 @@ $(function () { if ($('body').hasClass('fixed')) { $('body').removeClass('fixed'); $('body').addClass('layout-boxed'); + $('#toggleBoxed').removeClass('text-grey'); + $('#toggleBoxed').addClass('text-olive'); + $('#iconBoxed').removeClass('fa-rotate-180'); + $('#toggleBoxed').blur(); store('layoutState', 'layout-boxed'); } else { $('body').removeClass('layout-boxed'); $('body').addClass('fixed'); + $('#toggleBoxed').removeClass('text-olive'); + $('#toggleBoxed').addClass('text-grey'); + $('#iconBoxed').addClass('fa-rotate-180'); + $('#toggleBoxed').blur(); store('layoutState', 'fixed'); } } - function saveLeftSidebarState() { - if ($('body').hasClass('sidebar-collapse')) { - store('leftSidebarState', 'normal'); - } else { - store('leftSidebarState', 'sidebar-collapse'); + function changeNightmode(savedNightmodeState) { + if (savedNightmodeState === 'nightmode') { + $('body').addClass('nightmode'); + $('#toggleNightmode').removeClass('text-grey'); + $('#toggleNightmode').addClass('text-olive'); + $('#iconNightmode').removeClass('fa-rotate-180'); } } - function changeLeftSidebarState(savedSidebarState) { - if (savedSidebarState === 'sidebar-collapse') { - $('body').addClass('sidebar-collapse'); + function toggleNightmode() { + if ($('body').hasClass('nightmode')) { + $('body').removeClass('nightmode'); + $('#toggleNightmode').removeClass('text-olive'); + $('#toggleNightmode').addClass('text-grey'); + $('#iconNightmode').addClass('fa-rotate-180'); + $('#toggleNightmode').blur(); + store('nightmodeState', null); + } else { + $('body').addClass('nightmode'); + $('#toggleNightmode').removeClass('text-grey'); + $('#toggleNightmode').addClass('text-olive'); + $('#iconNightmode').removeClass('fa-rotate-180'); + $('#toggleNightmode').blur(); + store('nightmodeState', 'nightmode'); } } function setup() { var tmpSkin = get('skin'), tmpLayoutState = get('layoutState'), + tmpNightmodeState = get('nightmodeState'), tmpLeftSidebarState = get('leftSidebarState'); - if (tmpSkin && $.inArray(tmpSkin, mySkins)) { - changeSkin(tmpSkin); - } - + if (tmpSkin && $.inArray(tmpSkin, mySkins)) changeSkin(tmpSkin); if (tmpLeftSidebarState) { - changeLeftSidebarState(tmpLeftSidebarState); - } + if (tmpLeftSidebarState === 'sidebar-collapse') { + $('body').addClass('sidebar-collapse'); + } + } + if (tmpLayoutState) changeBoxed(tmpLayoutState); + if (tmpNightmodeState) changeNightmode(tmpNightmodeState); - if (tmpLayoutState) { - changeBoxed(tmpLayoutState); - } - - $('[data-skin]').on('click', function (e) { - changeSkin($(this).data('skin')); + $('[data-skin]').on('click', function (e) { changeSkin($(this).data('skin')); }); + $('#toggleBoxed').on('click', function () { toggleBoxed(); }); + $('#toggleNightmode').on('click', function () { toggleNightmode(); }); + $('[data-general]').on('click', function () { changeSetting(); }); + $('#leftSidebar').on('click', function () { + if ($('body').hasClass('sidebar-collapse')) { + store('leftSidebarState', 'normal'); + } else { + store('leftSidebarState', 'sidebar-collapse'); + } }); - - $('[data-layout]').on('click', function () { - toggleBoxed(); - }); - - $('[data-general]').on('click', function () { - changeSetting(); - }); - - $('[data-navigation]').on('click', function () { - saveLeftSidebarState(); - }); - - if ($('body').hasClass('layout-boxed')) { - $('[data-layout="layout-boxed"]').attr('checked', 'checked'); - } } // Create the menu @@ -606,123 +750,53 @@ $(function () { + '
    ' + '' + '

    Deletes the currently set IPC password

    ' + '
    ' // Boxed Layout + '' + // Nightmode + + '
    ' + + '' + + '

    Toggle the nightmode

    ' + '
    ' ); - - //#region SkinsList + var $skinsList = $('