Skip to content

Commit

Permalink
Merge pull request #62 from alan16742/master
Browse files Browse the repository at this point in the history 
support for files pagnation, remove python backend
  • Loading branch information
@vcheckzen
vcheckzen authored Oct 27, 2024
2 parents 72b4e6c + fd6b04d commit 8ad4fe9
Show file tree
Hide file tree
Showing 2 changed files with 107 additions and 47 deletions.
38 changes: 23 additions & 15 deletions back-end-cf/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,12 @@ async function handleRequest(request) {
}

// List a folder
const files = await fetchFiles(requestPath, body.passwd);
const files = await fetchFiles(
requestPath,
body.passwd,
body.skipToken,
body.orderby
);
return new Response(files, {
headers: returnHeaders,
});
Expand Down Expand Up @@ -188,7 +193,7 @@ async function authenticate(path, passwd) {
}
}

async function fetchFiles(path, passwd) {
async function fetchFiles(path, passwd, skipToken, orderby) {
const parent = path || '/';
try {
await authenticate(path, passwd);
Expand All @@ -201,31 +206,33 @@ async function fetchFiles(path, passwd) {
}

if (path === '/') path = '';
if (path || EXPOSE_PATH)
if (path || EXPOSE_PATH) {
// if EXPOSE_PATH + path equals to an empty string, ':' will lead to an error.
path = ':' + encodeURIComponent(EXPOSE_PATH + path) + ':';

}
const accessToken = await fetchAccessToken();
const expand =
'/children?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl&$top=200';
const expand = `/children?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl
&$top=200${orderby ? '&$orderby=' + orderby : ''}${
skipToken ? '&skiptoken=' + skipToken : ''
}`;
const uri = OAUTH.apiUrl + path + expand;

let pageRes = await getContent(uri, {
const pageRes = await getContent(uri, {
Authorization: 'Bearer ' + accessToken,
});
if (pageRes.error) {
throw new Error('request failed');
}

let children = pageRes.value;
while (pageRes['@odata.nextLink']) {
pageRes = await getContent(pageRes['@odata.nextLink'], {
Authorization: 'Bearer ' + accessToken,
});
children = children.concat(pageRes.value);
}
skipToken = pageRes['@odata.nextLink']
? new URL(pageRes['@odata.nextLink']).searchParams.get('$skiptoken')
: '';
const children = pageRes.value;

return JSON.stringify({
parent,
skipToken,
orderby,
files: children
.map((file) => ({
name: file.name,
Expand All @@ -246,7 +253,8 @@ async function downloadFile(filePath, format, stream) {
filePath = encodeURIComponent(`${EXPOSE_PATH}${filePath}`);
const uri =
`${OAUTH.apiUrl}:${filePath}:/content` +
(format ? `?format=${format}` : '');
(format ? `?format=${format}` : '') +
(format === 'jpg' ? '&width=30000&height=30000' : '');
const accessToken = await fetchAccessToken();

return cacheFetch(uri, {
Expand Down
116 changes: 84 additions & 32 deletions front-end/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,7 @@
window.GLOBAL_CONFIG = {
SCF_GATEWAY: `//tight-bar-e3b3.logi.workers.dev`, // Worker 或云函数网关地址
SITE_NAME: `FODI`, // 站点名称
PRELOAD: false,
IS_CF: true,
PRELOAD: false, // 是否预加载文件列表
};
</script>
<meta charset="utf-8" />
Expand Down Expand Up @@ -719,7 +718,7 @@
function renderPage(data, cache) {
let files;
if (data) {
files = JSON.parse(data);
files = typeof data === 'string' ? JSON.parse(data) : data;
window.fileCache.set(files.parent, files);
preCache(files, 0);
} else {
Expand Down Expand Up @@ -1074,7 +1073,7 @@
input.placeholder = '密码错误';
} else {
window.fileCache.set(newFiles.parent, newFiles);
window.fileCache.set(`${newFiles.parent}/.upload`, passwd);
window.fileCache.set(`${newFiles.parent}/.password`, passwd);
fetchFileList(newFiles.parent);
}
}
Expand Down Expand Up @@ -1656,7 +1655,38 @@
});
}

function fetchFileList(path) {
function sortList(clickedElem) {
const loadedPages = window.fileCache.get(
window.backFordwardCache.current
);
const oldSortOrder = loadedPages?.orderby || 'name asc';
const sortField = clickedElem.className;
const sortOrder = oldSortOrder.split(' ')[1] === 'asc' ? 'desc' : 'asc';
const newSortOrder = `${sortField} ${sortOrder}`;
if (oldSortOrder === newSortOrder) {
return;
}
if (loadedPages.skipToken) {
window.fileCache.set(window.backFordwardCache.current, false);
fetchFileList(
window.backFordwardCache.current,
newSortOrder.replace('time', 'lastModifiedDateTime')
);
} else {
alert(newSortOrder);
loadedPages.orderby = newSortOrder;
loadedPages.files.sort((a, b) => {
if (a[sortField] < b[sortField])
return sortOrder === 'asc' ? -1 : 1;
if (a[sortField] > b[sortField])
return sortOrder === 'asc' ? 1 : -1;
return 0;
});
renderPage(loadedPages);
}
}

function fetchFileList(path, orderby) {
// console.log('fetching ' + path);
const loading = document.querySelector('.loading-wrapper');
loading.dataset.hidden = '0';
Expand All @@ -1674,7 +1704,7 @@
sendRequest(
window.api.method,
window.api.url,
window.api.formatPayload(path),
window.api.formatPayload(path, '', { orderby: orderby }),
window.api.headers,
renderPage,
() => {
Expand Down Expand Up @@ -1724,7 +1754,7 @@
window.api.url + '?upload',
window.api.formatPayload(
odPath,
window.fileCache.get(`${odPath}/.upload`) || '',
window.fileCache.get(`${odPath}/.password`),
{
files: currentPage,
}
Expand Down Expand Up @@ -1878,7 +1908,6 @@
JSON.stringify({
path,
passwd,
...window.api.accessToken,
...kvs,
}),
headers: {
Expand All @@ -1898,28 +1927,51 @@
const initialPath =
new URLSearchParams(window.location.search).get('path') ||
window.api.root;
if (window.GLOBAL_CONFIG.IS_CF) {
fetchFileList(initialPath);
addBackForwardListener();
addFileUploadListener();
} else {
sendRequest(
window.api.method,
window.api.url + '?accessToken',
null,
window.api.headers,
(data) => {
const accessToken = JSON.parse(data);
window.api.accessToken = {
encrypted: accessToken.encrypted,
plain: accessToken.plain,
};
fetchFileList(initialPath);
addBackForwardListener();
addFileUploadListener();
}
fetchFileList(initialPath);
addBackForwardListener();
addFileUploadListener();
const rightDiv = document.querySelector('div.right');
let isRequestInProgress = false;
rightDiv.addEventListener('scroll', function () {
const scrollPosition = rightDiv.scrollTop + rightDiv.clientHeight;
const scrollHeight = rightDiv.scrollHeight;
let loadedPages = window.fileCache.get(
window.backFordwardCache.current
);
}
if (scrollPosition >= scrollHeight - 20 && loadedPages.skipToken) {
if (isRequestInProgress) return;
isRequestInProgress = true;
sendRequest(
window.api.method,
window.api.url,
window.api.formatPayload(
loadedPages.parent,
window.fileCache.get(`${loadedPages.parent}/.password`),
{
skipToken: loadedPages.skipToken,
orderby: loadedPages.orderby,
}
),
window.api.headers,
(data) => {
data = JSON.parse(data);
loadedPages.files = loadedPages.files.concat(data.files);
loadedPages.skipToken = data.skipToken;
window.fileCache.set(
window.backFordwardCache.current,
loadedPages
);
renderPage(loadedPages);
isRequestInProgress = false;
},
() => {
const loadingText = loading.querySelector('.loading');
loadingText.innerText = 'Loading NextPage Failed!';
isRequestInProgress = false;
}
);
}
});
});
</script>
</head>
Expand Down Expand Up @@ -1982,9 +2034,9 @@
<div class="list-header">
<div class="row">
<div class="file">
<span class="name">ITEMS</span>
<span class="time">TIME</span>
<span class="size">SIZE</span>
<span class="name" onclick="sortList(this)">ITEMS</span>
<span class="time" onclick="sortList(this)">TIME</span>
<span class="size" onclick="sortList(this)">SIZE</span>
</div>
</div>
</div>
Expand Down

0 comments on commit 8ad4fe9

Please sign in to comment.