Pymaster

之前一直在猶豫到底要不要把 blog 搬移到 Logdown 來的主因是 - 現有的 theme 跟它們搭的 code highlight 樣式實在是太詭異了…

不是說 theme 本身不好，但我個人觀感上覺得除了預設 theme 的 highlight 搭得不錯之外，其它的風格都略顯詭異。

總之，如果要搬移到 Logdown 來，前提就是我要想辦法修改一點點 theme，這邊就來分享一下如何套用你喜歡的 code highlight 樣式。

Rouge (Pygments)

Logdown 所採用的 syntax highlighter 應該是 Rouge。

Rouge is a pure-ruby syntax highlighter. It can highlight over 60 languages, and output HTML or ANSI 256-color text. Its HTML output is compatible with stylesheets designed for pygments.

由於是 Pygments-compatible HTML output，因此我們可以去找現有 Pygments 的 theme CSS 來套用。

Theme

馬上找到了我想用的 Tomorrow theme 系列 https://github.com/MozMorris/tomorrow-pygments

產生新的 code highlight CSS

下面列出兩種方法，一種是自己來 generate CSS，另一種是直接抓別人 generate 的來改。

http://goo.gl/BbPJMr

This commit disables promise unwrapping and adds $parseProvider.unwrapPromises() getter/setter api that allows developers to turn the feature back on if needed.

從開始寫 Angular.js 就知道這項讓 template 與 promise 深深結合的功能，實際在 project 中使用的時候還真的是意外的相當… 用也不是不用也不是

在 1.2.0-rc3 終於被改成 opt-in 了… 預設是關閉，想要啟用的話可以

.config(['$parseProvider', function ($parseProvider) {
  $parseProvider.unwrapPromise(true);
}]);

ui-router 是 angular-ui 旗下一員大將，其 github README 介紹的主要特色如下：

1. 使用 state 取代 angular 原生的 route
2. 可巢狀的 state 與 <ui-view> (view template directive)
3. 支援多個 <ui-view>，可以給定名稱作為 reference 依據

特別點出來的原因在於今天要講的都不是這些，而是我打從一開始看到 ui-router 就想要使用它的真正原因

既不是巢狀 view ，也不是它的 state，而是 state 衍生出的 UI as route 能力。

今天碰到結果因為神秘的 cross-domain 引用的 script error 沒有跳在 console 而卡了超久…

$exceptionHandler 的官方文件介紹：

Any uncaught exception in angular expressions is delegated to this service. The default implementation simply delegates to $log.error which logs it into the browser console.

在 v1.1.5 的 AngularJS source code 如下：

function $ExceptionHandlerProvider() {
  this.$get = ['$log', function($log) {
    return function(exception, cause) {
      $log.error.apply($log, arguments);
    };
  }];
}

比如說今天針對 angular uncaught exception 我們想要做一些額外的 log，那麼就必須 override 預設的 $exceptionHandler，在隨意寫了一個 override 用的 service 之後你很可能會碰壁…

angular.module('myApp')
.factory('$exceptionHandler', function ($timeout, $log) {
  return function(exception, cause) {
    var args = Array.prototype.slice.call(arguments);
    // delay $log.error by 100ms
    $timeout(function () {
      $log.error.apply($log, args);
    }, 100);
  };
});

錯誤訊息：

Circular dependency found: DepA <- DepB <- DepC

於因出在於其實有部分 AngularJS 原生的 service 都有 inject $exceptionHandler，所以這些 service 是不能再被 inject 到新生的 $exceptionHandler 中的，否則就會造成所謂的 circular dependancy (循環 dependancy?)

不能 inject 到 override 用的 $exceptionHandler 的原生 service 表列如下：

• $rootScope
• $timeout
• $compile
• $interpolate
• $q

另外就是 試圖 inject 其它 module 的 service 進 $exceptionHandler 時候，那些 service 也不能夠包含以上的原生 service dependancy。

http://blog.coderstats.net/todomvc-complexity/

An article comparing 17 different JavaScript based implementations of a simple Todo list app using the code complexity metrics: lines of code, cyclomatic complexity, Halstead measures and Maintainability Index.