话不多说，直接上码：

index.html

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

        <link rel="stylesheet" href="css/style.css" />

        <link rel="stylesheet" href="js/themes/default/default.css" />

        <link rel="stylesheet" href="css/bootstrap.min.css" />

    </head>

    <body>

        <div class="main">

            <iframe src="https://www.baidu.com" class="frame" border="0"></iframe>

            <div class="bottom">

                &nbsp;&nbsp;

                <img alt="新增邮件" src="img/edit.png" width="20" height="20" onclick="edit()" />

                &nbsp;&nbsp;

                <img alt="退出" src="img/exit.png" width="20" height="20" onclick="exit()" />

            </div>

        </div>

        <div class="modal fade bs-example-modal-lg" id="myModal" tabindex="-1" role="dialog">

            <div class="modal-dialog modal-lg" role="document">

                <div class="modal-content">

                    <div class="modal-header">

                        <h4 class="modal-title">编辑邮件</h4>

                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

                    </div>

                    <div class="modal-body">

                        <form>

                            <textarea name="content" style="width:760px;height:400px;visibility:hidden;"></textarea>

                        </form>

                    </div>

                    <div class="modal-footer">

                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

                        <button type="button" class="btn btn-primary">保存</button>

                    </div>

                </div>

            </div>

        </div>

    </body>

</html>

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript" src="js/kindeditor-all-min.js"></script>

<script type="text/javascript" src="js/lang/zh-CN.js"></script>

<script type="text/javascript" src="js/bootstrap.min.js"></script>

<script type="text/javascript" src="js/init.js"></script>

<script type="text/javascript">

    var editor;

    KindEditor.ready(function(K) {

        editor = K.create('textarea[name="content"]', {

            allowFileManager: true

        });

    });

    function edit() {

        $('#myModal').modal('show');

    }

</script>

package.json

{

    "name": "mail",

    "main": "index.html",

    "nodejs": true,

    "window": {

        "title": "万华邮件管理",

        "toolbar": true,

        "width": 800,

        "height": 600,

        "resizable": true,

        "show_in_taskbar": true,

        "frame": true,

        "kiosk": false,

        "icon": "./img/email.png"

    },

    "webkit": {

        "plugin": true

    }

}

init.js

// Load native UI library

var isShowWindow = true;

// Load native UI library

var gui = require('nw.gui');

var win = gui.Window.get();

win.maximize();

var tray = new gui.Tray({

    title: '邮件工具',

    icon: './img/email.png'

});

tray.tooltip = '邮件工具';

//添加一个菜单

// var menu = new gui.Menu();

// menu.append(new gui.MenuItem({

//     type: 'normal',

//     label: '退出',

//     click: function() {

//         if (confirm("确定退出Feynman工具吗？")) {

//             win.close(true);

//         }

//     }

// }));

// tray.menu = menu;

//click 托盘图标事件

tray.on('click',

    function() {

        if (isShowWindow) {

            win.hide();

            isShowWindow = false;

        } else {

            win.show();

            isShowWindow = true;

            win.maximize();

        }

    }

);

win.on('close', function() {

    win.hide();

});

function exit(){

    if (confirm("确定退出邮件工具吗？")) {

        win.close(true);

    }

}

我的node-webkit笔记的更多相关文章

  1. node 学习笔记

    以下笔记默认安装完成node 及npm 1.安装express 新版本的express-generator已经独立出来,全局安装这个包就ok. npm install express-generato ...

  2. node学习笔记－搭建node环境

    最近项目要用到node,利用空闲整理做下笔记 第一步  安装node,方式比较多,最为直接的是直接去官网     可直接从官网下载安装http://nodejs.cn/download/ 根据自己情况 ...

  3. Node.js笔记1

    Node.js入门笔记 1. node -help 可以显示帮助信息2. node REPL 模式(Read-eval-print loop) 输入—求值—输出循环 直接在cmd输入node 可以进入 ...

  4. node学习笔记（二）（ajax方式向node后台提交数据）

    通过ajax向node后台提交数据过程(附手写前后台代码),并总结post与get的区别 POST 前台代码 //CSS简单给点样式 <style> form{ width: 200px; ...

  5. Node学习笔记（二）

    1.package.json详解Node.js 在调用某个包时,会首先检查包中 package.json 文件的 main 字段,将其作为包的接口模块,如果 package.json 或 main 字 ...

  6. node.js 笔记

    教程总结笔记: 学习网站:http://www.runoob.com/nodejs/nodejs-install-setup.html Node.js 中文网及安装文件下载: http://nodej ...

  7. Nodejs全站开发学习系列 & 深入浅出Node学习笔记 & Spider抓取

    https://course.tianmaying.com/node 这个系列的文章看起来很不错,值得学习一下. /Users/baidu/Documents/Data/Interview/Web-S ...

  8. node学习笔记（连载）

    这段时间玩了小程序.浏览器插件.koa建站,本来想写几篇文章总结一下的.迫于工作上有新需求要跟进,所以先写写读书笔记吧.公司九点上班,不过弹性工作时间,大家基本上九点半之前到.而我作为渣渣,八点半就到 ...

  9. Node.js 笔记02

    一.关于命令 常用命令: dir 列出当前目录下面所有的文件 cd 目录名 进入到指定的目录,. 当前目录, .. 进入上级目录,cd . 当前目录, cd .. 上级目录 md 目录名 创建文件夹 ...

  10. node.js 笔记（一）

    参考:https://github.com/alsotang/node-lessons 感谢!!! 本文属于小白入门级笔记,请大牛自动屏蔽!!! 1.     开发环境 os: 10.12.6 nod ...

随机推荐

  1. MongoDB分片，唯一索引与upsert

    前言 分片,唯一索引和upsert,表面上看似没有直接联系的几个东西,到底存在怎样的瓜葛呢? 分片 为了保持水平扩展的有效性,分片功能必须保证各个片之间没有直接关联,不需要与其他分片交互就可以独立做出 ...

  2. springboot 集成百度的唯一ID生成器

    UidGenerator是百度开源的Java语言实现,基于Snowflake算法的唯一ID生成器.而且,它非常适合虚拟环境,比如:Docker.另外,它通过消费未来时间克服了雪花算法的并发限制.Uid ...

  3. MySQL 自带的4个系统数据库的说明

    自带的4个系统数据库:information_schema.mysql.performance_schema.sys: information_schema:这个数据库保存了mysql服务器所有数据库 ...

  4. Go入门:创建第一个Go工程

    前言 我是一名iOS开发. 因为公司后台都用的Go. 因为对服务端不了解. 所以想自己学习学习. 环境 因为自己的电脑是mac.然后在阿里云买的是centOS的服务器. 所以下面搭建的环境都是在cen ...

  5. 前后端分离结构中使用shiro进行权限控制

    前阵子在前后端分离项目中集成shiro项目,折腾了一下子,参考了网上一些博客,发现大多都还是之前传统的模式,并不适用于前后端分离结构.今天抽空整理了下demo,方便以后使用以及后来人参考. 一.spr ...

  6. Django bootstrap按钮点击后激活active

    现在有个需求,就是在导航栏上有若干个按钮,我想实现的功能是当点击某个按钮后修改文字颜色,这样网站会更人性化.现总结方法如下: index.html: <ul class="navbar ...

  7. 拖拽插件SortableJS

    在项目中,经常会遇到一些涉及到拖拽的需求,github上面有一个开源的SortableJS的插件,支持Vue,React,Angular等多种框架,实现效果很好,基本可以满足大部分的需求,下面就第一次 ...

  8. 推荐系统(recommender systems):预测电影评分--问题描述

    推荐系统很重要的原因:1>它是机器学习的一个重要应用2>对于机器学习来说,特征是非常重要的,对于一些问题,存在一些算法能自动帮我选择一些优良的features,推荐系统就可以帮助我们做这样 ...

  9. 阿里云（CentOs）搭建SVN服务

    系统环境 CentOS Linux release 7.6.1810 (Core) 一.通过yum命令安装svnserve,命令如下: yum -y install subversion 此命令会全自 ...

  10. hive中时间操作（二）

    转:https://blog.csdn.net/qq646748739/article/details/77997276 --Hive中日期函数总结:--1.时间戳函数--日期转时间戳:从1970-0 ...