Archives for : 前端

星期五 上午阵雨转阴,下午阴 8~20℃

chrome扩展开发笔记(9) 发布插件到 Chrome 网上应用店

发布地址:https://chrome.google.com/webstore/developer/dashboard

  1. 需要 gmail 帐户登录。
  2. 要验证帐户和发布项目,需要支付 US$5.00 的一次性开发者注册费,后续发布插件不再需要付费。
  3. 付款时不能选择中国大陆信用卡,只能用国外或者香港、台湾的信用卡。

星期五 多云 6~18℃

chrome扩展开发笔记(8) 已安装扩展的存放目录

win7 的 chrome 扩展存放目录:

C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\Extensions

Administrator 换成自己电脑的用户。

里面可以看到源码。


办公室健身(7)

俯卧撑,早上 40 个。

星期四 多云 3~11℃

thinkpad 禁用触摸板和小红帽的方法

见这篇日志的更新:http://www.zhugao.net/today/2013/1780.html


SwitchHosts

https://github.com/oldj/SwitchHosts

注意:使用时会替换当前 hosts 文件内容,如果系统 hosts 里有自定义内容,建议事先备份。


html5 本地存储(localStorage)的一些资料

项目不考虑 IE,终于可以无顾忌的使用 html5 了。

localStorage 的一些参考资料:


让notepad++支持less语法高亮

  1. 设置 -> 语言格式设置 -> 语言里找到CSS,在自定义扩展名输入框中填入less。
  2. 重启notepad++,重新打开一个less文件。

参考:http://www.smuwcwt.com/archives/697


办公室健身(6)

俯卧撑,早上 50 个。

星期三 中雨转阴 2~11℃

chrome扩展开发笔记(7) 内容安全策略(CSP)

如果使用 setInterval 或 setTimeout 可能会报以下错误:

Refused to execute JavaScript URL because it violates the following Content Security Policy directive: "script-src ‘self’ chrome-extension-resource:".

解决方法是 function 不要以字符串的形式传入,例如:

setInterval("fn()", 1000)
setTimeout("fn()", 1000)

似乎也不能用匿名函数传入(不确定),例如:

setInterval(function(){}, 1000)

统一改成以下形式:

setInterval(fn, 1000)
setTimeout(fn, 1000)

参考:

http://open.chrome.360.cn/extension_dev/contentSecurityPolicy.html

https://sites.google.com/site/crxdoczh/reference/formats/manifest/contentsecuritypolicy

http://t.qq.com/p/t/211198078314976

星期日 阴 5~14℃

解决ThinkPad鼠标串动问题(禁用触摸板和小红帽的方法)

2013-3-14 更新

外接USB鼠标后,如果在操作时不小心触到触摸板,相当于两个鼠标同时使用,引起鼠标失控(串动)。

进入:

控制面板 – 鼠标 – UltraNav

(如果没有 UltraNav 选项卡,则需要安装 UltraNav鼠标驱动,选择对应的 thinkpad 型号查找鼠标驱动)

禁用触摸板的方法:

把“启用 TouchPad”前的勾取消。

禁用小红帽的方法:

把“启用 TrackPoint”前的勾取消。

不过这两个功能不能同时禁用。可以按下面的方法设置,以更保险的不让“鼠标串动”的现象发生:

 先禁用触摸板功能,然后点小红帽功能边上的“设置”按钮,把滑尺移到“重按”的一端。

参考:http://zhidao.baidu.com/question/496847014.html

2013-3-16 更新:

今天发现重启后,触摸板又被激活了,要重新进入控制面板。

原因:

尊敬的联想用户您好,重新启动后触摸板会重新启动,您需要在控制面板–鼠标–触摸板选项中重新设置即可。此情况是为了避免在外出携带时,没有鼠标,避免造成无法使用的问题。

参考:http://zhidao.baidu.com/question/528025627.html

找了个 BIOS 禁用触摸板的方法:

进入BIOS > Config > Keyboard/Mouse > TouchPad,设置为Disabled

参考:http://thinkpad.baike.com/article-325663.html

但是发现我的 E430c 在 BIOS 里没有找到这个 TouchPad 这个选项。

没办法,只好进控制面板,把“鼠标”快捷方式拖到开始菜单的“启动”项里,这样每次开机会自动打开鼠标控制面板,直接关闭面板就可以了,不用设置。


chrome扩展开发笔记(6) notification(桌面通知)

第一次开发chrome扩展,摸索,现学现用,花了大约五天时间完成我的第一个chrome扩展,比预计的时间延迟了两天。

今天再把 notification 总结一下。

1、加载 html

可以使用 webkitNotifications.createHTMLNotification 加载 html 页面

例:

var notification = webkitNotifications.createHTMLNotification(‘notification.html’);

2、对输入兼容性不好

例如在 notification 里放一个 textarea,只有当前窗口是 chrome 时才可以顺利输入,如果当前窗口是其他程序,则不能获取到 textarea 输入焦点。

3、如何只弹出一个桌面通知

先定义一个标记状态,然后使用 onclose 事件,关闭时改变标记状态。

例:

var notify_is_close = true,
 notification = null,
 b_interval;

function init() {
 b_interval = setInterval(function () {
  if (notify_is_close) {
   notification = webkitNotifications.createHTMLNotification(‘../notification.html’);
   notify_is_close = false;
   notification.onclose = function () {
    notify_is_close = true;
   }
   notification.show();
  }
 }, 3000);
}

init();

4、在 popup 里关闭 notification

接上例,在 background.js 里定义一个关闭桌面通知的 fn

function closeNotification() {
 notification.cancel();
 notify_is_close = true;
}

然后在 popup.js 里可以通过 getBackgroundPage() 调用这个 fn

chrome.extension.getBackgroundPage().closeNotification();

关于 notification 的详细参考:

http://open.chrome.360.cn/extension_dev/notifications.html

http://dev.chromium.org/developers/design-documents/desktop-notifications/api-specification


在家健身(65)

  • 卷腹 50*2

以前的日志里写“仰卧起坐”,后来听说更准确的词是“卷腹”(和上学时体育课的“仰卧起坐”区分开)。

星期六 晴转多云 8~30℃

chrome扩展开发笔记(5) 关于 manifest_version

manifest.json 里的 manifest_version 字段。

manifest_version

用整数表示manifest文件自身格式的版本号。从Chrome 18开始,开发者应该(不是必须,但是2012年底左右就必须了)指定版本号为2(没有引号),如下所示:

"manifest_version": 2

manifest版本1从Chrome 18才开始逐步被弃用,版本2目前并不是必须的,但预计我们将在2012年底强制只支持版本2。还没有准备好支持manifest版本2的扩展、应用和主题,可以明确指定版本1,或者索性不提供本字段。

参考:http://open.chrome.360.cn/extension_dev/manifest.html#manifest_version

manifest_version 设为 2 后,有一些旧的字段不能使用。

比如,原来的

"background_page": "background.html"

要改成

"background": { "page": "background.html" }

另外,也不能直接在 html 上写 js,要用 src 引入 js 文件。


办公室健身(4)

俯卧撑 40 个,上午十点。

星期五 晴 7~26℃

chrome扩展开发笔记(4) manifest.json 里 icons 尺寸

manifest.json 里面的 icons 设置,建议设置成 icon 尺寸的两倍,否则在苹果 Retina 下图标会有点糊。

"icons": {
 "128": "icon_256.png",
 "48": "icon_96.png",
 "19": "icon_38.png"
}


js“提示还可以输入多少字数”

function countStrLength(str) {
 var str_length = 0;
 for (var i = 0; i < str.length; i++) {
  if (str.charCodeAt(i) <= 256) {
   str_length += 1;
  } else {
   // 中文,可以根据需要改为 2
   str_length += 1;
  }
 }
 return str_length;
}
function checkLength(obj, maxnum, numid) {
 var less_num = document.getElementById(numid);
 var str = obj.value;
 var len = maxnum – countStrLength(str);
 if (len < 0) {
  less_num.style.color = ‘#f30′;
 } else {
  less_num.style.color = ‘#333′;
 }
 less_num.innerHTML = len;
}

引用:

<textarea onkeyup="checkLength(this,100)"></textarea>

参考:提示你还可以输入字数(汉字减2)


屌丝团记忆(1) 聚餐

人员到齐了,三个后端,三个前端,当然还有一个总,一共七个。

今晚聚一聚。


办公室健身(3)

俯卧撑 40*2,上午十点、下午六点各一组。

计划以后来公司第一件事就是先做俯卧撑。

星期四 晴 7~25℃

chrome扩展开发笔记(3) 打开一个新标签,在扩展图标上显示数字

打开一个新标签

前两天用 chrome.tabs.create 方法,今天发现一个快捷方法,直接用 <a> 链接,不过 <a> 标签上要加 target="_blank",这个很重要。

用 <a> 标签还有一个好处,当你不在使用 chrome,点击 notification 里的链接,也仍然可以用 chrome 打开一个新标签,即使电脑的默认浏览器不是 chrome.

在扩展图标上显示数字

chrome.browserAction.setBadgeText({text: String(111)});
chrome.browserAction.setBadgeBackgroundColor({color:[25, 135, 0, 250]});

详细参考:http://open.chrome.360.cn/html/dev_browserAction.html#method-setBadgeBackgroundColor


办公室健身(2)

今天觉得手脚有点酸。有个同事说经常加班又没运动,会导致肌肉萎缩引起手脚酸。

听他这么一说,赶紧做几个击掌俯卧撑。

星期三 晴 7~23℃

chrome扩展开发笔记(2) Manifest文件

http://open.chrome.360.cn/extension_dev/manifest.html

name、version、manifest_version 是必填字段,另外,permissions 也是一个重要字段。

星期六 阴转多云 1~8℃

chrome扩展开发笔记(1) chrome扩展开发指南

官方文档:https://developer.chrome.com/apps/

非官方中文版:https://crxdoc-zh.appspot.com/

Chrome扩展开发指南(系列教程):http://dev.chromechina.com/forumdisplay.php?fid=30

一个简单的入门例子:http://blog.sina.com.cn/s/blog_6fae3d7601010cu4.html

2013-3-5 更新(推荐)

今天发现这个文档,不错。

Google Chrome扩展开发指南全部翻译工作完成


欧盛 W180 总算装上微信了

试了微信的几个版本,都不行。

4.5 和 4.3 直接安装不了,不兼容。

2.1 和 4.0 以及 4.2 可以安装,但是安装后登录不了,一登录就自动关闭应用,返回桌面。

最后发现 3.6 可以安装也可以使用(是在豌豆荚里下的 3.6 安智市场版本),但是有些功能用不了(比如图文信息)。后来发现这个网址,这里面的版本应该都可以在欧盛w180下安装使用(没有测试)。

另外,W180 刷不了 2.2 及以上版本的 android 系统。

该换手机了。