找回密码
 立即注册

QQ登录

只需一步,快速开始

快捷登录

铁威马网络网络存储
公网ip

5

精华

190

帖子

5109

积分

技术达人

Rank: 6Rank: 6

云币
330
贡献
685
活跃
994
精华
5

NAS发烧友技术达人编辑能手突出贡献活跃会员

QQ

[教程分享] 【老骥伏枥-原创】推敲MyBookLiveMetroUI人性化的若干问题及修正分享

  [复制链接]
本帖最后由 f541883216 于 2017-2-3 01:14 编辑

论坛中有不少帖子是关于MetroUI风格导航页面的,看来是有一些人喜欢用它。我前两天也给我的WD西部数据MyBookLive系统中安装了一个。那么下面来讲讲我的一些经验,和这个MetroUI中的一些问题与大家一起来推敲一下。并且把我的改写的更新版本分享给大家,更新版本和安装方法在本文后面免费提供给大家。来回报论坛为我们提供的交换信息空间。

我是通过MBL的SSH功能, 使用putty安装的。步骤如下:

1.打开MBL的SSH功能,浏览器进入http://你的MBL IP /UI/ssh,访问SSH开关页面,选择启用,用户名root,密码welc0me,其中密码中0是数字0,不是字母O

2.PuTTY登录MBL
需要使用putty软件,这个是很小的远程登录软件,类似于cmd命令行一样,可以远程进入MBL进行命令操作,把MBL的内网IP地址填入Host Name里,其他默认,点击open登录

输入用户名密码,用户名root,密码welc0me,其中密码中0是数字0,不是字母O

登录成功


我安装的MetroUI来自执行以下命令:

安装完成登录后的界面是这个样子的。账户名和密码都是:admin



之后还要安装aria2和yaaw整个MetroUI的功能才能工作正常。
我的安装包来自如下地址:

这些都是开源的软件包。但有一些写得比较粗糙。具体怎样使用MetroUI可以在论坛中查查新手教程。如果要让这些开源的软件包用起来更加顺手,流畅。恐怕还是要对下载程序做点改造。这就是为什么我今天要推敲MyBookLive人性化MetroUI的若干问题, 这次我主要想探讨一下如何把MetroUI导航页面与绑定的芒果云KodExplorer 系统有机地将两者结合在一起的问题,同时也要修正一些MetroUI代码中的不足之处。

第一个问题:安装以后,我看了一下MetroUI的代码,发现它的结构并不规范,不知道是谁开发的? 也或许是我拿到的版本不规范。这样的代码对于安装和管理都很不便。它是直接安装在/var/www/中的,其中部分文件在www根目录中,另外还有两个目录(assets, include)中有一些相关文件。但不管怎么样我还是成功安装了MetroUI界面,为了让这个软件包变得更好用,解决的办法只能是规范一下代码了。作为一个老码农,这也不难,没有什么技术含量。都是一些鸡零狗碎的活。但总得有人为此贡献啊!我就做一回志愿者吧。规范后,我把所有的相关代码全部归类到了assets目录中。为方便以后的系统整合好了准备。这样做的好处是,可以把MetroUI的代码安装在/dev/sda4的ext4分区中。这是MyBookLive系统中用来存数据的分区。它有非常大的空间,它的挂节点是/DataVolume。看下图:



现在我们可以将assets目录中放到任意一个地方,只要创建一个私有目录把它拷贝进去,再在系统的/var/www/目录中做一个符号连接即可。具体的命令是:
ln -s /DataVolum/shares/Public/你创建的私有目录名/assets  /var/www/assets
这样将大大改进了MetroUI的代码结构。也方便今后的系统整合。

第二个问题:芒果云KodExplorer系统的安装点也是直接安装在/var/www/中,这可就有点问题了。正如前面图中所示,/var/www/是属于/dev/sda1或/dev/sda1根节点系统分区。这个分区中根本没有多少地方用来存放用户数据。芒果云中/kodexplorer/data/User目录是用户上下载数据的地方。很快就会耗尽系统分区。我好像有印象在论坛中有人报告说,芒果云安装后造成系统工作不正常的问题。其实,这不是芒果云系统的问题,芒果云系统的代码结构很好。原因是shell script安装程序有问题,不知道是写这个script的人疏忽了?还是对MyBookLive系统不甚了了? 把芒果云系统安装到了不合适的地方。我建议应当像上面第一个问题那样,把芒果云也安装到/dev/sda4的ext4分区中。我们也可以将kodexplorer目录拷贝到任意一个私有目录,再在系统的/var/www/目录中做一个符号连接。具体的命令是:
ln -s /DataVolum/shares/Public/你创建的私有目录名/kodexplorer  /var/www/kodexplorer

第三个问题:MetroUI代码中的账户名称和密码是hardcode方式的。只有一个,也不能更改,这不是一个好的设计。还有,如果输入错误的密码,屏幕就空了。我认为这也是一个bug,输错误密码应该提示错误,返回输入界面才对啊。为此我对代码做了小小修正,在login.php中增加了输入账户名称和密码不正确时的处理程序。

第四个问题:硬盘温度监控插件那段php程序显然是从论坛中某个地方生搬硬套地塞进index.php中的。其实那只是一个原型概念介绍。问题是塞的地方不对,只能在每次登陆或启动界面时调用一次,起不到实时监控的作用啊。那段程序的主体应当放在service.php中
才对,MetroUI代码中有定时刷新功能,会通过ajax调用service.php做实时数据更新。为了保持MetroUI界面现有的风格,实现这个改动需要用到一点javascript和jquery来写点代码。也不难写。三下五除二就完成了。我的代码中,每分钟刷新一次当前硬盘温度,你可以根据自己的需要进行调整。特别是使用aria2做下载迅雷离线、QQ旋风离线、百度云里的东西时,实时硬盘温度监控很有必要。


第五个问题:MetroUI界面中绑定了芒果云KodExplorer系统这个概念很好。但这两个系统是生硬地绑在了MetroUI界面中。就是一个生硬地链接式绑定,要进入芒果云还得再次登陆。芒果云是一个很好的系统,也非常适合作为MyBookLive系统的增值服务。如果能将MetroUI界面和芒果云系统有机地结合在一起,将为MetroUI界面增添不少光彩。芒果云系统有自己的用户登陆,管理功能,可以创建新用户,更改密码(密码是md5哈希单向加密方式,安全性蛮好的),等等。既然两个系统绑定在一个界面中,为何MetroUI不利用芒果云系统中的用户管理功能呢?当然,要想这么做,就要对两个系统的代码都有一定的了解。MetroUI代码非常简单,5分钟就能彻底了解。但芒果云系统就复杂多了,毕竟芒果云是个开源产品包,它的开发团队为此付出了辛勤的劳动。吃水不忘挖井人,让我们在这里向芒果云的开发团队致谢。我仔细读了一下芒果云的代码,认为MetroUI界面完全可以与芒果云有机地结合在一起。我的想法是,修正MetroUI代码,增加一些代码,检查芒果云系统是否与MetroUI系统同时存在?如果是,则优先利用芒果云用户和密码库做登录验证。否则按没有安装芒果云,用旧办法处理。这其实是留下一个小小的后门,用旧方法登录的后门。其实也没有必要留这个后门,这段后门代码可以删去。我在代码中标示了提醒,请大家来自行抉择。


改造后MetroUI的登陆界面不变,但我们可以用任何芒果云的账户和密码登陆MetroUI系统,从MetroUI系统转入芒果云系统当然也不需要再次登陆,直接按一下键就去了。在芒果云系统中也做一个“MY BOOK® LIVE™”键,按一下就回到MetroUI系统。两者有机地结合在一起。

看看改造后的版本截图是这个样子的:

  



其它鸡毛蒜皮的问题:MetroUI代码太粗糙,很多地方都没有好好做出错处理,我都一一补上了。MetroUI的换背景图片太难看,不喜欢。如果你也这样想,不妨利用利用芒果云系统中的漂亮图片呦。更换图片很简单,修改assets/js/supersized-init.js文件,这个文件很小,只有30多行。一看就明白如何修改。芒果云系统的图片在/kodexplorer/static/images/wall_page中。作为一个产品,无论是开源代码还是商业代码,都应当有一个好的结构设计。这是一个良好的习惯,也反映出开发团队的素质。MetroUI代码与芒果云代码的结构对比,其差距是显而易见的。当将两个系统集成在一起时,代码太粗糙的部分会令人感到不舒服。这也是我决定贡献一点力量为大家写一个更新版本的推动力。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

评分

参与人数 1云币 +6 贡献 +6 +6 收起 理由
mojelly + 6 + 6 + 6 赞一个! 666!请收下我的膝盖!

查看全部评分

最自然的一种表达方式,即是不写赞赏语,红色赞赏按钮就在那,大家懂的。
楼主热帖
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 印象
无线音乐盒

【原创】推敲MyBookLive人性化MetroUI的若干问题(2)

本帖最后由 f541883216 于 2017-11-4 04:00 编辑

下面谈谈如何安装我的更新版本:

百度附件:
游客,如果您要查看本帖隐藏内容请回复


1. 解压本文的zip文件,里面有两个目录(assets kodexplorer)和一个文件index.html
2. 在MBL/DataVolum挂接点中任意一个地方创建一个私有目录,可以是任何你喜欢的名字(例如:www)。或者利用MBL系统的原厂UI创建一个私有目录。
3. 将解压的两个目录(assets kodexplorer)和index.html文件上载到你刚刚创建的目录中。
4. 确认打开MBLSSH功能,浏览器进入http://你的MBL_IP/UI/ssh,访问SSH开关页面,选择启用,用户名root,密码welc0me,其中密码中0是数字零,不是字母O
5. 使用putty软件或类似的ssh telnet登录MBL,可以远程进入MBL进行命令操作。
6. 执行该命令cd /var/www进入到/var/www目录中。用ln命令来为目录创件两个符号连接。
7. 执行该命令 ln -s/DataVolum/shares/Public/你创建的私有目录名/assets  assets
8. 执行该命令 ln -s/DataVolum/shares/Public/你创建的私有目录名/kodexplorer  kodexplorer
9. 最后再把index.html文件拷贝到/var/www目录中,替换掉原来的index.html。替换前你可以把原来的文件改名做个备份。
10. 如果不能访问,请确认访问权限。一般来说可以简单设定为: root:www-data和755
11. 执行该命令
  1. chown -R root:www-data assets
复制代码
12. 执行该命令
  1. chmod -R 755 assets
复制代码
13. 执行该命令
  1. chown -R root:www-data kodexplorer
复制代码
14. 执行该命令
  1. chmod -R 755 kodexplorer
复制代码


大功告成,祝你好运。立刻试试吧。

版权说明:
MY BOOK® LIVE™ 是西部数据公司的注册商标
PuTTY 属于 Simon Tatham AllRights Reserved
芒果云® 属于kalcaddle.comAll Rights Reserved
aria2代码属于它的开发团队。
Yaaw代码属于它的开发团队。
MetroUI代码属于它的开发团队。
我的MetroUI更新版本是GNU General PublicLicense

作者简介:本人几个星期前才注册了论坛,是处于新生上路阶段。但凭着35年的计算机软硬件开发经验和技术专利,自认我也不是一个菜鸟。本人写过商业软件,也写过商业软件开源软件。是一个尊重知识产权,热心奉献社区论坛志愿者。都这把年纪了,30多年的老码农还能写代码?信不信由你吧。所以本人现在的笔名是:【老骥伏枥】啊。此文绝对是本人【原创】,如果你对本文的观点有不同意见,可以回帖喷我,本人不是一个固持己见老朽。

评分

参与人数 2云币 +6 贡献 +8 +8 收起 理由
mojelly + 6 + 6 + 6 赞一个!30年陈酿码农,果然出手不凡!
zungwai + 2 + 2 很给力!

查看全部评分

那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
【原创】推敲MyBookLive人性化MetroUI的若干问题(3)

根据论坛的管理员要求,我对前一个MetroUI更新版本进行了修正。感谢管理员给的彩色logo,我已经将它放入了修正版。在这个版版本中我还做了如下修正:
1. 修正了与芒果云最新测试版 v20-3.33登陆管理的对接代码。现在的MetroUI更新版既可以与芒果云v20-3.23当前版对接,也可以与最新测试版 v20-3.33对接。
2. 以前任何芒果云账户都可以登陆MetroUI系统,现在只容许具有管理员权限的账户才能登陆MetroUI系统。
3. 修正了SWAP使用率信息显示的串位问题。

看看改造后的版本截图是这个样子的:




安装方法没有改变,请参见【原创】推敲MyBookLive人性化MetroUI的若干问题(2)
游客,如果您要查看本帖隐藏内容请回复
  




本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
谢谢老前辈指导。虽然已是个过气产品。
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
这个产品过气吗?我还以为很多人用呢。看来我是落伍了。
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
老骥伏枥 这么网名好眼熟……膜拜一个 感谢优化!
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
f541883216 发表于 2016-12-9 03:52
这个产品过气吗?我还以为很多人用呢。看来我是落伍了。

撸主大神也~MetroUI以往确实有小小的不完善,不过都是以前的大神抽空写的,非常感谢你抽空进行优化!
看看两篇帖子是否需要合并?可以给你进行合并操作,这样便于浏览和交流
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
11条和13条的命令是否有误?
www-data后是否都缺失一个空格位?

11. 执行该命令chown -R root:www-data assets

13. 执行该命令chown -R root:www-data kodexplorer
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
受系统限制: 10000 字节 我自己合并不了。如果能和并当然好了。谢谢。
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
对,是都缺失一个空格位。不知为什么,我想修正,但修正不了。感谢指正。
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
f541883216 发表于 2016-12-10 14:15
对,是都缺失一个空格位。不知为什么,我想修正,但修正不了。感谢指正。

已经帮你修正了
那是云论坛 - 国内最开放NAS交流平台
http://www.nasyun.com
使用道具 举报 回复 支持 反对 印象
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回列表 搜索 官方QQ群