const electron = require('electron'); const url = require('url'); const remote = require('electron').remote; const Menu = remote.Menu; const BrowserWindow = electron.BrowserWindow; var ipc=require('electron').ipcRenderer; Namespace.register("CampusInfoBrowser");//注册命名空间 CampusInfoBrowser.CreatBrower=function (address) {//创建窗口 var http = /^(http)/; var https = /^(https)/; var li=$$("li", {//创建ul下的li "className": "BrowerList" }, CampusInfoBrowser.NavContainer); var ListBody=$$("div", {//创建li下的div "className": "BrowerListBody" }, li); CampusInfoBrowser.NavContainer.insertBefore(li,CampusInfoBrowser.AddButton);//把新建标签页按钮追加到ul的li下 li.data={//传窗口地址 "url":address }; ListBody.tag_favicon=$$("img", {//标签页图标 "className": "tag_favicon", "draggable":"false", "alt":"" }, ListBody); ListBody.tag_favicon.onerror=function () {//不存在时显示的标签页图标 this.src='public/img/tray/app.ico' }; ListBody.Webname=$$("p", {//标签页标题 "className": "Webname","innerHTML":"正在加载","draggable":"false" }, ListBody); ListBody.tag_close=$$("i", {//标题页关闭按钮 "className":"icon-cancel tag_close" }, ListBody); var BrowerContainer=$$("div", {"className":"BrowerContainer"},$("body")[0]);//装载webview var webview=$$("webview", {//创建webview "allowpopups":"", "autosize":"on" }, BrowerContainer); webview.tag=li;//把li赋给webview标签 webview.addEventListener("new-window",function (e) {//访客页面尝试打开新的浏览器窗口时触发。 const protocol=url.parse(e.url).protocol; if(protocol==='http:'||protocol==='https:'||protocol==="about:blank"){ CampusInfoBrowser.CreatBrower(e.url);//系统的默认浏览器中打开新的URL } }); webview.addEventListener("page-favicon-updated",function (e) {//当页面收到图标网址时触发 ListBody.tag_favicon.src=e.favicons[0]; }); webview.addEventListener('will-navigate',function (e) {//导航跳转时触发 this.tag.data.url=e.url }); webview.addEventListener('did-navigate',function (e) {//导航完成时触发 this.tag.data.url=e.url;`` ListBody.Webname.innerHTML=this.getTitle(); ListBody.click(); }); webview.addEventListener('dom-ready',function (e) {//加载完成webview后执行 var canGoForward = $(".icon-right")[0];//获取前进图标 var canGoBack = $(".icon-left")[0];//获取后退图标 var reFresh = $(".refresh")[0];//获取刷新图标 ListBody.Webname.innerHTML=this.getTitle();//更改webview的title CampusInfoBrowser.goBackWebView = function(){//执行后退 webview.goBack(); } CampusInfoBrowser.goForwardWebView = function(){//执行前进 webview.goForward(); } CampusInfoBrowser.reFresh = function(){//执行刷洗 webview.reload(); } if(webview.canGoBack()){//判断是否可以后退 canGoBack.style.color = '#5a5a5a'; }else{ canGoBack.style.color = '#d3d3d3'; } if(webview.canGoForward()){//判断是否可以前进 canGoForward.style.color = '#5a5a5a'; }else{ canGoForward.style.color = '#d3d3d3'; }; if(CampusInfoBrowser.UrlArea.value == ""){ reFresh.style.color = '#d3d3d3'; }else{ reFresh.style.color = '#5a5a5a'; } CampusInfoBrowser.LocalStorage(webview); }); webview.onmousedown=function (e) {//webview鼠标事件 CampusInfoBrowser.MouseMenu(CampusInfoBrowser.MouseMenuMain,this,CampusInfoBrowser.MouseMenuCallBack,e)//右键显示创建应用菜单 CampusInfoBrowser.OnclickMenu.style.display="none"; } ListBody.tag_close.onclick=function () {//点击标题页关闭按钮 event.stopPropagation(); var closeArr = []; for(var i=0;i<$(".tag_close").length;i++){//遍历li下关闭图标 closeArr.push($(".tag_close")[i]); } closeArr[0].index = 0;//设置li下第一个关闭图标的index if(ListBody.tag_close.index == 0){ webview.tag.nextSibling.onclick();//点击当前li下一个 }else{ webview.tag.previousSibling.onclick();//点击当前li上一个 } CampusInfoBrowser.NavContainer.removeChild(webview.tag);//移除当前li $("body")[0].removeChild(BrowerContainer);//移除当前webview } webview.src=address;//给webview的src传值 CampusInfoBrowser.UrlArea.onkeydown=function (e) {//获取搜索框值 if(e.keyCode===13){//keycode为13 if(this.value){//如果存在值 if(this.value.match(http) || this.value.match(https)){//判断是否存在http或https webview.src=this.value;//给webview的src传值 webview.tag.children[0].children[0].style.display = "block";//标签页图标显示 }else { webview.src='http://'+this.value;//给webview的src传值 webview.tag.children[0].children[0].style.display = "block";//标签页图标显示 } } } }; CampusInfoBrowser.IconLock();//判断是否为https CampusInfoBrowser.Bind(ListBody.Webname); ListBody.click();//点击li下的包裹节点 }; CampusInfoBrowser.MouseMenu=function (menu_main,data,callback,e) {//右键菜单事件 // e.preventDefault(); // e.stopPropagation(); var createNode=menu_main.parentNode;//获取第一和参数父元素 var MouseMenuMain=$('.MouseMenuMain');//获取右键菜单事件的ul元素 for(var i=0;icreateNode.offsetWidth){//判断距左位置 menu_main.style.left=menu_main.style.left.split('px')[0]-menu_main.offsetWidth+'px';//距左多少 } if(menu_main.getBoundingClientRect().top+menu_main.offsetHeight-createNode.getBoundingClientRect().top>createNode.offsetHeight){//判断距上位置 menu_main.style.top=menu_main.style.top.split('px')[0]-menu_main.offsetHeight+'px';//距上多少 } callback(data);//webview传入回调函数 document.onmouseup = null;//清空 } }; createNode.onclick=createNode.onmousewheel=function () {//执行右键菜单隐藏 for(var i=0;i=30){//如果如果li标签页大于35 confirm("窗口太多,请关闭一些再使用");//弹出提示 } }; CampusInfoBrowser.LocalStorage=function(webview){ var time = (new Date()).valueOf(); var datas={ url:webview.src, title:webview.tag.children[0].children[1].innerHTML, data:new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay()), time:new Date().toLocaleString(), key:time, } for (a in localStorage) { var str = localStorage[a]; var storage = JSON.parse(str) if(storage.title == datas.title || storage.url == datas.url){ localStorage.getItem(storage.key); localStorage.removeItem(storage.key); } } localStorage.setItem(time, JSON.stringify(datas)); } CampusInfoBrowser.Init=function () {//初始化 CampusInfoBrowser.UrlArea=$(".bowerSeach input")[0];//获取搜索框 CampusInfoBrowser.NavContainer=$(".bowerCreaterWindow")[0];//获取标签页ul CampusInfoBrowser.AddButton=$(".BrowwerAdd")[0];//获取新建标签页按钮 CampusInfoBrowser.BrowserHistory = $(".BrowserHistory")[0]; CampusInfoBrowser.BrowersMenuButtom=$("#bowerMenu")[0];//获取打开菜单 CampusInfoBrowser.MouseMenuMain=$("#CampusInfoBrowserMenu")[0];//获取右键菜单 CampusInfoBrowser.OnclickMenu=$("#CampusInfoBrowserOnclickMenu")[0];//获取菜单 CampusInfoBrowser.AddButton.onclick= function (){//点击新建标签页 CampusInfoBrowser.CreatBrower(''); var canGoForward = $(".icon-right")[0];//获取前进图标 var canGoBack = $(".icon-left")[0];//获取后退图标 var reFresh = $(".refresh")[0];//获取刷新图标 canGoBack.style.color = '#d3d3d3'; canGoForward.style.color = '#d3d3d3'; reFresh.style.color = '#d3d3d3'; CampusInfoBrowser.UrlArea.focus(); if(CampusInfoBrowser.UrlArea.value === ""){ this.previousSibling.children[0].children[1].innerHTML = "新标签页"; this.previousSibling.children[0].children[0].style.display = "none"; } }; CampusInfoBrowser.BrowersMenuButtom.onclick=function (event) {//点击菜单 (event || window.event).cancelBubble = true CampusInfoBrowser.OnclickMenu.style.display="block"; }; document.onclick = function (){ CampusInfoBrowser.OnclickMenu.style.display="none"; }; CampusInfoBrowser.IconLock = function(){//判断是否为https var http = /^(http)/;//http var https = /^(https)/;//https if(CampusInfoBrowser.UrlArea.value.search(https)!=-1){//判断搜索框是否有https $(".bowerSeach span")[0].style.color = '#035816'; }else { $(".bowerSeach span")[0].style.color = '#d3d3d3'; } } window.onresize=function (e) { Array.prototype.forEach.call($("webview"), function (elm) { elm.style.width=elm.style.height='100%';//给webview设置100%宽高 }); }; CampusInfoBrowser.OnclickMenu.History=function(){ ipc.send('BrowserHistory-show-window'); } CampusInfoBrowser.OnclickMenu.Feedback=function(){ ipc.send('BrowserFeedback-show-window'); } CampusInfoBrowser.OnclickMenu.Clear=function(){ localStorage.clear(); } var isBig=true;//窗口放大还原标示 $(".close")[0].onclick=function(){//关闭窗口 ipc.send('window-all-closed'); }; $(".max")[0].onclick=function(){//最大化 if(isBig){ ipc.send('show-window'); $(".max")[0].className='icon-window-restore max'; $(".bowerCreaterWindow")[0].style.padding = "0"; }else{ ipc.send('orignal-window'); $(".max")[0].className='icon-window-maximize max'; $(".bowerCreaterWindow")[0].style.padding = "15px 0 0"; } isBig=!isBig; }; $(".min")[0].onclick=function(){//最小化 ipc.send('hide-window'); }; CampusInfoBrowser.CreatBrower('https://www.baidu.com');//开始进入一个页面 }();