Browse Source

add theme PageDirectory

master
filesite 3 years ago
parent
commit
c8467d0a35
  1. 11
      conf/app.php
  2. 13
      themes/googleimage/views/layout/main.php
  3. 13
      themes/googleimage/views/site/index.php
  4. 40
      themes/pagedirectory/controller/SiteController.php
  5. 63
      themes/pagedirectory/views/layout/main.php
  6. 76
      themes/pagedirectory/views/site/index.php
  7. 8
      www/content/Manual.md
  8. 2
      www/content/README.md
  9. 11
      www/content/Theme_PageDirectory.md
  10. 55
      www/css/pagedirectory.css
  11. 22
      www/js/pagedirectory.js

11
conf/app.php

@ -5,11 +5,16 @@ @@ -5,11 +5,16 @@
return array(
'default_timezone' => 'Asia/HonKong', //timezone
'content_directory' => 'content/', //directory of contents in /www/
//文档站皮肤
//'content_directory' => 'content/', //directory of contents in /www/
//when it's empty, use layout and views in directory views/
'theme' => 'manual', //name of theme which is enabled
//'theme' => 'manual', //name of theme which is enabled
//in developing
//导航站皮肤
'content_directory' => 'navs/', //directory of contents in /www/
'theme' => 'pagedirectory',
//图片站皮肤
//'content_directory' => 'dogs/', //directory of contents in /www/
//'theme' => 'googleimage', //name of theme which is enabled

13
themes/googleimage/views/layout/main.php

@ -40,6 +40,19 @@ if (!empty($viewFile) && file_exists($viewFile)) { @@ -40,6 +40,19 @@ if (!empty($viewFile) && file_exists($viewFile)) {
}
?>
<div class="modal-mask" id="modal_about">
<div class="modal-about">
<div class="modal-head">
<h3>联系我</h3>
<span class="btn-close" role="button"><svg width="24" height="24" viewBox="0 0 24 24" focusable="false" class=" NMm5M"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"></path></svg></span>
</div>
<div class="hr"></div>
<div class="modal-body markdown-body">
<?php echo !empty($viewData['htmlReadme']) ? $viewData['htmlReadme'] : ''; ?>
</div>
</div>
</div>
<div class="footer">
<?php if (!empty(FSC::$app['config']['theme'])) { ?>
Theme name <strong><?php echo FSC::$app['config']['theme']; ?></strong>

13
themes/googleimage/views/site/index.php

@ -110,16 +110,3 @@ eof; @@ -110,16 +110,3 @@ eof;
}
?>
</div>
<div class="modal-mask" id="modal_about">
<div class="modal-about">
<div class="modal-head">
<h3>联系我</h3>
<span class="btn-close" role="button"><svg width="24" height="24" viewBox="0 0 24 24" focusable="false" class=" NMm5M"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"></path></svg></span>
</div>
<div class="hr"></div>
<div class="modal-body markdown-body">
<?php echo $viewData['htmlReadme']; ?>
</div>
</div>
</div>

40
themes/pagedirectory/controller/SiteController.php

@ -0,0 +1,40 @@ @@ -0,0 +1,40 @@
<?php
/**
* Site Controller
*/
require_once __DIR__ . '/../../../lib/DirScanner.php';
require_once __DIR__ . '/../../../plugins/Parsedown.php';
Class SiteController extends Controller {
public function actionIndex() {
//获取数据
$menus = [];
$htmlReadme = '';
$titles = [];
$content = '';
$scanner = new DirScanner();
$scanner->setWebRoot(FSC::$app['config']['content_directory']);
$dirTree = $scanner->scan(__DIR__ . '/../../../www/' . FSC::$app['config']['content_directory'], 4);
$readmeFile = $scanner->getDefaultReadme();
$menus = $scanner->getMenus();
if (!empty($readmeFile)) {
$titles = $scanner->getMDTitles($readmeFile['id']);
$content = file_get_contents($readmeFile['realpath']);
$Parsedown = new Parsedown();
$htmlReadme = $Parsedown->text($content);
$htmlReadme = $scanner->fixMDUrls($readmeFile['realpath'], $htmlReadme);
}
$pageTitle = !empty($titles) ? $titles[0]['name'] : "FileSite.io - 无数据库、基于文件和目录的Markdown文档、网址导航、图书、图片、视频网站PHP开源系统";
$viewName = 'index';
$params = compact('dirTree', 'menus', 'htmlReadme');
return $this->render($viewName, $params, $pageTitle);
}
}

63
themes/pagedirectory/views/layout/main.php

@ -0,0 +1,63 @@ @@ -0,0 +1,63 @@
<?php
//常用方法
require_once __DIR__ . '/../../../../plugins/Html.php';
?><!DocType html>
<html>
<head>
<meta charset="utf-8">
<title><?php echo $pageTitle;?></title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<link rel="icon" type="image/x-icon" href="/favicon.ico?v1.0">
<link href="/css/main.css?v.1.1" rel="stylesheet">
<!--for theme manual-->
<link href="/css/github-markdown-dark.css" rel="stylesheet">
<link href="/css/pagedirectory.css?v<?=Html::getStaticFileVersion('pagedirectory.css', 'css')?>" rel="stylesheet">
</head>
<body>
<div class="header">
<a href="/" class="logo">
<img src="/content/machete_icon.png" alt="Logo of FileSite.io" height="34">
FileSite.io
</a>
<a href="#modal_about" role="button" class="about btn-open">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="24" height="24"><!--! Font Awesome Pro 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M191.1 224c0-17.72-14.34-32.04-32-32.04L144 192c-35.34 0-64 28.66-64 64.08v47.79C80 339.3 108.7 368 144 368H160c17.66 0 32-14.36 32-32.06L191.1 224zM256 0C112.9 0 4.583 119.1 .0208 256L0 296C0 309.3 10.75 320 23.1 320S48 309.3 48 296V256c0-114.7 93.34-207.8 208-207.8C370.7 48.2 464 141.3 464 256v144c0 22.09-17.91 40-40 40h-110.7C305 425.7 289.7 416 272 416H241.8c-23.21 0-44.5 15.69-48.87 38.49C187 485.2 210.4 512 239.1 512H272c17.72 0 33.03-9.711 41.34-24H424c48.6 0 88-39.4 88-88V256C507.4 119.1 399.1 0 256 0zM368 368c35.34 0 64-28.7 64-64.13V256.1C432 220.7 403.3 192 368 192l-16 0c-17.66 0-32 14.34-32 32.04L320 335.9C320 353.7 334.3 368 352 368H368z"/></svg>
</a>
</div>
<?php
//### Render view file
$viewFile = __DIR__ . '/../' . FSC::$app['controller'] . '/' . $viewName . '.php';
include_once $viewFile;
?>
<div class="modal-mask" id="modal_about">
<div class="modal-about">
<div class="modal-head">
<h3>联系我</h3>
<span class="btn-close" role="button"><svg width="24" height="24" viewBox="0 0 24 24" focusable="false" class=" NMm5M"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"></path></svg></span>
</div>
<div class="hr"></div>
<div class="modal-body markdown-body">
<?php echo !empty($viewData['htmlReadme']) ? $viewData['htmlReadme'] : ''; ?>
</div>
</div>
</div>
<div class="footer">
<?php if (!empty(FSC::$app['config']['theme'])) { ?>
Theme name <strong><?php echo FSC::$app['config']['theme']; ?></strong>
<br>
<?php } ?>
&copy;FSC 2022 - execute time: {page_time_cost} ms
</div>
<script src="/js/jquery-3.6.0.min.js"></script>
<script src="/js/js.cookie.min.js"></script>
<script src="/js/main.js?v.1.0"></script>
<!--for theme pagedirectory-->
<script src="/js/pagedirectory.js?v<?=Html::getStaticFileVersion('pagedirectory.js', 'js')?>"></script>
</body>
</html>

76
themes/pagedirectory/views/site/index.php

@ -0,0 +1,76 @@ @@ -0,0 +1,76 @@
<div class="indexes">
<?php
if (!empty($viewData['menus'])) {
foreach($viewData['menus'] as $menu) {
$link = urlencode($menu['directory']);
echo <<<eof
<a href="#{$link}">{$menu['directory']}</a>
eof;
}
}
?>
</div>
<div class="content markdown-body">
<?php
if (!empty($viewData['dirTree'])) {
foreach($viewData['dirTree'] as $id => $item) {
//跳过一级目录下的文件
if (!empty($item['filename'])) {continue;}
echo <<<eof
<div class="url-group clearfix">
<h3 id="{$item['directory']}">{$item['directory']}</h3>
eof;
//二级目录
if (!empty($item['directories'])) {
foreach($item['directories'] as $fid => $dir) {
echo <<<eof
<div class="url-group clearfix">
<h4>- {$dir['directory']}</h4>
eof;
//URL链接
if (!empty($dir['files'])) {
foreach($dir['files'] as $urlItem) {
echo <<<eof
<div class="url">
<a href="{$urlItem['shortcut']['url']}" target="_blank">
<strong>{$urlItem['shortcut']['name']}</strong>
<small>{$urlItem['shortcut']['url']}</small>
</a>
</div>
eof;
}
}
echo <<<eof
</div>
eof;
}
}
//URL链接
if (!empty($item['files'])) {
foreach($item['files'] as $fid => $urlItem) {
echo <<<eof
<div class="url">
<a href="{$urlItem['shortcut']['url']}" target="_blank">
<strong>{$urlItem['shortcut']['name']}</strong>
<small>{$urlItem['shortcut']['url']}</small>
</a>
</div>
eof;
}
}
echo <<<eof
</div>
eof;
}
}
?>
</div>

8
www/content/Manual.md

@ -109,6 +109,8 @@ @@ -109,6 +109,8 @@
### URL快捷方式
.url文件是windows下的一种网页快捷方式文件。
```
[
'id' => '根据完整路径生成的唯一编号',
@ -128,6 +130,12 @@ @@ -128,6 +130,12 @@
URL快捷方式文件是一类特殊的文件,它比一般的文件多了一个字段:shortcut。
.url文件内容示例:
```
[InternetShortcut]
URL=https://microsoft.com/
```
## 字段说明

2
www/content/README.md

@ -110,10 +110,12 @@ FileSite.io官方提供的皮肤都包含在最新版的源码目录```themes/`` @@ -110,10 +110,12 @@ FileSite.io官方提供的皮肤都包含在最新版的源码目录```themes/``
| 皮肤名称 | 目录名 | 适用网站类型 |
| ---- | ---- | ---- |
| PageDirectory | pagedirectory | 导航站 |
| Manual | manual | 文档站 |
| GoogleImage | googleimage | 图片站 |
官方皮肤介绍如下:
* [导航站皮肤PageDirectory](./Theme_PageDirectory.md)
* [文档站皮肤Manual](./Theme_Manual.md)
* [图片站皮肤GoogleImage](./Theme_GoogleImage.md)

11
www/content/Theme_PageDirectory.md

@ -0,0 +1,11 @@ @@ -0,0 +1,11 @@
# Theme - PageDirectory
导航网站皮肤**PageDirectory**。
## 皮肤特点
* 一级目录为网站菜单,链接支持二级目录和文件两种形式,优先展示目录类型链接
* 每个链接支持直接跳转和Readme.md详情介绍
* 每个链接支持logo图标、网站名、Description简介展示
* 自适应PC和手机

55
www/css/pagedirectory.css

@ -0,0 +1,55 @@ @@ -0,0 +1,55 @@
/* for theme GoogleImage */
body{background-color:#202124;color: #e8eaed;font-family: Roboto,HelveticaNeue,Arial,sans-serif;font-size: small;margin: 0}
a{color: #aaadb2;text-decoration: none}
.header{padding:10px 10px 0 10px;position: relative;}
.header .logo{display: inline-block;margin:10px 10px 6px 10px;font-size: 1.86em;color: #e8eaed}
.header .logo img{vertical-align: middle;}
.menu{max-width: 80%;white-space: nowrap;overflow-x:auto;overflow-y: hidden;margin: 0 auto;}
.menu a{display: inline-block;line-height: 16px;margin: 0 1px;padding: 16px 12px 12px 10px;text-align: center}
.menu .selected{color: #8ab4f8;border-bottom: 3px solid #8ab4f8;padding: 20px 12px 11px 10px;}
.indexes{position:fixed;min-width:68px;top: 80px;left: 4px;bottom: 100px;background-color: #2b2c2e;padding: 5px 5px 10px 5px;border-radius: 5px;max-height:500px;overflow-y: auto;}
.indexes a{display: block;line-height: 2;font-size: 16px;font-weight: 500;}
.hr{border-bottom: solid 1px #3c4043;margin-bottom: 11px}
.about{display: block;position: absolute;right: 10px;top: 14px;width: 24px;height: 24px;padding: 8px;border-radius: 50%}
.about:hover{background-color: #303134}
.about svg{fill: currentColor;cursor: pointer;}
.modal-mask{display: none;background: rgba(0,0,0,.6);position: fixed;left: 0;right: 0;top: 0;bottom: 0;overflow: hidden;z-index: 9000;}
.modal-about{background: #202124;bottom: 0;overflow-y: auto;position: fixed;right: 0px;top: 0;width: 360px;max-width: 100%;}
.modal-about h3{color: #e8eaed;font-size: 24px;font-weight: 300;margin-top: 0;margin-bottom: 20px;text-align: left;}
.modal-about .modal-head{padding: 20px 24px 0 24px}
.modal-about .btn-close{color: #9aa0a6;cursor: pointer;display: block;float: right;position: relative;top: -45px;}
.modal-about .btn-close svg{fill: currentColor;flex-shrink: 0;}
.modal-body{padding: 10px;background-color: inherit;}
.modal-about .modal-body h1{display: none;}
.breadcrumbs{padding-left: 1.5em;padding-bottom: 10px;}
.content{padding: 20px 10px;padding-left: 90px}
.img-item{display: inline-block;margin-left: 10px;margin-right: 10px;margin-bottom: 20px;cursor: pointer;}
.img-item img{height: 180px;object-fit: cover;}
.img-item strong{display: block;color: #bdc1c6;font-family: Roboto,Arial,sans-serif;font-size: 12px;letter-spacing: .2px;line-height: 20px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.catedesc{padding: 0 10px}
.cateinfo{margin-bottom: 1em;padding: 5px 10px 10px 10px}
.clearfix::after {content: "";clear: both;display: table;}
.url-group{margin-bottom: 10px}
.url-group h3{margin-top: 0}
.url-group h4{margin-top: 0;padding-bottom: 5px;text-indent: 1em;border-bottom: 1px solid #666;}
.url-group .url{padding: 5px;width: 140px;float: left;margin-right: 10px;margin-bottom: 10px;background-color: #2b2c2e}
.url-group .url strong,.url-group .url small{display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.url-group .url small{font-size: 12px;color: gray}
/* for mobile */
@media only screen and (max-width: 767px) {
.menu{max-width:96%;font-size: 15px}
.img-item{margin-left: 0;margin-right: 0;width: 100%}
.img-item img{height: auto !important;width: 100% !important}
.img-item strong{font-size: 14px;}
.url-group .url{width: 110px}
}
@media only screen and (min-width: 540px) and (max-width: 767px) {
.img-item{width: 48%;margin-right: 5px;}
}
/* for pad */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.menu{font-size: 14px}
.img-item strong{font-size: 13px;}
}

22
www/js/pagedirectory.js

@ -0,0 +1,22 @@ @@ -0,0 +1,22 @@
/* for theme GoogleImage */
(function() {
//show modal
$('.btn-open').click(function(evt) {
var target_id = $(evt.target).parents('.btn-open').attr('href');
if ($(evt.target).hasClass('btn-open')) {
target_id = $(evt.target).attr('href');
}
$(target_id).css('display', 'block');
});
//hide modal
$('.btn-close').click(function(evt) {
$(evt.target).parents('.modal-mask').css('display', 'none');
});
$('.modal-mask').click(function(evt) {
if ($(evt.target).hasClass('modal-mask')) {
$(evt.target).css('display', 'none');
}
});
})();
Loading…
Cancel
Save