Skip to content

Commit

Permalink
feat: send links application in links page (#3)
Browse files Browse the repository at this point in the history
  • Loading branch information
KawaiiZapic committed Nov 4, 2024
1 parent 3c8ecae commit 8b1e2ae
Show file tree
Hide file tree
Showing 6 changed files with 371 additions and 27 deletions.
2 changes: 1 addition & 1 deletion src/header.php
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,6 @@ class="loading-path"
<?php } ?>
</mdui-button-icon>
</mdui-top-app-bar>
<main class="overflow-hidden" id="matecho-main">
<main id="matecho-main">
<?php $this->need('sidebar.php'); ?>
<div id="matecho-pjax-main">
47 changes: 45 additions & 2 deletions src/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -149,13 +149,17 @@ function initOnce() {
const type = await signal.promise;
const scripts = await loadPageScript(type);
oldEl.replaceWith(el);
const wrapper = document.querySelector("#matecho-pjax-main");
if (wrapper) {
const wrapper =
document.querySelector<HTMLDivElement>("#matecho-pjax-main");
const main = document.querySelector<HTMLDivElement>("#matecho-main");
if (wrapper && main) {
const className = PjaxBackward ? "slide-out" : "slide-in";
main.style.overflow = "hidden";
wrapper.addEventListener(
"animationend",
() => {
wrapper.classList.remove(className);
main.style.overflow = "";
},
{ once: true }
);
Expand Down Expand Up @@ -418,6 +422,45 @@ function init() {
header && handleLabelShrink(header);
}

interface CommentResult {
root: HTMLHtmlElement;
success: boolean;
error: string;
}
export async function sendComment(
url: string,
data: FormData
): Promise<CommentResult> {
const token = window.__MATECHO_ANTI_SPAM__;
if (typeof token === "string") {
data.set("_", token);
}
data.set("receiveMail", "yes");
const req = await fetch(url, {
body: data,
method: "POST",
credentials: "same-origin"
});

const resp = await req.text();
const root = Object.assign(document.createElement("html"), {
innerHTML: resp
}) as HTMLHtmlElement;
if (req.status === 200) {
return {
root,
success: true,
error: ""
};
} else {
return {
root,
success: false,
error: (root.querySelector(".container") as HTMLDivElement)?.innerText
};
}
}

if (document.readyState !== "loading") {
initOnce();
} else {
Expand Down
145 changes: 135 additions & 10 deletions src/page-links.php
Original file line number Diff line number Diff line change
Expand Up @@ -5,27 +5,28 @@
* @package custom
*/

if (!defined('__TYPECHO_ROOT_DIR__')) exit;
if (!defined('__TYPECHO_ROOT_DIR__'))
exit;

/** @var \Widget\Archive $this */
$this->need('header.php');
$links = Matecho::links();
$linksCount = count($links);
?>
<div class="mx-auto px-4 md:px-8 box-border w-full max-w-1440px">
<div id="matecho-app-bar-large-label">
<div id="matecho-app-bar-large-label">
<div class="flex flex-col" id="matecho-app-bar-large-label__inner">
<div class="truncate text-3xl md:text-5xl line-height-[1.4]!">
<?php $this->archiveTitle(array(
'category' => _t('分类 %s 下的文章'),
'search' => _t('包含关键字 %s 的文章'),
'tag' => _t('标签 %s 下的文章'),
'author' => _t('%s 发布的文章')
),'','');?>
), '', ''); ?>
</div>
<div class="text-sm opacity-80 block mt-3 truncate">
<?php
echo "$linksCount 位友人";
echo "$linksCount 位友人";
?>
</div>
</div>
Expand All @@ -34,16 +35,140 @@
<?php foreach ($links as $link) { ?>
<a href="<?php echo $link["url"] ?>" title="<?php echo $link["name"] ?>" target="_blank">
<mdui-card clickable class="w-full h-full pa-4 px-2 dark:bg-m-surface-container">
<div class="flex items-center">
<mdui-avatar class="mr-2 flex-shrink-0">
<img class="w-full h-full object-contain matecho-link-avatar" src="<?php echo $link["image"] ?>" name="<?php echo $link["name"] ?>">
</mdui-avatar>
<span class="text-xl truncate"><?php echo $link["name"] ?></span>
<div class="flex items-center h-full">
<div class="h-full pt-1 box-border">
<mdui-avatar class="mr-2 flex-shrink-0">
<img class="w-full h-full object-contain matecho-link-avatar"
src="<?php echo $link["image"] ?>" name="<?php echo $link["name"] ?>">
</mdui-avatar>
</div>
<div>
<span class="text-xl truncate"><?php echo $link["name"] ?></span>
<div class="opacity-80 text-xs"><?php echo $link["description"] ?></div>
</div>
</div>
<div class="opacity-80 pl-48px text-xs"><?php echo $link["description"] ?></div>
</mdui-card>
</a>
<?php } ?>
</div>
<div class="max-w-768px mx-auto">
<?php if ($this->authorId == $this->user->uid) { ?>
<div class="text-2xl mt-12 mb-4">友链申请</div>
<?php $comments = $this->comments();
$count = 0;
while ($comments->next()) {
if (count($comments->children) > 0) {
continue;
}
$count++;
?>
<div class="matecho-links-application w-full">
<div class="">
<div class="flex items-center gap-4">
<mdui-avatar aria-label="<?php $this->author() ?>"
src="<?php Matecho::Gravatar($this->author->mail); ?>"></mdui-avatar>
<span><?php $this->author(); ?></span>
</div>
<div class="pl-56px">
<div class="mt-2">
网站名称: <?php echo $comments->author ?><br>
网址: <a href="<?php echo $comments->url; ?>" target="_blank"><?php echo $comments->url; ?></a>
<?php echo $comments->content ?>
</div>
<div class="mt-2 flex items-center">
<span class="opacity-80 text-sm"><?php $comments->date(); ?></span>
<mdui-button class="h-6 min-w-0 w-3rem ml-2 inline-block matecho-links-application__reply"
data-to-comment="<?php echo $comments->coid ?>" variant="text" class="h-8 min-w-0">
回复
</mdui-button>
</div>
<mdui-divider class="mt-2"></mdui-divider>
</div>
</div>
</div>
<?php
}
if ($count === 0) { ?>
<div class="h-120px flex items-center justify-center">
<span class="opacity-60">没有待处理的申请</span>
</div>
<?php }
} ?>
</div>
<mdui-dialog id="matecho-links-reply-dialog" close-on-esc close-on-overlay-click headline="回复申请">
<div slot="description" class="w-95vw max-w-540px my-2 px-1">
<form id="matecho-link-reply-form" method="post" action="<?php $this->commentUrl() ?>" role="form" data-pjax-state>
<mdui-text-field variant="outlined" label="回复" rows="3" name="text" required></mdui-text-field>
</form>
</div>
<div slot="action">
<mdui-button variant="text" id="matecho-links-reply-cancel">取消</mdui-button>
<mdui-button variant="tonal" id="matecho-links-reply-submit">回复</mdui-button>
</div>
</mdui-dialog>
</div>
<?php if ($this->allowComment) { ?>
<div id="matecho-links-add__wrapper" class="sticky bottom-2 pr-2 md:pr-6 mt--48px text-right z-2 pointer-events-none">
<mdui-fab class="pointer-events-auto">
<mdui-icon-person-add-alt-1 slot="icon"></mdui-icon-person-add-alt-1>
申请友链
</mdui-fab>
</div>
<mdui-dialog id="matecho-links-add-dialog" close-on-esc close-on-overlay-click headline="申请友链">
<div slot="description" class="w-95vw max-w-540px px-1">
<div id="matecho-link-preview">
<mdui-card clickable class="w-full h-full pa-4 px-2 dark:bg-m-surface-container">
<div class="flex items-center h-full">
<div class="h-full pt-1 box-border">
<mdui-avatar class="mr-2 flex-shrink-0">
<img class="w-full h-full object-contain" src="" id="matecho-link-preview__avatar">
</mdui-avatar>
</div>
<div>
<span class="text-xl truncate" id="matecho-link-preview__name"></span>
<div class="opacity-80 text-xs" id="matecho-link-preview__description"></div>
</div>
</div>
</mdui-card>
</div>
<form id="matecho-link-add-form" method="post" action="<?php $this->commentUrl() ?>" role="form"
data-pjax-state>
<div class="flex flex-wrap my-2">
<div class="w-1/2 sm:w-1/3 pr-1 box-border">
<mdui-text-field label="网站名称" variant="outlined" type="text" name="author"
value="<?php $this->remember('author'); ?>" required></mdui-text-field>

</div>
<div class="w-1/2 sm:w-1/3 pl-1 sm:pr-1 box-border">
<mdui-text-field label="邮箱" variant="outlined" type="email" name="mail"
value="<?php $this->remember('mail'); ?>" <?php if ($this->options->commentsRequireMail): ?>
required<?php endif; ?>></mdui-text-field>
</div>
<div class="w-full sm:w-1/3 pt-2 sm:pt-0 sm:pl-1 box-border">
<mdui-text-field label="网址" variant="outlined" type="url" name="url"
value="<?php $this->remember('url'); ?>" required></mdui-text-field>
</div>
</div>
<mdui-text-field class="w-full" label="头像地址" variant="outlined" type="url"
name="avatar-url"></mdui-text-field>
<mdui-text-field class="w-full pt-2" label="描述" variant="outlined" name="description"></mdui-text-field>
</form>
</div>
<div slot="action">
<mdui-button variant="text" id="matecho-links-add-cancel">取消</mdui-button>
<mdui-button variant="tonal" id="matecho-links-add-submit">申请</mdui-button>
</div>
</mdui-dialog>
<?php if ($this->options->commentsAntiSpam) { ?>
<script type="text/javascript">
(function () {
['scroll', 'mousemove', 'keyup', 'touchstart'].map(v =>
document.addEventListener(v, function () {
window.__MATECHO_ANTI_SPAM__ = <?php echo \Typecho\Common::shuffleScriptVar($this->security->getToken($this->request->getRequestUrl())); ?>
}, { once: true, passive: true })
);
})();
</script>
<?php } ?>
<?php } ?>
<?php $this->need('footer.php'); ?>
Loading

0 comments on commit 8b1e2ae

Please sign in to comment.