1、编写index.html文件
这里我们需要播放某一个目录下所有的网页文件,要做到切换不同的网页,可以在index.html中使用iframe。通过js动态改变iframe的src属性,从而动态地切换显示的网页。index.html代码如下:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>play file</title> 5 <script src="script.js"></script><!-- 这是引入的js外部文件 --> 6 </head> 7 <body> 8 <h1>paly all file!</h1> 9 <iframe id="showwin" frameborder="0" scrolling="no" width="100%" height="100%" ></iframe> 10 </body> 11 </html>
2、编写js代码进行遍历
在node-webkit中我们可是很方便地使用到node.js进行文件遍历,我们只需写一行var fs = require('fs');即可是用node.js提供的函数进行遍历。我们将所有的js代码放在外部的script.js文件中,然后在index.html文件引入即可。script.js代码如下:
1 var fs = require('fs');// 2 var second = 1000;//播放间隔时间 3 var paths = "C:/Users/user/Desktop/dome/source"; //指定要播放的目录 4 var fileList = new Array(); //存放要播放的文件 5 var page; //iframe 6 window.onload = function (){ 7 page = document.getElementById("showwin"); 8 findfile(paths);//解析目录,将所有网页文件的路径找出并存放在fileList数组里面 9 start(); 10 } 11 12 //get the file path 13 function findfile(filepaths){ 14 var dirList = fs.readdirSync(filepaths); 15 dirList.forEach(function(item){ 16 if(fs.statSync(filepaths + '/' + item).isFile()){//是文件则放入数组 17 if(item.indexOf(".html") != -1)//只将网页文件路径放入数组 18 fileList.push(filepaths + '/' + item); 19 } 20 else if(fs.statSync(filepaths + '/' + item).isDirectory()){//是目录,继续遍历 21 findfile(filepaths + '/' + item); 22 } 23 }); 24 } 25 26 //播放网页 27 var m = 0; 28 function show(){ 29 page.src = fileList[m]; 30 if (m == fileList.length - 1) 31 m = 0; 32 else 33 m++; 34 } 35 36 //开始播放 37 function start(){ 38 time = window.setInterval("show()", second);//没隔一秒播放一个网页 39 }
3、编写package.json文件
package.json文件代码如下:
1 { 2 "name": "nw-demo", 3 "main": "index.html", 4 "window": { 5 "frame": false, 6 "width": 500, 7 "height": 500, 8 "toolbar": false, 9 "position": "center", 10 "resizable": false, 11 "kiosk":true 12 } 13 }
其中frame:false表示播放的时候,窗口的框架不显示。toolbar:false表示播放的时候,地址栏不显示。resizable:false表示播放的时候,窗口大小不能改变。kiosk:true表示播放的时候全屏。
4、运行,将这三个文件直接压缩成zip文件(这三个文件都是在zip文件的根目录下),script.js中地三行制定好要要播放的网页文件的目录。将zip文件改名成dome.nw,再将dome.nw拖入nw.exe即可运行,运行界面如下: