Skip to content

Commit

Permalink
fixup! Temporary code for UI testing only
Browse files Browse the repository at this point in the history
  • Loading branch information
ShaopengLin committed Sep 11, 2024
1 parent 2d2791f commit 6206e52
Show file tree
Hide file tree
Showing 9 changed files with 264 additions and 61 deletions.
132 changes: 113 additions & 19 deletions resources/js/toc.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,14 +26,14 @@ function recurseChild(elem, recurseData)

/* Start or end a list or item based on current and previous level */
if (level > prevLevel)
recurseData.toc += (new Array(level - prevLevel + 1)).join('<ul class="kiwix-toc-list">');
recurseData.toc += '<ul class="kiwix-toc-list">';
else if (level < prevLevel)
recurseData.toc += (new Array(prevLevel - level + 1)).join('</li></ul>');
recurseData.toc += '</li></ul>';
else
recurseData.toc += (new Array(prevLevel+ 1)).join('</li>');
recurseData.toc += '</li>';

recurseData.level = parseInt(level);
recurseData.toc += '<li class="kiwix-toc-item"><a href="#' + anchor + '">' + headerText + '</a>';
recurseData.toc += '<li class="kiwix-toc-item"><a href="#' + anchor + '" class="kiwix-toc-list-a">' + headerText + '</a>';
}

var c = elem.children;
Expand All @@ -57,22 +57,75 @@ function tocHTMLStr()
return recurseData.toc;
}

function closePop()
{
var c = document.body.children;
for (var i = 0; i < c.length; i++)
{
if (c[i] !== "undefined" && c[i].id !== "kiwix-toc-side" && c[i].style)
{
c[i].style.marginLeft = null;
}
}
var tocElem = document.getElementById("kiwix-toc-side");
tocElem.style.display = "none";
}

function openPop()
{
var tocElem = document.getElementById("kiwix-toc");
var c = document.body.children;
for (var i = 0; i < c.length; i++)
{
if (c[i] !== "undefined" && c[i].id !== "kiwix-toc-side" && c[i].style)
{
c[i].style.marginLeft = "26vw";
}
}
var tocElem = document.getElementById("kiwix-toc-side");
tocElem.style.display = "block";
}

function urlRequest(){
var a = document.createElement('a');

// Set the href attribute to the custom URL scheme
a.href = "zim://kiwix-desktop";

// Trigger a click event on the anchor element
a.click();
}

function togglePop()
{
var tocElem = document.getElementById("kiwix-toc-side");
var isTOCVisible = tocElem.style.display === "block";
tocElem.style.display = isTOCVisible ? "none" : "block";

if (isTOCVisible)
{
closePop();
urlRequest();
}
else
{
tocElem.style.display = "block";
var c = document.body.children;
for (var i = 0; i < c.length; i++)
{
if (c[i] !== "undefined" && c[i].id !== "kiwix-toc-side" && c[i].style)
{
c[i].style.marginLeft = "25vw";
}
}
}
}

function tocPopupButtonElem()
{
var tocPopupButton = document.createElement('input');
var tocPopupButton = document.createElement('button');
tocPopupButton.id = "kiwix-toc-button"
tocPopupButton.onclick = openPop;
tocPopupButton.type = "image";
tocPopupButton.src = "data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' id='toc'%3E%3Cpath fill='none' d='M0 0h24v24H0V0zm0 0h24v24H0V0z'%3E%3C/path%3E%3Cpath d='M4 9h12c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zm0 4h12c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zm0 4h12c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zm15 0h2v-2h-2v2zm0-10v2h2V7h-2zm0 6h2v-2h-2v2z'%3E%3C/path%3E%3C/svg%3E%0A";
tocPopupButton.width = 40;
tocPopupButton.height = 40;
tocPopupButton.onclick = togglePop;
tocPopupButton.textContent = "Hide";

return tocPopupButton;
}

Expand All @@ -82,21 +135,62 @@ function setupTOC()
toc.id = "kiwix-toc";

tocContent = tocHTMLStr();
if (tocContent.length == 0)
return;

toc.innerHTML += tocContent;
var c = toc.getElementsByClassName("kiwix-toc-list-a");
for (var i = 0; i < c.length; i++)
{
if (c[i] !== "undefined" && c[i].id !== "kiwix-toc-side" && c[i].style)
{
var p = c[i].parentNode;
var count = -1;
while (p)
{
if (p.nodeName.match(/^UL$/))
count += 1;
p = p.parentNode;
}
c[i].style.paddingLeft = ((count == -1 ? 0 : count) * 30).toString() + "px";
// var tooltip = document.createElement('span');
// tooltip.className = "kiwix-toc-item-tooltip";
// tooltip.textContent = c[i].textContent;

// c[i].append(tooltip);
}
}

var tocTitleDiv = document.createElement('div');
tocTitleDiv.id = "kiwix-toc-title-div";

var tocTitle = document.createElement('p');
tocTitle.id = "kiwix-toc-title";
tocTitle.textContent = KIWIX_GT_CONTENT;
toc.prepend(tocTitle);

tocTitleDiv.append(tocTitle);
tocTitleDiv.append(tocPopupButtonElem());

var tocDiv = document.createElement('div');
tocDiv.id = "kiwix-toc-div";
tocDiv.prepend(toc);
tocDiv.prepend(tocPopupButtonElem());
document.body.prepend(tocDiv);
tocDiv.prepend(tocTitleDiv);

var tocSideDiv = document.createElement('div');
tocSideDiv.id = "kiwix-toc-side";
tocSideDiv.style.display = "none";

tocSideDiv.prepend(tocDiv);

var closeBut = document.createElement('button');
closeBut.id = "kiwix-toc-close-button"
closeBut.onclick = closePop;
closeBut.style.display = "none";

var openBut = document.createElement('button');
openBut.id = "kiwix-toc-open-button"
openBut.onclick = openPop;
openBut.style.display = "none";

document.body.prepend(tocSideDiv);
document.body.append(closeBut);
document.body.append(openBut);
}

setupTOC();
124 changes: 87 additions & 37 deletions resources/js/tocStyle.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,55 +5,78 @@ style.innerHTML = `
display: list-item;
list-style-type: none;
visibility: inherit;
unicode-bidi: plaintext;
text-align: start;
font-size: 20px;
font-family: Arial;
margin: 5px 20px;
position: relative;
width: 100%;
// margin: 10px 30px;
// margin-right: 0px;
}
.kiwix-toc-list {
all: initial;
display: block;
visibility: inherit;
width: 100%;
margin: 0px;
padding: 0px;
counter-reset: item;
}
.kiwix-toc-a {
all: initial;
color: inherit;
outline: none;
text-decoration: none;
}
.kiwix-toc-a:hover {
color: inherit;
color: inherit;
text-decoration: none;
}
#kiwix-toc {
.kiwix-toc-list-a {
all: initial;
display: none;
color: inherit;
outline: none;
display: block;
text-decoration: none;
position: relative;
font-size: 16px;
padding-bottom: 5px;
padding-top: 5px;
line-height: 20px;
font-family: Arial;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
border: 1px solid transparent;
}
.kiwix-toc-list-a:hover {
color: inherit;
text-decoration: none;
border: 1px solid #3366CC;
background-color: #D9E9FF;
border-right: 1px solid transparent;
border-left: 1px solid transparent;
cursor: pointer;
}
max-height: 50vh;
max-width: 50vh;
width: max-content;
overflow-y: auto;
.kiwix-toc-list-a:before { content: counters(item, ".") " "; counter-increment: item; margin-right: 10px; padding-left: 10px; }
padding: 8px;
padding-top: 0px;
background: white;
border: 1px solid #cccccc;
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
#kiwix-toc {
all: initial;
display: block;
position: relative;
max-height: calc(100vh - 90px);
width: 100%;
overflow: auto;
border-top: 1px solid #ccc;
}
#kiwix-toc::-webkit-scrollbar {
width: 5px;
width: 0px;
border: none;
outline: none;
}
Expand All @@ -66,42 +89,69 @@ style.innerHTML = `
#kiwix-toc-title {
all: initial;
display: block;
position: relative;
visibility: inherit;
font-size: 24px;
line-height: 30px;
font-weight: bold;
font-family: Arial;
text-align: center;
margin-left: auto;
margin-right: auto;
unicode-bidi: plaintext;
text-align: start;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin: 0px;
padding: 0px;
}
#kiwix-toc-button {
all: initial;
position: relative;
display: block;
background: white;
color: #3366CC;
margin: 0px;
padding 0px;
outline: none;
border: 1px solid #ccc;
border-radius: 3px;
padding: 0px;
padding-bottom: 3px;
font-size: 12px;
font-family: Arial;
line-height: 16px;
font-weight: bold;
}
#kiwix-toc-button:hover {
border: 1px solid #3366CC;
background-color: #D9E9FF;
text-decoration: underline;
}
#kiwix-toc-div {
all: initial;
display: block;
font-size: 0px;
margin: 8px;
margin-left: 0px;
}
#kiwix-toc-title-div {
all: initial;
display: flex;
justify-content: space-between;
height: 30px;
align-items: flex-end;
position: relative;
font-size: 0px;
padding: 10px;
padding-top: 20px;
}
#kiwix-toc-side {
all: initial;
position: fixed;
top: 0px;
z-index: 1000;
min-width: 24vw;
max-width: 24vw;
height: 100vh;
border-right: 1px solid #ccc;
border-left: 1px solid #ccc;
background: white;
margin: 0px;
padding: 0px;
}
`
document.head.appendChild(style);
4 changes: 2 additions & 2 deletions src/kiwixapp.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -443,8 +443,7 @@ void KiwixApp::createActions()
});
mpa_actions[ToggleFullscreenAction]->setCheckable(true);

CREATE_ACTION_SHORTCUT(ToggleTOCAction, gt("table-of-content"), QKeySequence(Qt::CTRL | Qt::SHIFT | Qt::Key_1));
HIDE_ACTION(ToggleTOCAction);
CREATE_ACTION_ICON_SHORTCUT(ToggleTOCAction, "toc", gt("table-of-content"), QKeySequence(Qt::CTRL | Qt::Key_M));

CREATE_ACTION_ONOFF_ICON_SHORTCUT(ToggleReadingListAction, "reading-list-active", "reading-list", gt("reading-list"), QKeySequence(Qt::CTRL | Qt::Key_B));

Expand Down Expand Up @@ -506,6 +505,7 @@ void KiwixApp::handleItemsState(TabType tabType)
app->getAction(KiwixApp::ZoomResetAction)->setDisabled(libraryOrSettingsTab);
app->getAction(KiwixApp::RandomArticleAction)->setDisabled(libraryOrSettingsTab);
app->getAction(KiwixApp::OpenHomePageAction)->setDisabled(libraryOrSettingsTab);
app->getAction(KiwixApp::ToggleTOCAction)->setDisabled(libraryOrSettingsTab);

/* Non-Zim tabs are not bookmarkable therefore never in reading list. */
if (notBookmarkableTab)
Expand Down
2 changes: 1 addition & 1 deletion src/kprofile.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ void KProfile::downloadFinished()
void ExternalReqInterceptor::interceptRequest(QWebEngineUrlRequestInfo &info)
{
const QString reqUrl = info.requestUrl().toString();
if (!reqUrl.startsWith("zim://"))
if (!reqUrl.startsWith("zim://") && !reqUrl.startsWith("kiwix-desktop://"))
{
qDebug() << "Blocked external request to URL: " << reqUrl;
info.block(true);
Expand Down
Loading

0 comments on commit 6206e52

Please sign in to comment.