add js function and jquery

lib/DirScanner.php

@@ -77,6 +77,12 @@ Class DirScanner {
     public $scanTimeCost = 0;                       //上一次目录扫描耗时，单位：毫秒
 
 
+    //判断目录名或文件名是否合法
+    //不允许包含斜杠/，反斜杠\，单引号'，双引号"，空格字符
+    private function isValid($name) {
+        return str_replace(['/', '\\', "'", '"', ' '], '', $name) == $name;
+    }
+
     //解析描述文件内容
     //snapshot相对路径完善，支持secure_link
     private function parseDescriptionFiles($realpath) {
@@ -474,7 +480,7 @@ Class DirScanner {
 
             $files = scandir($dir);
             foreach($files as $file) {
-                if (in_array($file, $ignore_files)) {continue;}
+                if (in_array($file, $ignore_files) || !$this->isValid($file)) {continue;}
 
                 $branch = [];
                 $realpath = realpath("{$dir}{$file}");

themes/googleimage/controller/SiteController.php

@@ -12,6 +12,7 @@ Class SiteController extends Controller {
         $scanner = new DirScanner();
         $scanner->setWebRoot(FSC::$app['config']['content_directory']);
         $dirTree = $scanner->scan(__DIR__ . '/../../../www/' . FSC::$app['config']['content_directory'], 4);
+        $scanResults = $scanner->getScanResults();
 
         //获取目录
         $menus = $scanner->getMenus();
@@ -30,7 +31,7 @@ Class SiteController extends Controller {
 
         $pageTitle = !empty($titles) ? $titles[0]['name'] : "FileSite.io - 无数据库、基于文件和目录的Markdown文档、网址导航、图书、图片、视频网站PHP开源系统";
         $viewName = 'index';
-        $params = compact('menus', 'html');
+        $params = compact('dirTree', 'scanResults', 'menus', 'html');
         return $this->render($viewName, $params, $pageTitle);
     }
 

themes/googleimage/views/layout/main.php

@@ -18,7 +18,7 @@
             FileSite.io
         </a>
         <div class="about">
-            <a href="#modal_about" role="button">
+            <a href="#modal_about" role="button" class="btn-open">
                 <svg width="24" height="24" viewBox="0 0 24 24" focusable="false"><path d="M13.85 22.25h-3.7c-.74 0-1.36-.54-1.45-1.27l-.27-1.89c-.27-.14-.53-.29-.79-.46l-1.8.72c-.7.26-1.47-.03-1.81-.65L2.2 15.53c-.35-.66-.2-1.44.36-1.88l1.53-1.19c-.01-.15-.02-.3-.02-.46 0-.15.01-.31.02-.46l-1.52-1.19c-.59-.45-.74-1.26-.37-1.88l1.85-3.19c.34-.62 1.11-.9 1.79-.63l1.81.73c.26-.17.52-.32.78-.46l.27-1.91c.09-.7.71-1.25 1.44-1.25h3.7c.74 0 1.36.54 1.45 1.27l.27 1.89c.27.14.53.29.79.46l1.8-.72c.71-.26 1.48.03 1.82.65l1.84 3.18c.36.66.2 1.44-.36 1.88l-1.52 1.19c.01.15.02.3.02.46s-.01.31-.02.46l1.52 1.19c.56.45.72 1.23.37 1.86l-1.86 3.22c-.34.62-1.11.9-1.8.63l-1.8-.72c-.26.17-.52.32-.78.46l-.27 1.91c-.1.68-.72 1.22-1.46 1.22zm-3.23-2h2.76l.37-2.55.53-.22c.44-.18.88-.44 1.34-.78l.45-.34 2.38.96 1.38-2.4-2.03-1.58.07-.56c.03-.26.06-.51.06-.78s-.03-.53-.06-.78l-.07-.56 2.03-1.58-1.39-2.4-2.39.96-.45-.35c-.42-.32-.87-.58-1.33-.77l-.52-.22-.37-2.55h-2.76l-.37 2.55-.53.21c-.44.19-.88.44-1.34.79l-.45.33-2.38-.95-1.39 2.39 2.03 1.58-.07.56a7 7 0 0 0-.06.79c0 .26.02.53.06.78l.07.56-2.03 1.58 1.38 2.4 2.39-.96.45.35c.43.33.86.58 1.33.77l.53.22.38 2.55z"></path><circle cx="12" cy="12" r="3.5"></circle></svg>
             </a>
         </div>
@@ -38,6 +38,7 @@ include_once $viewFile;
         &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 googleimage-->

themes/googleimage/views/site/index.php

@@ -1,8 +1,9 @@
 <div class="menu">
 <?php
+$selectedIndex = 0;
 if (!empty($viewData['menus'])) {
 	foreach($viewData['menus'] as $index => $item) {
-		$selected = $index == 0 ? 'selected' : '';
+		$selected = $index == $selectedIndex ? 'selected' : '';
 		echo <<<eof
 		<a href="{$item['path']}" class="{$selected}">{$item['directory']}</a>
 eof;
@@ -14,7 +15,17 @@ eof;
 <div class="hr"></div>
 
 <div class="content markdown-body">
-	<?php //echo $viewData['html']; ?>
+	<?php
+		$cateId = $viewData['menus'][$selectedIndex]['id'];
+		$category = $viewData['scanResults'][$cateId];
+		if (!empty($category['files'])) {
+			foreach($category['files'] as $file) {
+				echo <<<eof
+	<img src="{$file['path']}" alt="{$file['filename']}">
+eof;
+			}
+		}
+	?>
 </div>
 
 <div class="modal-mask" id="modal_about">

www/content/Class_DirScanner.md

@@ -31,6 +31,7 @@
 
 ## 私有方法
 
+* isValid: 判断目录名或者文件名是否合法
 * parseDescriptionFiles: 解析描述文件内容
 * parseShortCuts: 解析快捷方式文件内容
 * getId: 根据文件路径生成唯一编号

www/js/googleimage.js

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