Browse Source

tabindex improve for remote control

master
filesite 1 week ago
parent
commit
7ff01f7102
  1. 6
      themes/beauty/views/layout/main.php
  2. 4
      themes/beauty/views/layout/player.php
  3. 12
      themes/beauty/views/list/bydate.php
  4. 14
      themes/beauty/views/site/index.php
  5. 2
      themes/beauty/views/site/mp3player.php
  6. 2
      themes/beauty/views/site/player.php
  7. 2
      themes/beauty/views/site/pwdauth.php
  8. 12
      www/css/beauty.css
  9. 16
      www/js/beauty.js

6
themes/beauty/views/layout/main.php

@ -45,13 +45,13 @@ require_once __DIR__ . '/../../../../plugins/Html.php';
}else { }else {
?> ?>
<span>&copy;2022 - <?=date('Y')?></span> <span>&copy;2022 - <?=date('Y')?></span>
by <a href="https://filesite.io/" target="_blank">FileSite.io</a> by <a href="https://filesite.io/" target="_blank" tabindex="-1">FileSite.io</a>
<br> <br>
<?php if (!empty(FSC::$app['config']['theme'])) { ?> <?php if (!empty(FSC::$app['config']['theme'])) { ?>
当前皮肤 <strong><?php echo FSC::$app['config']['theme']; ?></strong> 当前皮肤 <strong><?php echo FSC::$app['config']['theme']; ?></strong>
- 执行耗时: {page_time_cost} ms - 执行耗时: {page_time_cost} ms
<?php } ?> <?php } ?>
<br>友情链接:<a href="https://tajian.tv" target="_blank">Ta荐 - 你的聚宝盆</a> <br>友情链接:<a href="https://tajian.tv" target="_blank" tabindex="-1">Ta荐 - 你的聚宝盆</a>
<?php } ?> <?php } ?>
</p> </p>
</footer> </footer>
@ -61,7 +61,7 @@ require_once __DIR__ . '/../../../../plugins/Html.php';
<div class="right_sidebox right_sideboxJS elementNone"> <div class="right_sidebox right_sideboxJS elementNone">
<h5> <h5>
<span>关于我们</span> <span>关于我们</span>
<a class="rtcloseJS" href="javascript:;"> <a class="rtcloseJS" href="javascript:;" tabindex="-1">
<img class="icon svgimg verMiddle" src="/img/beauty/clos.svg" alt="关闭" title="关闭"> <img class="icon svgimg verMiddle" src="/img/beauty/clos.svg" alt="关闭" title="关闭">
</a> </a>
</h5> </h5>

4
themes/beauty/views/layout/player.php

@ -42,13 +42,13 @@ require_once __DIR__ . '/../../../../plugins/Html.php';
}else { }else {
?> ?>
<span>&copy;2022 - <?=date('Y')?></span> <span>&copy;2022 - <?=date('Y')?></span>
by <a href="https://filesite.io/" target="_blank">FileSite.io</a> by <a href="https://filesite.io/" target="_blank" tabindex="-1">FileSite.io</a>
<br> <br>
<?php if (!empty(FSC::$app['config']['theme'])) { ?> <?php if (!empty(FSC::$app['config']['theme'])) { ?>
当前皮肤 <strong><?php echo FSC::$app['config']['theme']; ?></strong> 当前皮肤 <strong><?php echo FSC::$app['config']['theme']; ?></strong>
- 执行耗时: {page_time_cost} ms - 执行耗时: {page_time_cost} ms
<?php } ?> <?php } ?>
<br>友情链接:<a href="https://tajian.tv" target="_blank">Ta荐 - 你的聚宝盆</a> <br>友情链接:<a href="https://tajian.tv" target="_blank" tabindex="-1">Ta荐 - 你的聚宝盆</a>
<?php } ?> <?php } ?>
</p> </p>
</footer> </footer>

12
themes/beauty/views/list/bydate.php

@ -44,7 +44,7 @@ $cacheData = !empty($viewData['cacheData']) ? $viewData['cacheData'] : [];
</button> </button>
</div> </div>
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/" tabindex="-1">
<span class="verMiddle"><?php echo $pageTitle; ?></span> <span class="verMiddle"><?php echo $pageTitle; ?></span>
</a> </a>
</div> </div>
@ -131,7 +131,11 @@ eof;
} }
} }
?> ?>
<li class="expand-icon hidden-xs" data-status="<?=$menu_ext_status?>"><img src="/img/beauty/<?=$menu_expand_icon_url?>" width="18" alt="arrow"></li> <li class="expand-icon hidden-xs" data-status="<?=$menu_ext_status?>">
<button class="btn btn-default btn-xs">
<img src="/img/beauty/<?=$menu_expand_icon_url?>" width="18" alt="arrow">
</button>
</li>
</ul> </ul>
</div><!-- /.navbar-collapse --> </div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid --> </div><!-- /.container-fluid -->
@ -168,7 +172,7 @@ echo <<<eof
<div class="breadcrumbs text_dark"> <div class="breadcrumbs text_dark">
{$totalNum} {$totalNum}
<small>当前位置:</small> <small>当前位置:</small>
<a href="/">首页</a> <a href="/" tabindex="-1">首页</a>
eof; eof;
$breadcrumbs = !empty($viewData['breadcrumbs']) ? $viewData['breadcrumbs'] : []; $breadcrumbs = !empty($viewData['breadcrumbs']) ? $viewData['breadcrumbs'] : [];
@ -176,7 +180,7 @@ if (!empty($breadcrumbs)) {
foreach ($breadcrumbs as $bread) { foreach ($breadcrumbs as $bread) {
if ($bread['id'] != $selectedId) { if ($bread['id'] != $selectedId) {
echo <<<eof echo <<<eof
/ <a href="{$bread['url']}">{$bread['name']}</a> / <a href="{$bread['url']}" tabindex="-1">{$bread['name']}</a>
eof; eof;
} else { } else {
echo <<<eof echo <<<eof

14
themes/beauty/views/site/index.php

@ -39,13 +39,13 @@ $main_view_cls = $menu_ext_status == 'opened' ? '' : 'full';
<?php } ?> <?php } ?>
<img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯"> <img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯">
<img class="icon1 svg connectmeJS svgimg verMiddle" src="/img/beauty/contactUs.svg" alt="联系我们" title="联系我们" /> <img class="icon1 svg connectmeJS svgimg verMiddle" src="/img/beauty/contactUs.svg" alt="联系我们" title="联系我们" />
<button type="button" class="collapsed mr_button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <button type="button" class="collapsed mr_button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false" tabindex="-1">
<span class="sr-only">Toggle navigation</span> <span class="sr-only">Toggle navigation</span>
<img class="svg icon1 svgimg verMiddle" src="/img/beauty/navshow.svg" alt="展开列表" title="展开列表"> <img class="svg icon1 svgimg verMiddle" src="/img/beauty/navshow.svg" alt="展开列表" title="展开列表">
</button> </button>
</div> </div>
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/" tabindex="-1">
<span class="verMiddle"><?php echo $pageTitle; ?></span> <span class="verMiddle"><?php echo $pageTitle; ?></span>
</a> </a>
</div> </div>
@ -147,7 +147,11 @@ eof;
} }
} }
?> ?>
<li class="expand-icon hidden-xs" data-status="<?=$menu_ext_status?>"><img src="/img/beauty/<?=$menu_expand_icon_url?>" width="18" alt="arrow"></li> <li class="expand-icon hidden-xs" data-status="<?=$menu_ext_status?>">
<button class="btn btn-default btn-xs">
<img src="/img/beauty/<?=$menu_expand_icon_url?>" width="100%" alt="arrow">
</button>
</li>
</ul> </ul>
</div><!-- /.navbar-collapse --> </div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid --> </div><!-- /.container-fluid -->
@ -196,14 +200,14 @@ echo <<<eof
<div class="breadcrumbs text_dark"> <div class="breadcrumbs text_dark">
{$totalNum} {$totalNum}
<small>当前位置:</small> <small>当前位置:</small>
<a href="/">首页</a> <a href="/" tabindex="-1">首页</a>
eof; eof;
if (!empty($breadcrumbs)) { if (!empty($breadcrumbs)) {
foreach ($breadcrumbs as $bread) { foreach ($breadcrumbs as $bread) {
if ($bread['id'] != $selectedId) { if ($bread['id'] != $selectedId) {
echo <<<eof echo <<<eof
/ <a href="{$bread['url']}">{$bread['name']}</a> / <a href="{$bread['url']}" tabindex="-1">{$bread['name']}</a>
eof; eof;
} else { } else {
echo <<<eof echo <<<eof

2
themes/beauty/views/site/mp3player.php

@ -11,7 +11,7 @@
<img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯"> <img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯">
</div> </div>
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/" tabindex="-1">
<span class="verMiddle">正在播放</span> <span class="verMiddle">正在播放</span>
</a> </a>
<span class="navbar-text videotitle"><?php echo $viewData['videoFilename']; ?></span> <span class="navbar-text videotitle"><?php echo $viewData['videoFilename']; ?></span>

2
themes/beauty/views/site/player.php

@ -11,7 +11,7 @@
<img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯"> <img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯">
</div> </div>
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/" tabindex="-1">
<span class="verMiddle">正在播放</span> <span class="verMiddle">正在播放</span>
</a> </a>
<span class="navbar-text videotitle"><?php echo !empty($viewData['videoName']) ? $viewData['videoName'] : $viewData['videoFilename']; ?></span> <span class="navbar-text videotitle"><?php echo !empty($viewData['videoName']) ? $viewData['videoName'] : $viewData['videoFilename']; ?></span>

2
themes/beauty/views/site/pwdauth.php

@ -6,7 +6,7 @@
<div class="container-fluid"> <div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display navbar-inverse--> <!-- Brand and toggle get grouped for better mobile display navbar-inverse-->
<div class="navbar-header"> <div class="navbar-header">
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/" tabindex="-1">
<span class="verMiddle"><?php echo $pageTitle; ?></span> <span class="verMiddle"><?php echo $pageTitle; ?></span>
</a> </a>
</div> </div>

12
www/css/beauty.css

@ -90,11 +90,13 @@ a:link{text-decoration:none}
.navbar-fixed-left .menu-title{font-size:12px;color:#999;padding-left:5px} .navbar-fixed-left .menu-title{font-size:12px;color:#999;padding-left:5px}
.navbar-fixed-left .menu-icon{vertical-align:text-top} .navbar-fixed-left .menu-icon{vertical-align:text-top}
.navbar-fixed-left .expand-icon{position:fixed;top:54px;left:130px;cursor:pointer;padding:5px} .navbar-fixed-left .expand-icon{position:fixed;top:54px;left:140px;cursor:pointer;padding:5px}
.navbar-fixed-left.closed{width:28px;overflow:hidden} .navbar-fixed-left.closed{width:28px;overflow:hidden}
.navbar-fixed-left.closed li{display:none} .navbar-fixed-left.closed li{display:none}
.navbar-fixed-left.closed li.expand-icon{display:block;left:5px} .navbar-fixed-left.closed li.expand-icon{display:block;left:5px}
.expand-icon img{background-color:#FFF;border-radius:9px;border:1px solid #FFF} .expand-icon img{background-color:#FFF;border-radius:9px;border:1px solid #FFF}
.expand-icon button{padding:1px 2px}
.expand-icon button:focus{border:none;outline-offset:0}
.img_main.full{margin-left:28px} .img_main.full{margin-left:28px}
.locked_dir{position:absolute;right:3px;top:5px} .locked_dir{position:absolute;right:3px;top:5px}
@ -188,6 +190,14 @@ a:link{text-decoration:none}
.has-slideshow.is-idle .fancybox__slide.has-image>.fancybox__content{width:100% !important;height:100% !important} .has-slideshow.is-idle .fancybox__slide.has-image>.fancybox__content{width:100% !important;height:100% !important}
a:focus,button.btn:focus{outline-color:lightblue}
.lampshow .nav-tabs>li>a:focus,.lampshow .navbar-fixed-left a:focus{background-color:lightgray;color:#444}
.im_item a:focus{outline:none;border:2px solid blue;border-radius:12px}
.lampshow .im_item a:focus{border-color:orange}
.lampshow .expand-icon button:focus{background-color:lightgray}
/* 主题切换 */ /* 主题切换 */
.lampshow .web_info{border-color:#363636} .lampshow .web_info{border-color:#363636}
.lampshow .btrt_side_ul li{background-color:#181818} .lampshow .btrt_side_ul li{background-color:#181818}

16
www/js/beauty.js

@ -991,3 +991,19 @@ $('.btnStartScan').click(function() {
console.error('文件扫描开始失败,错误信息:' + errorThrown); console.error('文件扫描开始失败,错误信息:' + errorThrown);
}); });
}); });
/* tv remote control event handle */
//remote control key codes
var RC_LEFT = 37;
RC_UP = 38;
RC_RIGHT = 39;
RC_DOWN = 40;
RC_ENTER = 13;
RC_BACK = 10009;
RC_EXIT = 10182;
$(document.body).on('keydown', function(e) {
console.log('Key pressed', e.keyCode);
//TODO: handle key press
});
Loading…
Cancel
Save