Skip to content

Commit

Permalink
Update KeyManager and Loading and PopAlert Style
Browse files Browse the repository at this point in the history
  • Loading branch information
RealLowMaster committed Jul 15, 2022
1 parent e91051a commit 3e71ff4
Show file tree
Hide file tree
Showing 16 changed files with 960 additions and 671 deletions.
192 changes: 132 additions & 60 deletions CSS/action.css
Original file line number Diff line number Diff line change
Expand Up @@ -85,42 +85,125 @@
border-color: #1E8449;
}

/* Loading */
.waiting-loading {
display: none;
flex-flow: column;
/* Pop Alert */
.pop-alert {
display: inline-block;
padding: 10px;
background-color: transparent;
color: #222;
border: 1px solid transparent;
border-radius: 4px;
font-size: 16px;
font-weight: 300;
position: fixed;
bottom: -42px;
left: 10px;
box-shadow: 0 5px 10px rgba(0,0,0,0.3);
transition: bottom .3s;
z-index: 999999999;
user-select: none;
}

.pop-alert-primary {
background-color: #3498DB;
color: #fff;
border-color: #2E86C1;
}

.pop-alert-danger {
background-color: #C0392B;
color: #fff;
border-color: #A93226;
}

.pop-alert-warning {
background-color: #E67E22;
color: #fff;
border-color: #CA6F1E;
}

.pop-alert-success {
background-color: #229954;
color: #fff;
border-color: #1E8449;
}

.action-alert {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: calc(100% - var(--topMenuSize));
background-color: #000d;
background-color: var(--modifier-selected-bg);
position: fixed;
top: var(--topMenuSize);
left: 0;
z-index: 999999;
z-index: 99999999999999;
}

.waiting-loading > p {
.action-alert > div {
display: block;
margin-bottom: 15px;
color: #fff;
text-align: center;
font-size: 16px;
width: 500px;
background-color: var(--secondary-bg);
padding: 10px;
box-shadow: 0 4px 8px 0 #000a;
}

.waiting-loading > div {
.action-alert > div > p {
display: block;
width: 450px;
height: 4px;
background-color: #ddd;
width: 100%;
margin: 5px 0 15px 0;
padding: 10px;
background-color: var(--secondary-bg-alt);
color: var(--primary-header);
border-radius: 3px;
}

.waiting-loading > div > div {
display: block;
width: 0;
height: 100%;
.action-alert > div > div { margin: 5px }

/* Pop Alert */
.pop-alert {
display: inline-block;
min-width: 200px;
padding: 10px;
background-color: transparent;
color: #222;
border-width: 0 0 0 4px;
border-style: solid;
border-radius: 3px;
font-size: 16px;
font-weight: 300;
position: fixed;
bottom: -42px;
left: 10px;
box-shadow: 0 5px 10px rgba(0,0,0,0.3);
transition: bottom .3s;
z-index: 99999999999;
user-select: none;
}

.pop-alert-primary {
background-color: #3498DB;
transition: width .2s;
color: #fff;
border-color: #2E86C1;
}

.pop-alert-danger {
background-color: #d34333;
color: #fff;
border-color: #a31002;
}

.pop-alert-warning {
background-color: #E67E22;
color: #fff;
border-color: #c45c01;
}

.pop-alert-success {
background-color: #229954;
color: #fff;
border-color: #1E8449;
}

/* Procress Panel */
Expand Down Expand Up @@ -162,19 +245,13 @@
transition: background-color .2s;
}

.procress-panel > button:hover {
background-color: #fffa;
}
.procress-panel > button:hover { background-color: #fffa }

.procress-panel > div:last-child {
display: flex;
flex-flow: row;
width: calc(100% - 80px);
height: calc(100% - 80px);
/* background-color: #fff; */
/* border: 1px solid #ddd; */
/* border-radius: 5px; */
/* box-shadow: 9px 7px 40px -6px rgba(0,0,0,.25); */
z-index: +1;
}

Expand Down Expand Up @@ -284,45 +361,40 @@
border-color: #E67E22;
}

/* Pop Alert */
.pop-alert {
display: inline-block;
padding: 10px;
background-color: transparent;
color: #222;
border: 1px solid transparent;
border-radius: 4px;
font-size: 16px;
font-weight: 300;
/* Loading */
.loading {
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
width: 100%;
height: calc(100% - var(--topMenuSize));
background-color: #000d;
position: fixed;
bottom: -42px;
left: 10px;
box-shadow: 0 5px 10px rgba(0,0,0,0.3);
transition: bottom .3s;
z-index: 999999999;
user-select: none;
}

.pop-alert-primary {
background-color: #3498DB;
color: #fff;
border-color: #2E86C1;
top: var(--topMenuSize);
left: 0;
z-index: 999999;
}

.pop-alert-danger {
background-color: #C0392B;
.loading > p {
display: block;
margin-bottom: 15px;
color: #fff;
border-color: #A93226;
text-align: center;
font-size: 16px;
}

.pop-alert-warning {
background-color: #E67E22;
color: #fff;
border-color: #CA6F1E;
.loading > div {
display: block;
width: 450px;
height: 4px;
background-color: #ddd;
}

.pop-alert-success {
background-color: #229954;
color: #fff;
border-color: #1E8449;
.loading > div > div {
display: block;
width: 0;
height: 100%;
background-color: #3498DB;
transition: width .2s;
}
49 changes: 3 additions & 46 deletions JS/browser.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ const bjp_m_p = document.getElementById('bjp-m-p')
let browserHistoryIndex = 0, browserHistoryRowOpElement, br_history_selected_inputs = [], br_history_selected_indexs = [], resizeTabTimer, active_site = null, historyObserver, historyLaodCounter = 0, br_cmenu_info = null, brh_cb_save = null

function openBrowser() {
keydownEventIndex = 3
KeyManager.ChangeCategory('browser')
afterDLReload = false
imageLazyLoadingOptions.root = pageContainer
imageLoadingObserver = new IntersectionObserver(ObserverFunction, imageLazyLoadingOptions)
Expand All @@ -32,7 +32,7 @@ function closeBrowser() {
document.getElementById('main').style.display = 'flex'
closeSitePanel()
closeBrowserHistory()
keydownEventIndex = 0
KeyManager.ChangeCategory('default')
activeTabIndex = null
activeTabComicId = null
tabsPos = []
Expand Down Expand Up @@ -579,7 +579,7 @@ document.getElementById('browser-tool-search-form').addEventListener('submit', e
e.preventDefault()
closeSitePanel()
closeBrowserHistory()
keydownEventIndex = 3
KeyManager.ChangeCategory('browser')
const input = document.getElementById('browser-tool-search-input')
const checkText = input.value.replace(/ /g, '')
if (checkText.length > 0) {
Expand Down Expand Up @@ -1055,47 +1055,4 @@ function closeBRCMenu() {
window.removeEventListener('wheel', closeBRCMenu)
window.removeEventListener('resize', closeBRCMenu)
window.removeEventListener('keydown', closeBRCMenu)
}

// Key Event
function BrowserKeyEvents(ctrl, shift, key) {
if (ctrl) {
if (!shift) {
switch (key) {
case 37:
browserPrev()
break
case 39:
browserNext()
break
case 72:
toggleBrowserHistory()
break
case 78:
openSite(active_site)
break
case 81:
browserTabHome()
break
case 82:
browserTabReload()
break
case 83:
toggleSitePanel()
break
case 87:
if (activeTabComicId != null) removeTab(activeTabComicId)
break
}

} else if (key == 84) openBrowserLastTabs()
} else {
if (!shift) {
switch (key) {
case 27:
closeBrowser()
break
}
}
}
}
Loading

0 comments on commit 3e71ff4

Please sign in to comment.