机翻MarionetteDoc-安装Marionette

安装Marionette

与所有JavaScript库一样,有几种方法可以开始使用Marionette应用程序。在本节中,我们将介绍最常见的方法。

快速启动使用NPM和Webpack

NPM是一个JavaScript的软件包管理器。

    //使用NPM通过命令行界面进行安装
    npm install backbone.marionette

Webpack是一个构建工具,可以轻松将您的依赖关系集中到一个捆绑包中,以将其传递到浏览器的标签。它与Marionette和jQuery非常相似。

在这里, 我们用Webpack准备了简单的marionettejs骨架。

快速开始使用NPM和Brunch

Brunch是快速的前端Web应用程序构建工具,具有简单的声明性配置,无缝增量编译,可快速开发,有意见的流水线和工作流程,以及源地图的核心支持。

在这里, 我们准备了与Brunch的简单的marionettejs 和Brunch的简单框架。

快速开始使用NPM和Browserify

Browserify是一个构建工具,可以轻松地将NPM模块捆绑到应用程序中,因此您可以require像将导入任何其他语言的依赖项一样。

在这里, 我们用Browserify准备了一些简单的marionettejs框架。

Browserify 和Grunt

Grunt是一个task-runner。这是简单的Browserify + Grunt框架。

Browserify和Gulp

Gulp是流媒体制作系统。这里是简单的Browserify + Gulp框架。

在winform嵌入浏览器

正值我休息在家,陪着可爱的表妹时候,同学突然打电话问我,墩儿,你能做个报表么。
正好我闲啊,在家没啥事,就说可以,接下来了
此后才是噩梦的开始
要求很简单,把他的文本文档处理成报表就可以了

我太天真了。。。以为随便做一个就好就用php写了一个,感觉不够舒服又用java写了个,仔细想了几天,我日。。。他们不是软件公司啊。。。肯定要桌面程序。。。。fuck

然后拾起了大二后再没摸过的C#,下了个VS2017 community就开始做了,开始还挺简单,一边自学一边做,然后用MSChart做出来了 我日啊。。。好丑,而且 不!能!缩!放!
这是个死命的bug啊。。。我目光投向了嵌入浏览器一途,自带的webBrowser内置的是ie,调整ie的适应性比吃屎好不到哪去 我又去找怎么换这玩意内核,找了一个坑又一个坑以后发现了美妙的CefSharp,简直是救星,内置的是酷容心,完美!

//开发过程
//先创建工程,然后去工程属性调节所需要的.net版本 NUGET搜索cef下载你对应的版本(.net 4.0 对应 37.0.0版本)
命名空间引入 :
CefSharp;
CefSharp.WinForms;

//启动项目加入新类 
InitBrowser();
//启动类写入
public ChromiumWebBrowser browser;
    public void InitBrowser()
    {
        CefSettings setting = new CefSettings();
        //字符编码固定utf-8
        setting.Locale = "UTF-8";
        //读取文件地址
        string path = AppDomain.CurrentDomain.BaseDirectory + "\\chartPage.html";
        //转换地址字符串
        path = "file://" + path.Replace("\\", "/");
        //打入设定
        Cef.Initialize(setting);
        //打入文件地址
        browser = new ChromiumWebBrowser(path);
        //添加控件
        this.Controls.Add(browser);
        //控件填满窗体
        browser.Dock = DockStyle.Fill;
        //注册js对象 GetJson是新的class 函数一定要有get
        browser.RegisterJsObject("rtn", new GetJson());
    }
    //按键执行js fun = recall
      private void Button2_Click(object sender, EventArgs e)
    {
        browser.ExecuteScriptAsync("recall()");
    }
    //静态变量 用于传递数据
     class Staticvariable
    {
    public static string fileUrl;
    }
    //开放给js的接口
    class GetJson
    {
    public string ReturnJson
    {
        get
        {
        //特定国量化
            Thread.CurrentThread.CurrentCulture = new CultureInfo("en-US");
            return "js";
        }

然后html里面写

    function recall() {
    setData(rtn.returnJson);
    }
    function setData(data){
     alert(data);
    }

就可以打通了,如果data = json的话我是通过string拼json然后给html的。。。然后用js的json格式化方法JSON.parse(data);来做的
还有个困扰我很久的无法引用js文件的问题,换成cef以后完美解决

附上项目地址 https://github.com/hanasakari/WinfromEchartsDemo

枚举类

Java枚举类
今天写代码时候,上司告诉我type没有自己的解析类,调类的懒人慌了,我毕竟是个菜鸡,于是看了下前人的代码,仿写了一个枚举类,可以传入需要解析的代码,传出需要的参数
附上代码

package **.**;

import cn.web.util.JSONUtil;

import java.util.ArrayList;
import java.util.List;

import com.fasterxml.jackson.annotation.JsonFormat;

/**Type解析类
 * Created by zhanchi 2016/9/27.
 * 记得最后getTypeName()
 */

@JsonFormat(shape = JsonFormat.Shape.OBJECT)
public enum MType {
    //每个元素对应下面的this
    ANY(0, "","不限",99),
    UNKNOWN(9,"","未知", 99),
    TYPE1(1,"","标签1", 1),
    TYPE2(2,"","标签2", 2),
    TYPE3(3,"","标签3", 3);
    /**标签id*/
    private int typeId;
    /**标签代码*/
    private String typeCode;
    /**标签名字*/
    private String typeName;
    /**顺序*/
    private int sequence;

    private MType(int typeId,String typeCode, String typeName, int sequence) {
        this.typeId = typeId;
        this.setTypeCode(typeCode);
        this.typeName = typeName;
        this.sequence = sequence;
    }

    /** 通过typeId获取MType对象*/
    public static MType getMType(int typeId) {
        for(MType e : MType.values()) {
            if(e.getTypeId() == typeId) {
                return e;
            }
        }
        return getMType(999999);
    }

    /** 通过typeCode获取MType对象*/
    public static MType getTypeCode(String typeCode) {
        for(MType e : MType.values()) {
            if(typeCode.equals(e.getTypeCode())) {
                return e;
            }
        }
        return getTypeCode(String.valueOf(999999));
    }



    public String toString() {
        return JSONUtil.objectToJsonStr(this);
    }

    public int getTypeId() {
        return typeId;
    }

    public void setTypeId(int typeId) {
        this.typeId = typeId;
    }

    public String getTypeName() {
        return typeName;
    }

    public void setTypeName(String typeName) {
        this.typeName = typeName;
    }

    public int getSequence() {
        return sequence;
    }

    public void setSequence(int sequence) {
        this.sequence = sequence;
    }

    public String getTypeCode() {
        return typeCode;
    }

    public void setTypeCode(String typeCode ) {
        this.typeCode = typeCode ;
    }



    }

Echarts & DataTable 打通记录

产品经理向来是喜欢向码农找麻烦的主,虽然我以前也是其中一员
可算尝到其中滋味了
这次不是,给我找了个不小的麻烦,需求是地图关联DataTable,点击地图相应会有DataTable刷新
对于不会js的我简直是虐待,苦苦做了一周之后今天得到大神指点

全局变量


四个大字点醒了我,我拘泥于一个变量必须在函数里面却忽略了全局这一关系,代码明日更新,这个博客今晚只做备份

Tengine编译记录

以前一直使用apache进行服务器部署,从未考虑过什么,直到最近我发现了一个东西,nginx,这个东西引发了我的兴趣,容易的扩展和强大的性能吸引着我去一探究竟。
我选择了淘宝的开源项目Tengine 因为我比较信任能抗住双十一这种并发级别的能力。
废话不多说,上主菜。

/××
×环境CentOS7.0 64位 
×/

首先下载必要的支持包

tengine
http://tengine.taobao.org/download/tengine-2.0.3.tar.gz
pcre-8.32
http://jaist.dl.sourceforge.net/project/pcre/pcre/8.32/pcre-8.32.zip
openssl-1.0.1g
https://www.openssl.org/source/openssl-1.0.2j.tar.gz
nginx-hmux-module-1.3
https://github.com/wangbin579/nginx-hmux-module.git
nginx_tcp_proxy_module-0.4.5 
https://github.com/yaoweibin/nginx_tcp_proxy_module.git
nginx_cache_purge-2.3
http://labs.frickle.com/files/ngx_cache_purge-2.3.tar.gz
需要自行确定是使用wget还是git clone

依赖库下载
yum install gc gcc gcc-c++ pcre-devel zlib-devel make wgetopenssl openssl-devel ncurses ncurses-develibxml2-devel libxslt-devel gd-devel perl-ExtUtils-Embed GeoIP-devel gperftools gperftools-devel libatomic_ops-devel perl-ExtUtils-Embed dpkg-dev libpcrecpp0 libgd2-xpm-dev libgeoip-dev libperl-dev lua-devel libxslt-devel libxml2 libxml2-dev geoip-devel geoip libatomic_ops libatomic_ops-devel openssl openssl-devel gd gd-devel libunwind-devel libunwind -y

nginx所需依赖库十分多,我甚至多安装了一个gperftools来保证依赖库,我甚至已经忘了我到底用的什么依赖库了,先全列上去保证能编译,之后我再删除多余的库

为了可以使用tcp代理,我们需要下载主角Tengine 然后下载nginx_tcp_proxy_module-0.4.5 解压后在tengine目录中打入补丁

patch -p1 < ../nginx_tcp_proxy_module-master/tcp.patch

编译openssl

cd ../openssl-1.0.1g
./config  && make && make install

确认以上所有支持库都下载并解压好后,进入Tengine的主目录准备编译

请注意,下面的文件名和地址核对后编译,否则会失败

./configure --prefix=/usr/local/nginx \
--lock-path=/var/lock/nginx.lock \
--pid-path=/var/run/nginx.pid \
--error-log-path=/data/logs/nginx/error.log \
--http-log-path=/data/logs/nginx/access.log \
--user=nobody \
--group=nogroup \
--with-pcre=../pcre-8.32 \
--with-pcre-opt=-fPIC \
--with-openssl=../openssl-1.0.1g \
--with-openssl-opt=-fPIC \
--with-backtrace_module \
--with-http_stub_status_module \
--with-http_gzip_static_module \
--with-http_realip_module \
--with-http_concat_module=shared \
--with-http_sysguard_module=shared \
--with-http_limit_conn_module=shared \
--with-http_limit_req_module=shared \
--with-http_split_clients_module=shared \
--with-http_footer_filter_module=shared \
--with-http_geoip_module=shared \
--with-http_sub_module=shared \
--with-http_access_module=shared \
--with-http_upstream_ip_hash_module=shared \
--with-http_upstream_least_conn_module=shared \
--with-http_referer_module=shared \
--with-http_rewrite_module=shared \
--with-http_memcached_module=shared \
--with-http_upstream_session_sticky_module=shared \
--with-http_addition_module=shared \
--with-http_xslt_module=shared \
--with-http_image_filter_module=shared \
--with-http_user_agent_module=shared \
--with-http_empty_gif_module=shared \
--with-http_browser_module=shared \
--with-google_perftools_module \
--with-http_map_module=shared \
--with-http_userid_filter_module=shared \
--with-http_charset_filter_module=shared \
--with-http_trim_filter_module=shared \
--with-http_lua_module=shared \
--without-http_fastcgi_module \
--without-http_uwsgi_module \
--without-http_scgi_module \
--without-select_module \
--without-poll_module \
--add-module=../nginx-hmux-module-1.3 \
--add-module=../nginx_tcp_proxy_module-0.4.5 \
--with-ld-opt='-ltcmalloc_minimal' \
--http-client-body-temp-path=/data/nginx_temp/nginx_client \
--http-proxy-temp-path=/data/nginx_temp/nginx_proxy \
--http-fastcgi-temp-path=/data/nginx_temp/nginx_fastcgi

编译完成后make test检查是否有错误,无则直接make && make install
享受nginx带来的便利吧,nginx的使用记录我之后体验过后写

如果有错误请指出

CentOS中的svn服务快速搭建

因为最近换了个新的服务器,svn服务需要重新搭建下,感谢http://www.liaoxiansheng.cn/?p=30 作者 liaoxiansheng,我以前一直用他的教程来直接搭建svn,这次自己写一个方便下自己。
废话不多,先说主要的。

//登入服务器 检查是否有 svn服务,如无则执行安装
yum install subversion -y //安装svn并且执行yes口令
//返回security 等待返回Complete!则安装成功
//创建一个文件夹来做仓库
mkdir -p /opt/svnrepos //创建一个文件夹,如无这个路径则一起创建(-p)
//使用svnadmin口令来创建一个空版本库
svnadmin create /opt/svnrepos
ls //查看文件
//目前有conf文件夹 db文件夹 format hooks文件夹 locks readme.txt
cd  ./conf //进入文件夹
ls //查看文件
//conf下有 authz权限 passwd 账户密码 svnserve.conf 配置文件
//我们先处理权限 
vi ./authz
//其中配置文件
[/] //全局属性
abc = rw //abc用户对仓库下全部文件有读写权限
[/forlder] //具有对某个文件夹的属性
aac = rw //aac用户对/forlder 文件夹下全部有读写权限
//配置好权限以后保存退出
//进入passwd
[users] //用户
abc = 123 //abc账号的密码是123
aac = 223 //aac用户的密码是223
//设置好后保存退出
//进入sncserve.conf
//将被注释的配置文件删除注释符号,顶格记住不能留空格
anon-access = none //无授权用户禁止访问
auth-access = write //有授权的用户可以写文件
password-db = passworrd //账户密码配置文件
authz-db = authz //读取权限配置文件
realm = /opt/svnrepos //认证命名空间,svn的根目录
//杀死全部的svn进程 killall svnserve 
svnserve -d -r /opt/svnrepos //默认端口3690 如果需要特殊端口则添加参数 --listen-port 端口 即可
 netstat -antp | grep svn //检查运行状况
 //在客户端check put一下
 svn://ip:post //svn地址,我并没有用apache对接svn服务所以使用的是svn协议
 //最后输入用户名和密码就可以快乐的使用了