From c8467d0a3551e0b65a234c2dafe0e9bb3870bcb0 Mon Sep 17 00:00:00 2001 From: filesite Date: Wed, 18 May 2022 20:05:21 +0800 Subject: [PATCH] add theme PageDirectory --- conf/app.php | 11 ++- themes/googleimage/views/layout/main.php | 13 ++++ themes/googleimage/views/site/index.php | 13 ---- .../controller/SiteController.php | 40 ++++++++++ themes/pagedirectory/views/layout/main.php | 63 +++++++++++++++ themes/pagedirectory/views/site/index.php | 76 +++++++++++++++++++ www/content/Manual.md | 8 ++ www/content/README.md | 2 + www/content/Theme_PageDirectory.md | 11 +++ www/css/pagedirectory.css | 55 ++++++++++++++ www/js/pagedirectory.js | 22 ++++++ 11 files changed, 298 insertions(+), 16 deletions(-) create mode 100644 themes/pagedirectory/controller/SiteController.php create mode 100644 themes/pagedirectory/views/layout/main.php create mode 100644 themes/pagedirectory/views/site/index.php create mode 100644 www/content/Theme_PageDirectory.md create mode 100644 www/css/pagedirectory.css create mode 100644 www/js/pagedirectory.js diff --git a/conf/app.php b/conf/app.php index 1ac9812..3a2fe52 100644 --- a/conf/app.php +++ b/conf/app.php @@ -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 diff --git a/themes/googleimage/views/layout/main.php b/themes/googleimage/views/layout/main.php index 50a4582..1fffa5b 100644 --- a/themes/googleimage/views/layout/main.php +++ b/themes/googleimage/views/layout/main.php @@ -40,6 +40,19 @@ if (!empty($viewFile) && file_exists($viewFile)) { } ?> + + - - \ No newline at end of file diff --git a/themes/pagedirectory/controller/SiteController.php b/themes/pagedirectory/controller/SiteController.php new file mode 100644 index 0000000..5694c7c --- /dev/null +++ b/themes/pagedirectory/controller/SiteController.php @@ -0,0 +1,40 @@ +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); + } + +} diff --git a/themes/pagedirectory/views/layout/main.php b/themes/pagedirectory/views/layout/main.php new file mode 100644 index 0000000..1124264 --- /dev/null +++ b/themes/pagedirectory/views/layout/main.php @@ -0,0 +1,63 @@ + + + + +<?php echo $pageTitle;?> + + + + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + diff --git a/themes/pagedirectory/views/site/index.php b/themes/pagedirectory/views/site/index.php new file mode 100644 index 0000000..dcfb6ba --- /dev/null +++ b/themes/pagedirectory/views/site/index.php @@ -0,0 +1,76 @@ +
+{$menu['directory']} +eof; + } +} +?> +
+ +
+ $item) { + //跳过一级目录下的文件 + if (!empty($item['filename'])) {continue;} + + echo << +

{$item['directory']}

+eof; + + //二级目录 + if (!empty($item['directories'])) { + foreach($item['directories'] as $fid => $dir) { + echo << +

- {$dir['directory']}

+eof; + + //URL链接 + if (!empty($dir['files'])) { + foreach($dir['files'] as $urlItem) { + echo << + + {$urlItem['shortcut']['name']} + {$urlItem['shortcut']['url']} + +
+eof; + } + } + + + echo << +eof; + } + } + + //URL链接 + if (!empty($item['files'])) { + foreach($item['files'] as $fid => $urlItem) { + echo << + + {$urlItem['shortcut']['name']} + {$urlItem['shortcut']['url']} + + +eof; + } + } + + echo << +eof; + + } + } + ?> + \ No newline at end of file diff --git a/www/content/Manual.md b/www/content/Manual.md index 970916c..ff8e4f7 100644 --- a/www/content/Manual.md +++ b/www/content/Manual.md @@ -109,6 +109,8 @@ ### URL快捷方式 +.url文件是windows下的一种网页快捷方式文件。 + ``` [ 'id' => '根据完整路径生成的唯一编号', @@ -128,6 +130,12 @@ URL快捷方式文件是一类特殊的文件,它比一般的文件多了一个字段:shortcut。 +.url文件内容示例: +``` +[InternetShortcut] +URL=https://microsoft.com/ +``` + ## 字段说明 diff --git a/www/content/README.md b/www/content/README.md index 9ed7ff7..798c439 100644 --- a/www/content/README.md +++ b/www/content/README.md @@ -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) diff --git a/www/content/Theme_PageDirectory.md b/www/content/Theme_PageDirectory.md new file mode 100644 index 0000000..3f45044 --- /dev/null +++ b/www/content/Theme_PageDirectory.md @@ -0,0 +1,11 @@ +# Theme - PageDirectory + +导航网站皮肤**PageDirectory**。 + + +## 皮肤特点 + +* 一级目录为网站菜单,链接支持二级目录和文件两种形式,优先展示目录类型链接 +* 每个链接支持直接跳转和Readme.md详情介绍 +* 每个链接支持logo图标、网站名、Description简介展示 +* 自适应PC和手机 diff --git a/www/css/pagedirectory.css b/www/css/pagedirectory.css new file mode 100644 index 0000000..67999bc --- /dev/null +++ b/www/css/pagedirectory.css @@ -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;} +} \ No newline at end of file diff --git a/www/js/pagedirectory.js b/www/js/pagedirectory.js new file mode 100644 index 0000000..0dca5c8 --- /dev/null +++ b/www/js/pagedirectory.js @@ -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'); + } + }); + +})(); \ No newline at end of file