XMLHttpRequest Level 2 简称XHR2添加了ProgressEvent接口,使得可以不借助第三方插件,使用原生Javascript就可以实现上传下载进度监控。

下载的progess事件由XMLHttpRequest对象自身触发,而上传的progess由XMLHttpRequest.upload对象触发。

使用原生的Javascript可以这样写：

1
2
3
4
5

var xhr = new XMLHttpRequest();
// 下载进度监控
xhr.addEventListener("progress", download_progress_handler, false);
// 上传进度监控
xhr.upload.addEventListener("progress", upload_progress_handler, false);

如果使用JQuery则需要一些曲折,因为JQuery没有对上传下载进度监控提供直接的支持。但是$.ajax函数提供了xhr和xhrFields配置接口,可以修改JQuery内部使用的XMLHttpRequest对象的属性,甚至可以提供自己的XMLHttpRequest对象供JQuery使用。

所有有了以下两种方式来配置$.ajax实现进度监控:

使用xhr配置

1
2
3
4
5
6
7
8
9
10
11
12

$.ajax({
 //.....
 xhr: function() {
 // 获取JQuery内部使用的XMLHttpRequest对象
 var xhr = $.ajaxSettings.xhr(); 
 // 下载进度监控
 xhr.addEventListener('progress', download_progress_handler, false); 
 // 上传进度监控
 xhr.upload.addEventListener('progress', upload_progress_handler, false);
 return xhr;//一定要返回，不然jQ没有XHR对象用了
 }
});

使用xhrFields配置

1
2
3
4
5
6
7
8
9
10
11
12

$.ajax({
 //......
 xhrFields: {
 onsendstart: function() {
 // this指向JQuery内部使用的XMLHttpRequest对象
 // 下载进度监控
 this.addEventListener('progress', download_progress_handler, false);
 // 上传进度监控
 this.upload.addEventListener('progress', upload_progress_handler, false);
 }
 }
});

进度事件处理函数

此时的事件对象为ProgressEvent

1
2
3
4
5
6
7
8

function upload_progress_handler (e) {
 if (e.lengthComputable) {
 var percentComplete = e.loaded / e.total;
 // ...
 } else {
 // 不能计算进度
 }
}

References:
[1]Using XMLHttpRequest
[2]jQuery+FormData+文件上传+上传进度

===
[erq]

现代浏览器中的DOM对象有一个classList属性,这是一个DOMTokenList类型的对象。这个对象有add,remove,toggle,contains方法,可以用来操纵或测试DOM元素的class。

img元素的width和height属性只会取出图像当前的宽度和高度,这宽度和高度可能不是图像原始的尺寸,因为img元素可以指定width和height属性。

现代浏览器为img元素添加了两个属性naturalWidth和naturalHeight可以获取图像的原始尺寸。这两个属性是只读的。
jquery没有对应的属性或方法，可以通过获取原始的dom对象来读取这两个属性。

对于不支持这个两个属性的浏览器,可以通过生成一个不设定width和height的内存图像来获取原始尺寸。

代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var image = document.getElementById("img_id");

if(typeof image.naturalWidth == "undefined") {
 // legacy browsers
 var tmp_img = new Image();
 tmp_img.addEventListener('load', function(e){
 var rw = tmp_img.width;
 var rh = tmp_img.height;
 });
 tmp_img.src = image.src;
}else{
 // modern browsers
 var rw = image.naturalWidth;
 var rh = image.naturalHeight;
}

===
[erq]

最新版本的Mac OS X内置的bash仍然是3.x, 下面使用brew更新bash到4.x

安装bash
js$ brew install bash

/etc/shells文件最后附加一下行:
js/usr/local/bin/bash

更改当前用户的shell
js$ chsh -s /usr/local/bin/bash

即便如此,Terminal仍然使用系统内置的bash,也就是/bin/bash,这可以通过Terminal Preferences来修改。修改Shell open with为Default login shell或者为 command(complete path)，空白处填/usr/local/bin/bash即可。

或者更暴力更直接一点:

1
2

# cp /bin/bash /bin/bash-3.bak
# ln -sf /usr/local/bin/bash /bin/bash 

最后看一下bash版本:

1
2
3
4
5
6
7
8
9
10

$ echo $BASH_VERSION
4.3.24(1)-release

$ bash --version
GNU bash, version 4.3.24(1)-release (x86_64-apple-darwin13.3.0)
Copyright (C) 2013 Free Software Foundation, Inc.
License GPLv3+: GNU GPL version 3 or later <http://gnu.org/licenses/gpl.html>

This is free software; you are free to change and redistribute it.
There is NO WARRANTY, to the extent permitted by law.

===
[erq]

直接删除jdk目录即可

JDK所在目录为/Library/Java/JavaVirtualMachines/jdk_major.minor.macro_[_update].jdk

比如删除以下 jdk 1.8

rm -rf /Library/Java/JavaVirtualMachines/jdk1.8.0_06.jdk

===
[erq]

regex(Regular Expression)的posix标准是unix平台共同遵守的,而gnu对regex做了大量扩展,使regex更好用,但不是所有的平台都支持gnu扩展。

Mac OS X平台就只支持posix标准而不支持gnu扩展,因此使用gnu扩展的脚本在Mac OS X平台上运行时就会遇到兼容性问题。

比如匹配所有空白字符的\s就是gnu扩展,如果要在Mac OS X上匹配所有空白字符要使用[[:space:]]。

下面是几个常见的GNU扩展对应的posix表达:
\w - [[:alnum:]_]
\W - [^[:alnum:]_]
\s - [[:space:]]
\S - [^[:space:]]

更多详细信息见参考文档。

References:
[1]POSIX Basic Regular Expressions
[2]POSIX Bracket Expressions
[3]GNU Regular Expression Extensions
[4]Regular Expressions Reference Sheet

===
[erq]

jessie源里的rdesktop升级到1.8.2,参数-E不再适用,也就是不能禁止客户和服务器之间的连接加密,否则无法正常使用rdesktop.

文件名使用GBK编码的zip包在linux平台上解压时,如果系统locale是UTF-8,用unzip解码时文件名会出现乱码,unzip以前上有一个-O参数来指定解压时使用的编码,但现在这个参数已经无效了。可以使用依云写的python3脚本gbkunzip来解压此类zip包。

python经典的图像处理库叫Python Imaging Library (PIL),but当前并不支持python 3,并且已经几年没有更新了。不过有一个fork版本叫Pillow支持python 3,并且开发活跃。debian官方源里的python3-pil包即是Pillow。

openlayers 3 is released! ol3’s homesite change to http://openlayers.org/