english

I found a nice elisp to show line number.

wb-line-number

As you see on screenshot, it shows line number on left side of the emacs window. As usual .el files, download it into your elisp directory, and add some lines in your emacs.el file. I usually like to wrap line by window size. And here’s what I did on .el file.

(require 'wb-line-number)
(setq truncate-partial-width-windows nil)  ; wrap line by window size
(wb-line-number-toggle)

# EDIT: This bug will be fixed soon. See WebKit Bugzilla 19094. It’s fixed already on Nightly. If you do have a tweak for this bug, (such as me) you need to add another sniff like follows.

var webkit = indow.navigator.userAgent.match(/WebKit\/([0-9]{3})/);
if (webkit && parseInt(webkit[1]) < 528) {
...
}

---

Most of JavaScript library comes with a method that returns pixel position of the given element. For example, jQuery has jQuery.offset(), MochiKit has MochiKit.Style.getElementPosition(), MooTools has Element.getPosition(). They work well in most cases, but today i found the situation that doesn't work and that, I think, is a Safari's bug.

Before going into detail, here's the condition that pixel position getter method doesn't work.

1. The browser is Safari
2. The element you try to work on is TD (or display:table-cell)
3. It set vertical-align NOT as top (maybe middle or bottom)

Here I made examples for this case: Safaribug: wrong offsetTop on TD. When you click each table cell, it will return the pixel position of the clicked TD. Open the page with Safari and other browsers. There are differences.

How it happens? Let me introduce how JS lib calculate the pixel position of any given element. I found a nice code with comments on Google doctype project.

PageOffset: How to calculate the position of an element on the page (goog.style.getPageOffset)

It's really step-by-step good explain, you should go through with it. Here I extract how Safari runs the code:

function getPageOffset(el) {
    var pos = {
        x: 0,
        y: 0
    };
    var viewportElement = document;
    if (el == viewportElement) {
        return pos;
    }

    var parent = null;
    var box;

    pos.x = el.offsetLeft;
    pos.y = el.offsetTop;

    parent = el.offsetParent;
    if (parent != el) {
        while (parent) {
            pos.x += parent.offsetLeft;
            pos.y += parent.offsetTop;
            parent = parent.offsetParent;
        }
    }

    if (el.style.position == 'absolute') {
        pos.y -= doc.body.offsetTop;
    }

    parent = el.offsetParent;
    while (parent && parent != document.body) {
        pos.x -= parent.scrollLeft;
        parent = parent.offsetParent;
    }

    return pos;
};

The problem happens on the very first access to el.offsetTop on line 15. It should be 0, since it's a table cell and no padding/margin/border set, but it seems Safari returns the vertical offset to the descendant element on that property.

I don't come up with any smart way to solve it... so I just tweak it.. Please WebKit, fix this bug!!

Today I read an article on Presentation Zen: If you only had one minute to pitch your story and I see a very interesting approach by Tourism Queensland, Australia, in order to hire a new position called Caretaker of the Islands of the Great Barrier Reef. It really sounds like the best job in the world, right? Check out their web site: The Best Job In The World – Tourism Queenslan. If you wanna get a job there, you’ll make a one-minute video of yourself and post it on YouTube. They will pick up seats for final interview by themselves and there’s another one seat by audience popularity.

What’s interesting about is, as Presentation Zen mentions, such a great way to get people’s attention. And by using the external resource, YouTube for this time, the process is crystal clear to outside. I’m sure the job itself is not just hanging out on the beech job, it’s more like Survivor type of adventure maybe?

The site is a full-flash site, which usually doesn’t get my attention anymore, but it’s very well done. And it seems like developed by CumminsNitro.

I got Learning GNU Emacs, Third Edition. And here’s the summary I learned from Chapter 1.

Key Stroke	Command Name	Action
C-x C-f	find-file	Find file and read it into a new buffer.
C-x C-v	find-alternate-file	Read an alternate file, replacing the one you’ve done with C-x C-f
C-x i	insert-file	Insert file at point position.
M->	end-of-buffer	Move point to the end of the buffer; leave mark at previous position. By being followed by C-x i you can append file.
C-x C-s	save-buffer	Save buffer with the current buffer name.
C-x C-w	write-buffer	Emacs prompts you to set a new file name, and save it.
C-x C-c	save-buffers-kill-emacs	Exit Emacs with asking you if there are any un-saved buffer. But *scratch* is different. Even you’ve editted *scratch*, Emacs discard it silently.
C-h	help-command	Enter the online help.
C-h ?	help-for-help (or help-for-help-internal)	Display a list of available help command?
C-h f	describe-function	Display help for a given command.
C-h k	describe-key	Display help for a given key stroke.
C-h v	describe-variable	Display help for a given variable (a symbol).
C-h t	help-with-tutorial	Start Emacs tutorial.

dired

dired stands for DIRectory EDit. (Not sure how it’s pronounced.) It is very useful bundled application. When you do C-x C-f then just hit enter. You’ll see something like ls but with cursor on it. You can do a lot of stuff by this, but mainly, you’ll do open files, just choosing file with cursor, and hit enter. You can also delete by press d for marking. And then press x to execute it. I’m sure there’s a lot more to do, but that’s what I do so far.

If you’re a Mac person, and If you using Display ANSI colors on Terminal.app, and if you use black background theme, such as Pro, you hardly see color of Blue. You can try TerminalColoreopard. Yoshimasa Niwa made a SIBML extension for choosing ANSI color. This ANSI color setting can be only for for one user. Cannot be like theming, but I don’t change theme everyday, so that works fine for me.

js2-mode

In emacs, there are Major mode and Minor mode. Major mode work like a Perspective in Eclipse IDE. It gives certain kind of framework to work on a given issue. There are ecmascript-mode.el, javascript.el and js2.el. I use js2.el for now.

In order to make js2.el work, emacs needs to know which directory autoload search for. It’s like a path setting in your shell. How do you know which directories your emacs search for? Type C-h v load-path. It will return your emacs’ search path. I found a nice article about load-path on emacs wiki. I wanna load everything in ~/.emacs.d is represented as follows.

(progn (cd "~") (normal-top-level-add-to-load-path '(".emacs.d")))

And download js2.el, put it into my ~/.emacs.d/. Open js2.el, then do M-x byte-compile-file. You’ll get js2.elc, which is pre-compiled version. Then add following lines in .emacs.el

;; js2-mode
(autoload 'js2-mode "js2" nil t)
(add-to-list 'auto-mode-alist '("\\.js$" . js2-mode))

now whenever you open *.js, you’ll use Js2 Major mode.

ctags

Tag is not like delicious tag. It’s more like search index.

EmacsTags

I use exuberant ctags. Just compile and install (./configure ;; make;; sudo make install). And disable original ctags (sudo chmod a-x /usr/bin/ctags).

Outside of emacs, go to top directory of your source file. Try ctags -e --recurse --languages=javascript. Then you’ll get TAGS file in the same directory.

You can do
M-x visit-tags-table and choose TAGS file first. But if you don’t choose TAGS file and try to do tag jump by M-., you’ll be asked which file emacs should read anyway.

A few times, I mentioned on my blog here, “JavaScript: The Good Parts.” The author of the book, Douglas Crockford gave a talk at Google Campus on Feb 27, 2009. You can check it out on YouTube.

JavaScript: The Good Parts

The talk is very insightful. And it actually very much about what he wrote on the book. If you are interested in reading that book but haven’t got that yet, you may get at least half of his points by watching this Google TeckTalk. And also he is touching what the future of JavaScript will be. Strict mode will be interesting. And I guess it would boost the speed.

I pick up some of his points what I was interested in.

Continue reading

Auto save revisited

So I joined irc.freenode.net#emacs, and asked how to configure auto-save. Several nice people helped me out. Here’s my .emacs.el for backup and auto-save.

(setq make-backup-files t)       ; enable backup file
;;; locate where you backup files
(setq backup-directory-alist
      (cons (cons "\\.*$" (expand-file-name "~/.backup"))
            backup-directory-alist))

(setq version-control t)     ; enable versions of backup
(setq kept-new-versions 5)   ; how many keep new verisons
(setq kept-old-versions 5)   ; how many keep old versions
(setq delete-old-versions t) ; delete old version without asking
(setq vc-make-backup-files t) ; still make a backup for version-controled files                

;;; Autosave in .backup dir
(setq auto-save-file-name-transforms
  '(("\\([^/]*/\\)*\\([^/]*\\)\\'" "~/.backup/\\2" t)))

Originally, I was very confused by auto-save and backup. FIles of backup are named usually like FILE_NAME~ and autosave are like #FILE_NAME#. At this point, I’m not quite sure that auto-save-file-name-transforms will take, but that’s alright. What I wanted to d

Japanese (or other multibyte)

Me as a native Japanese speaker, I often times, use Japanese Characters, plus I learned Chinese these days, I may have chances to read and write in Chinese Characters as well. Here’s what I use now for Japanese language. They are all copied from some of XEmacs distribution package I guess. It’s still just a magic spells…

;; ============= Japanese language setting ======================                              

;; A. inline input method (window-system)
(when (eq window-system 'mac)
  (add-hook 'minibuffer-setup-hook 'mac-change-language-to-us)
  (mac-translate-from-yen-to-backslash) ;; yen => backslash
  (set-language-info "Japanese" 'input-method "MacOSX") ;; bad fix
  ;; input method in read-only buffer (e.g. C-s in dired-mode)
  (setq mac-pass-key-to-system-on-read-only-buffer t)
  )
;; A. end                                                                                      

;; B. language environment
(set-language-environment "Japanese")
(set-default-coding-systems 'utf-8-unix)
(set-keyboard-coding-system 'utf-8)
(set-clipboard-coding-system 'utf-8)
(set-terminal-coding-system 'utf-8)
;; (set-file-name-coding-system 'utf-8m) ; already set
(prefer-coding-system 'utf-8-unix)
;; B. end                                                                                      

;; C. fix: Unicode => Japanese mapping
;; Thanks to saiki-san (see [macemacsjp-users 870])
;; register circle around digits to cjk table (by Ando-san)
(defadvice utf-translate-cjk-load-tables
  (after my-ad-circled-digit activate)
  (dotimes (i 20)
    (let ((unicode (+ #x2460 i))
          (char (+ 54433 i)))
      (if (utf-translate-cjk-substitutable-p unicode)
          (puthash unicode char ucs-unicode-to-mule-cjk))
      (puthash char unicode ucs-mule-cjk-to-unicode))))
;; prevent to use half-width marks (by Nanba-san)
(utf-translate-cjk-set-unicode-range
 '((#x2e80 . #xd7a3)
   (#xff00 . #xffef)
   (#xa7 . #xa7)                        ;
   (#xb0 . #xb1)                        ;
   (#xb4 . #xb4)                        ;
   (#xb6 . #xb6)                        ;
   (#xd7 . #xd7)                        ;
   (#xf7 . #xf7)                        ;
   (#x370 . #x3ff)                      ; ギリシャ
   (#x400 . #x4ff)                      ; キリル
   (#x2000 . #x206f)                    ; 一般句読点
   (#x2103 . #x2103)                    ; ℃
   (#x212b . #x212b)                    ; Å
   (#x2190 . #x21ff)                    ; 矢印
   (#x2200 . #x22ff)                    ; 数学記号
   (#x2300 . #x23ff)                    ; 技術記号
   (#x2460 . #x2473)                    ; 円囲み数字
   (#x2500 . #x257f)                    ; 罫線
   (#x25a0 . #x25ff)                    ; 幾何学模様
   (#x2600 . #x26ff)                    ; その他の記号
   ))
;; C. end

Font for Terminal

And for terminal font, I really appreciate Droid Sans Mono. Droid Family is designed for Google’s Android.

Download the Android SDK

Unzip the archive, and you’ll find .ttf files under tools/lib/fonts/default/. what it’s cool about is, very readable with small font size, mono space and comes with CJK typeface as well. License-wise, maybe ok for your personal use, you can at least develop Android with this. Small note: Android SDK comes with Android.el as well.

As my tradition, I moved, and I changed a title of my blog. It was called “Ten Eyck,” but now it’s called “Vantage Point of Queens.” Go visit my flickr page, you’ll see some of my house warming pictures.

So, I desperately try again on Scheme, Emacs and SICP. This time, I have a Kindle to read on, a friend working with me (again). I have experienced more than ever… Well let’s see what’s going on.

As a first time (and I wish this will keep going on), I will start with writing about how to configure emacs. Although there are tons of XEmacs implementation on Mac OS X, I run emacs on Terminal.app. I guess it’s because… (1) one of the fundamental reason to use emacs is because you can use on almost any platform. And if I just use one of those “OS X Specialized” emacs, then I will not remember how to configure. I don’t wanna miss anything. (2) Terminal.app can do “Alt as Meta” natively. (3) Apple keeps evolving Termianl.app. It has great transparent setting, multi-byte char enable, UTF-8 clear and a lot more.

But I digress. In order to configure emacs, you edit .emacs.el file. It usually stay on your home directory. Since it’s already 21st century and the cloud computing is really coming, why don’t I put on the cloud? I setup Dropbox account, and I mkdir-ed ~/Dropbox/config/emacs. I mv-ed .emacs.el and .emacs.d into there and make a symbolic link to them. It works great.

no welcome message

(setq inhibit-startup-message t)

By having this line in your .emacs.el, you don’t see welcome message anymore. That also indicates that your change is applied to your emacs.

aggregate all backup craps

(setq make-backup-files t)
(setq backup-directory-alist
  (cons (cons "\\.*$" (expand-file-name "~/.backup"))
    backup-directory-alist))

You have to mkdir for this before relaunch emacs. Hmm… I don’t see this working. I may try it later again.

This entry is a note from “JavaScript: The Good Parts” on page 106, Appendix A: Awful Parts.

Falsy Values

In JavaScript, following values are considered as “false” when they come to conditional expression.

Type	Value
number	0
number	NaN
string	""(empty string)
boolean	false
Object	null
undefined	undefined

You must have understood them already, but it’s good to have it organized.

In most of languages, String and Array is very similar. I mean, both instances have a length property for nature and you can access stored values by their own indexes. So I was wondering, if an empty string is falsy, why not an empty array is? No, an empty array is not falsy. I guess its because an array is acutally an object. Try typeof operator with one.

Here, I tried to evaluate an array with JavaScript’s nature, duck typing, but well, it doesn’t work as I imagined.

var a = [];
console.log( a ? 'true' : 'false'); //of course, true;

console.log( (String.prototype.constructor.apply(a)) ? 'true' : 'false'); //Oh? false... so..?

var b = ['b'];
console.log( (String.prototype.constructor.apply(b)) ? 'true' : 'false'); //still false...

Any value, even if it’s a string type of a String wrapper object, passed to string constructor makes an empty string.

String.prototype.constructor(['a']);

will do more as what you can imagine. String.prototype.constructor will run .valueOf() on the argument.

I’ve read “JavaScript: The Good Parts” a few times already, since it’s a thin but dense book. This book is somehow basic, but full of discerning. I should have do an Advent Calendar-ish thing if I could start this earlier.. But anyway, I will keep writing a bit about what I learned from this book for a while.

So the first thing, is a string comparison, on Chap. 2, page 10.

Following expressions both return true!

('cat' == 'c' + 'a' + 't') // true
('cat' === 'c' + 'a' + 't') // true

Before I read this, I originally thought JavaScript might compare the instance-base equality. I mean if the string instances on both side on the equal sign were pointing to the exactly same memory address, it would return true, but it is actually comparing its value.

var s1 = s2 = 'foo';
var s3 = 'foo';
s1 == s2; // true
s1 == s3; // still true, of course.

So, if you wanna do instance base equality, do as follows:

var s4 = new String('foo');
var s5 = new String('foo');
s4 == s5 //false

But as it’s mentioned in the book (and I strongly agreed!), wrapper objects (String, Number and Boolean) are just seeds of confusion. I don’t also see the neccessity of using them.

By the way, I thought that instance-base comaprison is more popular rather than value-base comparison. But as far as I just tested, Java (1.5.0_16 on Intel Mac) compares value, PHP compares value.. that’s intereting.