修复 MOTO milestone 电源键失灵(教程)

教程在后面,请先让我吐会槽 :)

去年9月份买的MOTO Milestone,8月份的时候,突然出现了电源键失灵的情况,按下去没有回馈,机器也没反应,好在Milestone 是有滑盖的,滑开键盘也可以点亮屏幕,完成解锁动作。至于开机,平时很少有这样的需求,万一不小心关机,可以用数据线连接电脑,会激活手机,完成开机。

结果中秋节的时候,去南京找两个朋友完,早上出门后,突然不知道怎么回事关机了,然后由于没有背电脑,就开不了机了,还约了一个高中同学下午见面的,这下才觉得非常不能忍受这个按键坏掉了。想到淘宝上的卖家承诺的一年保修,打算尝试下。

联系了店铺的客服,客服直接让我把手机给他们寄过去维修,态度还蛮好,我就放心的把手机按照规定写好字条给他们寄了过去,大约一周后,收到了寄回来的手机,确实修复了这个按键。但是用了会儿后发现,手机振动失效了,拿下电池观察了下,发现里程碑的振动器是可以从电池仓看到的,发现被一小块海绵堵住了,估计是维修人员技术太次,没注意留在机器里的,我自己用个回形针把它勾出来了,就好了。

修好后第二天,按键又坏掉鸟。。。两天大概按了20次左右吧,因为已经养成解说推开键盘的习惯了。晚上亲眼看见一个金属碗状的原件从手机里掉出来,当时就先把这个原件保存下来,第二天联系售后,售后说肯定是我排线坏了什么的,我说这个按键明显按下去没有回馈了,和好的时候是不一样的,售后说要想修可以再寄回来,费用还是 AA。随后此售后还说我怀疑他们的修理能力,笑话,这种维修质量,智商没问题的人都会怀疑你们吧。我哪儿再敢寄回去呢,于是决定自己动手,丰衣足食。

首先,在网上搜索了下 milestone 拆机图,找到了这个链接 http://moto.zol.com.cn/167/295_1663342.html

当然,要拆掉机器,你肯定需要工具才行,手机的螺丝钉和常见的不一样,需要专业的工具,所以你还需要这样的工具(我这个是很早前买的,就是为了拆各种电子设备的)

有了此工具,你就可以方便的按照上面帖子,开始拆机了,不要被那个拆机教程吓到了,我们只是拆开外壳就可以完成按键的维修了,不需要大卸八块。

拆掉后盖,就可以拿掉所有实体按键了,其实按键的远离很简单,下面板子上有两个未接触起来的触头,实体按键和这个板子中间隔了一个碗状的金属片,按下按键的时候,这个碗状的金属片会把下面两个触头链接起来。

下面是我的维修的时候的图片。

那个黄色的东西就是我说的碗状的金属片了,最后一张图,是正常的音量键上的。找到原因,就好维修了,立马下楼去超市买了双面胶,回来把那个金属片固定在它应该在的位置上,接上电池,测试OK,然后装上后盖,就可以用了。

需要特别注意的地方:电池仓下面的那个喇叭外面的黄色金属条,很软很软哦,小心点拆,我的就被我撕裂了。。。

如果你的那个金属碗状物都找不到了,试试求助淘宝,看看能不能买到这个玩意儿吧。

下次再也不相信淘宝上的 JS了。爆下这个JS的店铺名:南京大学生手机网,下次再也不在这个店铺买了。

 

 

 

 

localStorage in HTML5(2)

上一篇博客简单的介绍了下 localStorage,并且对各个浏览器的存储空间大小做了简单的测试。在上篇博客到这篇博客期间,世界也发生了很多变化,IE9 和 firefox4 正式版都发布了。于是我也对这两个新的浏览器进行了测试,关于 localStorage 的, IE9 和 IE8 表现一致,FF4 和 FF3.6 表现一致,和上篇博客中介绍的一样,FF4 在 Mac 下和 WIN 下表现仍然不一致,参考上篇博客。同时,给出我写的测试存储空间大小的页面,你可以自己来试试:http://lab.allenm.me/html5/storage/maxtest.html

除了最基本的和使用 cookie 一样使用 localStorage,我们还能用它来做什么呢?

如果你看过 localStorage 的文档,你应该注意到了我们在改变 localStorage 中存储的数据的时候,会触发一个 storage 事件:

interface StorageEvent : Event {
  readonly attribute DOMString key;
  readonly attribute any oldValue;
  readonly attribute any newValue;
  readonly attribute DOMString url;
  readonly attribute Storage storageArea;
  void initStorageEvent(in DOMString typeArg, in boolean canBubbleArg, in boolean cancelableArg, in DOMString keyArg, in any oldValueArg, in any newValueArg, in DOMString urlArg, in Storage storageAreaArg);
};

 

既然我们可以知道此“源”下的localStorage 中的某个字段的值发生了变化,那我们就可以在前端做到跨页面通信,这个是有意义的。 你想想看,在我们目前的WEB应用中,经常会发生这样的事情:在淘宝或者其他电商网站购物,点击购买某个物品,会在页面上购物车中显示。然后在新的 tab 页中打开其他物品的页面,也点击购买,新的页面当然会显示你购买的所有物品,但是旧的页面中的购物车却并不会主动更新这个数据。以前的技术并不是不可以实现这个,只是相对来说成本较大,没有必要。利用 localStorage ,我们就可以只使用前端技术来同步这个数据,成本极小。

我写了一个简单的利用 storage 事件来做前端层面的夸页面数据同步,请在支持 localStorage 的浏览器中打开两个此页面:http://lab.allenm.me/html5/storage/ ,然后在任意一个中输入任意字符,再看看另外一个页面中有什么变化。

我们知道 localStorage 中,我们只可以保存字符串。但是有些时候,我们需要保存一些结构比较复杂的数据,字符串不适合做这种工作,自己再制定一种特殊的规则来利用字符串保存这些数据,也是不明智的选择。因为我们已经有了 JSON 这个事实上的标准了啊。要让 localStorage 支持 JSON 的存储也比较容易,我们只需要自己再封装一层就OK了。现代浏览器已经原生支持 JSON 的解析,JSON.parse() 用来把字符串解析成 JSON 对象,JSON.stringify() 用来把 JSON 对象编码成字符串格式。有了这两个方法,我们只需要在存储的时候,编码,获取数据的时候,解码就可以实现用 JSON 来存储数据了。具体封装这里就不给出代码了。

即使有些不够现代的浏览器不支持 JSON.parse() 和 JSON.stringify() 也没关系,因为我们还有开源的 js 实现的 JSON 的解析器和编码器:老道的 JSON-js

localStorage 还有一个孪生兄弟,叫 sessionStorage,他们的用法基本一致,同属于 WEB Storage, 只是保存的数据的生命周期有区别,详情请阅读这里

localStorage in HTML5(1)

HTML5 中的 localStorage 我相信 web developer 们,都听说过了吧。目前 chrome,firefox,opera,safari, IE8 都支持此属性,注意 IE8 也支持,那就是说,如果你的网站用户不是太低端,起码有一半以上的用户的浏览器是支持 localStorage 特性的。各个浏览器分配给每个“源(region)”的 localStorage 空间至少为 5M(具体数值请看稍后讨论),对于想开始使用 HTML5 的人们来说,这个是个不错的开始。

localStorage 使用方式也非常简单,有 setItem, getItem, removeItem,key, clear 5个方法,和 length 一个属性。定义如下:

interface Storage {
  readonly attribute unsigned long length;
  DOMString key(in unsigned long index);
  getter any getItem(in DOMString key);
  setter creator void setItem(in DOMString key, in any value);
  deleter void removeItem(in DOMString key);
  void clear();
};

localStorage 中都是以 key/value 的形式来存储数据的,存储的数据类型都是字符串,如果需要其他类型,需要自行转换。我们可以使用 setItem 方法来存储数据,例如 localStorage.setItem(‘foo’,’test data’); 这样来存储一个 key 为 foo 的数据,然后可以使用 getItem 来读取 value 值,即 localStorage.getItem(‘foo’); 如果 setItem 的时候,key 已经存在,则修改保存的数据为最新的数据,如果不存在,则新建 key。执行 removeItem() 可以删除已经存储的数据,比如localStorage.removeItem(‘foo’) 可以删除 key 为 foo 的数据。执行 clear() 会清除此“源”下的所有数据。key() 方法可以获取第 n 个数据的 key 值,例如 localStorage.key(0) 可以获取到第 0 个 key/value 对 的 key 值。这个配合 length 属性可以遍历出所有存储的值。length 属性返回已经存储的数据的条数。

上面简单的介绍了下 localStorage 的用法,然后我们来讨论各个浏览器分配了多少空间给 localStorage。

在各个浏览器中,只有 opera 可以清楚的看到用了多少空间,当这个容量到达 5M 的时候,浏览器就会提示用户是否增加容量,如果用户点击了拒绝,那此后就不会再提示,如果不删除这些数据,将不能再存储,抛出错误。如果用户点击了允许,那将获得以前两倍的空间,等到达了新的上限后,又会弹出提示,以 5M -> 10M -> 20M -> 40M 这样递增。

另外 IE8 的 localStorage 对象,有个 remainingSpace 的属性,可以查看剩余的可用空间,在 IE 中执行 alert(localStorage.remainingSpace) 可以看到 IE8 有5M 的最大存储空间。如果达到最大值,会抛出错误,不清除数据前将不能继续存储。

其他浏览器我还没找到办法查看最大容量,但是我用同样的脚本在不同的浏览器里跑,等到达最大值后,查看存储的键值对的数量,结果如下:opera 可以存储 1482 条记录,chrome 和 safari 可以存储1986条,MAC下的 firefox 3.6  可以存储3970条,IE8 下可以存储 3786条。WIN 下的 firefox 3.6 一直没得到结果,一直没有抛出错误,好像是无限的一样。(以上浏览器都是使用的截止到今天的最新的正式版)。 win 下的 firefox 3.6 的问题还有待验证,我使用的环境是虚拟机下的 windows7 系统。

从 IE8 的 remainingSpace 属性可以看出默认最大容量也是 5M ,和 opear 相同,但是存储的条目数量却相差很大,猜测可能是使用了压缩算法,因为存储的都是字符串,压缩率还是非常可观的。chrome 和 safari 具体的最大容量,从这里也没办法推断出来,不过既然 opera 存储的条目数最少,那我们就认为至少可以存储 5M 的数据吧。

有了 5M 这个数量,我们就可以判断哪些数据适合用这个来存储,哪些不适合。毕竟现在如果存储满了后,还没有什么好办法来清除一些不再使用的数据,因为我们从代码里不容易判断哪些是用户很少用到的。最好使用这个 feature 来实现一些用户体验加强的东西,而不是来实现关键性的东西。

另外在 IE8 以下的版本,我们可以使用其他技术来代替,比如 IE 特有的 userData,或者 flash store 。可以考虑封装一下,暴露出统一的接口给用户( developer)使用。

2011春运,该怎么买火车票?

又到了年关了,在外辛辛苦苦一年的游子们终于可以回家看看爹娘,看看家乡。可是春运啊,一票难求,那个什么部说的什么时候解决一票难求的新闻,实在是没法让心信,早就不相信此类新闻了。

可是家要回,票要买。那要怎么买呢?我在买火车票前一个星期的时候,写了一个自动抓取 58 同城和百姓网上的转让信息的脚本,然后放在 VPS 上。用 cron 定时每10分钟执行一次,在买票的那两天,我甚至提高到3分钟一次。具体脚本怎么写,我就不说了,没什么技术含量。抓回 HTML 用正则匹配有用的信息,和上次抓回来的比较,有更新,就发个 email 通知就可以了。可是效果怎么样呢?信息获取的到是蛮及时,可是,打过去绝大部分都是黄牛,而且都是低等黄牛,开口就加300 ,票面钱才 300 呢。一到这个时候,58 同城,赶集网,百姓网上的这些转让信息基本全部是黄牛,所以我没有靠这个买到票。不排除有真正是行程原因走不了的,但是一个个的试,太累了。

那怎么办?尝试电话订票吧,现在基本全国各地都开通了电话订票,电话订票也是有技巧的,要在发售时间前10分钟左右打进去才有可能定到票,比如杭州12点发售,那就11.50的时候就打进去,打不进就一直重拨,加上海的区号重播,打进去后,先不要选择,随便按按无关紧要的听听,看准时间,到了12点,马上开始操作订票,我看到有几个老乡这样订到了票。如果你回家的线路不是太紧张,就更容易了,同事有下午4点半打进去定到了卧铺的。我因为各种原因错过了订票的最佳时机,基本20分钟后就订不到武汉方向的了,没有通过此方式定到票。

其实最容易买到票的方法,是找黄牛。。没办法,虽然大家都恨黄牛,但是这个时候,还是黄牛管用啊,要找靠谱的黄牛,每个公司都会流传一些口碑很好的黄牛吧,就找他们就对了,加的钱也不多,票也靠谱,这次我的大多数同事都是这样定到的。

对于上班族来说,去排队买票是最不划算的事情了,大半夜就要去排队,还不知道要排多少个小时,耗时耗体力,不划算,可能还要请假,有请假损失的钱还不如花钱买黄牛票了。

我这次的票,是一个人买的黄牛票,后来买到了时间更合适的黄牛票,然后转手的。

综上所述,买火车票,要多方面行动,电话订票,黄牛票,转让票都要兼顾,有票了不妨先拿下,有更好的可以转手,这个时间的票很好转。另外要多和老乡们交流,一般大公司会有老乡群什么的,大家在一起交流车票信息,有利于找到更靠谱的车票。

什么时候才能解决春运问题,不敢想,还是自己努力挣钱,直接飞机回去吧,不用这么痛苦。

买票搞的身心疲惫,白天的工作时间都用来买票了,现在要开始加班把这些补回来,要不然项目完不成了。真杯具。

chrome.tabs.create 的 callback 不执行?

在写 chrome 插件的过程中,不知道你有没有遇到使用 chrome.tabs.create 创建一个新的 tab,但是这个方法的 callback 却不执行,具体说来,在调试的时候是可以执行的,关掉 chrome  的 DEBUG 工具后,就不可以了。

前几天我也遇到了这个麻烦,可能出现这种问题的情况为:在点击浏览器上插件的图标后,打开一个 popup 的页面,在这个页面里点击某按钮后执行 chrome.tabs.create 方法新建一个新的 tab 页,关掉 DEBUG 工具后,此方法的 callback 函数就无法执行。

我们先来观察这种 popup 的页面的行为,随便找一个会 popup 页面的扩展,点击,让页面弹出,然后你切换下浏览器上已经打开的 tab 页,看看发生了什么?是不是这个 popup 出来的页面会关闭掉?然后在那个扩展上右键,选择“审查弹出内容”,再切换下 tab,发现了什么?是不是这个弹出的页面依然打开?

这就是问题所在了,默认情况下,chrome.tabs.create 创建新的 tab 后,会自动切换到那个新建的 tab,在不打开 DEBUG 工具的情况下,原先弹出的页面会关闭,也就是被 unload 了,页面中 js 的宿主已经不在了,当然也就不会执行 callback 了。那应该怎么办呢?很简单,不切换 tab 就OK了。在 chrome.tabs.create 的第一个参数中,是有个 selected 的可选属性的,把这个属性置为 false,就不会自动切换到新窗口去了。例如下面的代码:

chrome.tabs.create( { url:chrome.extension.getURL('./html/testy.html'), index:(S.tab.index+1), selected:false }, function(tab){
				setTimeout(function(){_send2Spliter(tab); },50 );
});

我的 callback 中,使用了 setTimeout,是因为我遇到的另外一个问题,我需要在新的 tab 打开后,向新的 tab 发送一点数据,但是大部分时候会失败。经过测试,发送数据的程序是执行了,但是 tab 中接收数据的 callback 未能执行。于是猜测,是新的 tab 中的  chrome.extension.onRequest.addListener 还没来得及执行造成的,于是就稍稍延迟下,再发送数据,这样就OK了。

如果你遇到向新建的 tab 中发送数据失败的情况,不妨也试试这个方法。

Hello,2011

2011年的第一天马上就要结束了,和以前一样,现在要做个2010年的总结和对 2011 的展望。

2010年,角色发生了较大的变化,离开了学校,开始了工作。从头开始回忆2010发生的一些点点滴滴吧。

2010年一月份,开始做毕业设计了吧,是一个Android程序,拿到了导师买来的智器Q5,这个算是第一次和Android亲密接触。虽然这个MID很差劲,但是刚拿到手的时候还是觉得很好玩。为了完成毕设,开始看Android的开发文档,开始学习JAVA。同时,因为已经签了前端的工作,而2009年才开始走上前端这个路,所以基础还差的远,所以也利用在学校的这段时间多看看书,买回来了 《javascript 权威指南》,开始看这部大部头。

二月,应该是过年的时候吧,洗澡的时候发现肚子越来越挺了,是该要注意自己的饮食了。同时,寒假的空余时间比较多,可以用来专心看权威指南,在寒假看完了这本书,收获颇丰。

三月-五月,来到了杭州,开始了我的实习生涯,很庆幸有个非常和气的导师,和一群非常热心的同事,这段时间是我感觉进步最快的时间,在师父和同事,特别是邻座的同事的帮助下,从一个菜鸟,到可以独立完成任务。

六月,回学校搞毕设,以及和大家道别。毕设最后我没选择 JAVA,因为对我来说,这东西太不熟悉,用的很别扭,于是,就使用了 PhoneGap 这个框架把 WEB APP 封装成原生 APP。然后很轻松的过了毕设,而且拿到了较高的分数,只是这个时候,什么分数对我来说都是浮云,我只想和大家过完最后一段时间。

六月,是个伤感的季节,喝酒,叙旧,谈自己的心里话,虽然知道有讲不完的话,但是还想尽量多讲点,因为大家都知道以后再见就不容易了。一群爷们,晚上在楼道喝酒,可以喝的个个都嚎啕大哭,大家这四年都有遗憾的事情,大家都有很多事情没来得及,可是,哥们们,人生不可能完美,这我们都知道,擦干泪水,让我们都好好努力吧。

毕业总是有太多太多想说的,一直到最后一天,大家拥抱,挨个送别,知道吗?坐上出租车从学校走的时候,心都要碎了,真想时间能停下来,让我再看看这个学校,再看看这里每个可爱熟悉的面孔。现在回想起来,还是鼻子一阵酸,这是我人生最难忘的回忆。这里也有三篇纪念文(123),相信多年后,翻起来看看,颇有意思。

七月,正式入职了,入职培训,拓展训练是给我印象最深的东西,也给了我很多感触,我也专门写过一篇博文

八月到年末,不断的做需求、项目,然后慢慢的成长。中间在方凳会上分享了3次,这些都是非常高兴的事情,不过分享质量有待提高,以后我也会准备更精彩的内容和大家分享,我喜欢这种氛围,并愿意去为之做点事情。

夏天,和小帅和袁帅见过两次面,在这么远的地方和朋友见面是一件很高兴的事情,尤其是在这个城市,没有一个以前的朋友的时候,这种感觉更是强烈。

十一的时候,苗苗也来杭州玩了,也是同样的感觉,而且特容易勾起关于学校的回忆。元旦,苗苗也在杭州,3号去见面。

最后两个月,获得了提前转正的机会,然后又在 2010 年最后几天,从现在的运营组调到平台产品组。这些都是对我的信任,其实我自己知道,自己的能力还很不够,但是我会一直努力让自己去提高的。这次换组,对我来说挑战蛮大的,新的小组做的产品比运营组做的产品会复杂很多,不过我喜欢这些挑战。

2010年,没有什么积蓄,也只买了一个手机,算是比较大件的东西,开始体会到了生活的不易。

2010年,依然木有女朋友。

好了,该说说我期望的2011 了。

先说说工作上,我依然要在前端开发这条路上走下去,要去学习更多的东西。在这一年,不止从工龄上不再是新人,从能力上,也要摆脱新人,调整好心态,和团队共同进步。同时,要慢慢学会高调做事,低调做人。现在做事和做人都蛮高调 ,要改改了。

工作外的事情:

  1. 买一台新笔记本,现在这台差不多不能用了,最好是 MAC。
  2. 要有一些积蓄,改考虑考虑以后的生活了,不能像现在这样月光,以后怎么样都懒的想。
  3. 多读一些书,不仅仅是技术类的,社科类的也要多读。
  4. 多锻炼身体,每周至少一次(是的,我知道很难,但是我就是要写出来提醒自己)
  5. 每月至少两篇技术博客,多做分享总是对的。
  6. 能获得自己想要的感情。

以上都是最想实现的,相信在这一年我还有很多事情想做,很多短期的,随着当时的环境想做的,我要不拖拉,挨个实现。

写完已经是2011的第二天了,好了,开始为这一年的目标努力了,我会让这一年成为精彩的一年。

使用SVN hook 让前端BUG少一点

你有没有发生过,发布的代码中含有 console ,然后在 IE 下报错?或者代码中有调试用的alert,用户点击某个东西后,就会弹出来?

这种错误 ,我相信前端开发者或多或少都会犯,要避免这类的BUG ,需要非常非常小心,但是人总会有疏忽的时候,这样的事情交给机器办比较合适,因为机器会按照指定的规则来检查你提交的代码,每次都完全按照规则来。

版本管理软件一般都有预置的hook,我们可以写一些脚本在我们对代码仓库做操作的时候来执行,这里,我将给出一个 TortoiseSVN 可以使用的 client side hook 脚本来做这种检测。

这个是目前我在实际生产环境使用过一段时间的,因为我们这里使用的 SVN 做版本控制,SVN 标准只需要 server 端实现 hook script,客户端不需要,由于大公司server端不那么容易去更改,恰巧 TortoiseSVN 实现了 clientside hook ,那就用这个来实现吧。

按照官方文档给的 pre commit hook script 修改而来,使用前,先要检查你的windows 是否用 WScript 关联了 .js 文件,绝大部分前端开发人员都关联了某个编辑器吧。

检测方法:随便新建一个 js 文件,里面写上”WScript.Echo(“Hello World!”);”,双击看能不能运行,如果你关联了编辑器,就肯定不行了,如果弹出个窗口“hello world”,那就可以跳过这一节了。

恢复windows 默认 .js 文件关联程序的方法:修改注册表,[HKEY_CLASSES_ROOT\.js] 项下的那个默认值改成 “JSFile”。修改完后看看刚才的测试文件是否正常运行。

然后,在本地磁盘任意位置新建 .js 文件,保存此代码:

/**
* author: Allen.M
* blog: http://blog.allenm.me
* date: 2010-12-13
* 根据 http://tortoisesvn.googlecode.com/svn/trunk/contrib/hook-scripts/client-side/PreCommit.js.tmpl 修改
* this script is a local pre-commit hook script.
*/
var objArgs,num;

objArgs = WScript.Arguments;
num = objArgs.length;
if (num != 4)
{
    WScript.Echo("Usage: [CScript | WScript] PreCommit.js path/to/pathsfile depth path/to/messagefile path/to/CWD ");
    WScript.Quit(1);
}

var paths = readPaths(objArgs(0));
var message = "list of paths selected for commit:\n";
var pattern = /^\s*(?!\/\/)(alert|console)/;
var haveWarning = false;
var i = 0;
while (i < paths.length)
{
	message = message + paths[i] + "\n";

	var content = readPaths(paths[i]);

	for(var m = 0, l = content.length; m < l; m++){
		if(pattern.test(content[m])){
			haveWarning = true;
			message = message + 'warning: ' + paths[i] + ' line ' + (m+1) + ' have "alert" or "console" \n';
		}
	}
	i = i + 1;
}
message = message + "path of message file is: " + objArgs(2) + "\n";

if(haveWarning){
	WScript.Echo(message);
}
WScript.Quit(0);

function readPaths(path)
{
	var retPaths = new Array();
	var fs = new ActiveXObject("Scripting.FileSystemObject");
	if (fs.FileExists(path))
	{
		var a = fs.OpenTextFile(path, 1, false);
		var i = 0;
		while (!a.AtEndOfStream)
		{
			var line = a.ReadLine();
			retPaths[i] = line;
			i = i + 1;
		}
		a.Close();
	}
	return retPaths;
}

然后按照下图所示配置脚本。

需要注意的是,指定脚本文件的地方,一定要在前面加上WScript,否则你 ci 代码的时候会得到一个出错信息。

此脚本不干涉你CI代码,即使有 alert ,console 等关键字,也只会给出个 warning ,代码还是可以 ci 成功,当出现 warning 的时候,你需要做的是检查代码是不是有问题。 //console 这样被注释掉的代码是被忽略的。另外你的代码要使用 windows格式的换行符,否则会有检测失败的情况。

检测代码的关键代码是中间的那行正则,你可以修改为适合你的。

warning 是这种形式显示的,如果无warning 信息,则会安安静静的。

阿里巴巴中国站大力招聘前端工程师以及视觉、交互

欢迎各位自荐或者推荐,简历请发送到 i [at] allenm.me, 下面是各职位的 JD

地点:杭州

前端开发工程师:

We build the web,
making the world and ideas in our dream come true.

职位描述:
1、根据产品原型开发前端代码, 并配合我们的后端工程师完成后端数据的接口;
2、解决主流浏览器及其不同版本之间的兼容性问题;
3、优化网站的前端性能, 保证网站的高质高速;
职位要求:
1、熟悉掌握各种Web前端技术基础: (x)HTML、CSS、JavaScript、ActionScript等, 有JavaScript|| ActionScript高级应用经验的尤佳;
2、理解Web标准,对可用性、可访问性等相关知识有实际的了解和实践经验;
3、了解一门后端语言(如Java、PHP、C++、Python、Ruby), 并能将其和前端语言进行配合;
4、个性乐观开朗, 思维逻辑性强, 善于和各种背景的人合作;
5、专业不限,其中计算机、数学、自动化等相关专业优先考虑;
6、富有创业精神, 充满激情, 乐于接受挑战.

在以上要求基础上,有以下任意一点将优先考虑:
1、参加过开源项目
2、喜欢混迹各大技术社区,并有自己的声音
3、互联网重度使用者
4、了解相关前沿技术
如果你有 twitter, facebook, 个人blog 等一些社会化的东东,麻烦告知我们,另外可以告诉我们为什么要成为一名前端攻城师
如果你想更多的了解我们,可以登陆我们UED的博客:www.aliued.cn

交互设计师:

职位描述:

  • 参与网站产品前期的规划构思,完善产品概念。
  • 根据产品需求制定交互方案,输出产品原型和设计说明文档。
  • 对产品进行持续的设计优化,提升用户体验。

职位要求:

  • Nice,open,有同理心,擅于换位思考,对新鲜事物充满好奇,擅于发现。
  • 对交互和用户体验设计有深刻理解,具备自己完整的知识和理论体系,掌握基本的UED设计方法。
  • 2年以上互联网体验设计经验,熟悉网站设计流程,至少独立完成过一个大型完整项目中的交互设计工作。
  • 具备较强的逻辑思维能力和表达沟通能力。擅于说服和达成共识。
  • 丰富的知识和阅历,对用户习惯有研究,具备一定的设计前瞻性。一定的视觉设计和html技能。
  • 工业设计、计算机、视觉传达、心理学、信息学相关背景;资深网虫。

视觉设计师:

职位描述:

  • 负责网站产品界面的视觉设计及产品的在线推广设计工作。
  • 负责产品的情感需求分析,创建原型。和产品开发团队共同创建界面工作。
  • 实现界面的视觉和美术设计方面的设计,如图标、主题、背景等。制定产品用户界面的风格及标准。
  • 参与产品在线推广活动的策划与设计实现工作。
  • 吸引用户使用产品。

职位要求:

  • 本科以上学历,美术,视觉传达,工业设计相关专业,2年互联网工作经验。
  • 对用户界面设计,交互设计相关工作有浓厚兴趣,富于团队精神。
  • 熟悉界面设计的流程方法,出色的设计语言表达能力,优秀的创新与沟通协调能力。
  • 精通photoshop、illustrator、flash、dreamweaver等常用制作工具;懂htm语言。
  • 熟悉3D或actionscript语言优先。
  • 对互联网产品有强烈兴趣并具有一定的商业灵敏度。富有创造力和激情。


chrome extension的content script 无法读取页面中的iframe内容的解决方法

chrome插件中的 content script 是运行在一个被称为isolated world 的运行环境里,和页面上的脚本互不干扰,因为不在一个运行环境里,所以也无法调用页面上脚本定义的方法了,当然google也给出了解决方法:http://code.google.com/chrome/extensions/content_scripts.html

除了这些以外,在最近写插件的过程中,发现content scirpt 也不能读取到页面中的 iframe 内的内容(同域),这个被人报告为BUG,也许会在以后的版本中解决。当然,你可以通过设置manifest 中的 all_frames = true,来让脚本在 iframe里也运行。不过更简单的方法是,载入外部脚本到页面。

chrome插件有权限更改页面的DOM(如果这都没权限,这个插件系统也就没什么用处了),所以我们只要往页面中插入script节点,引入自己写的脚本,这个脚本的运行环境就和页面中的脚本是同一个环境了,于是页面中脚本有权限做的事情,我们自己写的脚本也有权限做,当然这样做一定要把自己的脚本放在一个大的闭包中,以防和页面上的脚本冲突。这样插件中的脚本就相当于一个加载器,只用做在页面中加载自己写的脚本就可以了。

这样做还有一个好处是,我们可以轻松移植这样的插件到 firefox 下的 greasemonkey 的 user script 中,也可以轻松制作成 Bookmarklets,也就是可以很方便移植到各种浏览器下。 :)

Magic canvas & PNG

用 canvas 配合 PNG 可以做出什么好玩的东西呢?

昨天阿里中文站的方凳会,我为大家分享了这个主题。这是我第一次在方凳会上做大分享,也算迈出了这一步,以后会努力多在这个舞台上表现。

主要讲了运用 canvas 来做动态 favicon 和用 PNG 来打包字符串(js) 然后前端通过 js 对这个图片解码。

PPT 在 http://share.allenm.me/fd/ ,有兴趣的同学可以来看,我就不在这里重复一遍内容了。