Home > Tags > english
english
Pseudo 3D by canvas2D
- 2009-08-20 (Thu)
- JavaScript
Today, I had a Hack-a-thon day at my work. Basically, no meeting, just do whatever you wanna do. It should be related to the work, but it doesn’t have to (am I right?). So I have been thinking that I wanted work on something 3D by using canvas and my Meetup.Tweener. I read lots of articles (which I have done before as well..), and gosh, I forgot so much about matrix transformation. But anyway, let me show you what I did. It’s only half done but it’s still sort of interesting how much you can do with canvas.
Click on picture, it will flip around.
This is even worse than CSS transformation because it only works for x-axis scaling as opposed to, CSS transformation, you can do 3d, at least more 3D-ish, flipping animation. BUT ANYWAY, this just fire on my heart to learn 3D again.
- Comments: 0
- Trackbacks: 0
Where’s 1password, Safari4?
Are you excited to get a new iPhone 3GS? I dunno.. But I got excited because Safari 4 is already pushed out to the world..! Not sure it’s good yet, but it has HTML5 thing, it has CSS-animation thing, lots of features of futures.
But well, if you wanna use Safari, you need a 1password! The following procedure still works with Safari 4. Only difference is that since Safari 4 comes as build 5530.17, you need to set MaxBundleVersion as 5531 or something.
CrunchGear: Want to enable 1password in the Safari 4 Beta? Here’s how.
So far it works well with me too!
P.S.
I just tweeted that 1password doesn’t work on Safari 4, then I got a message from 1password..!
@beatak Grab my latest beta for Safari 4 compatibility: Preferences > Updates > enable betas > Check Now.
I’ll try that too. Pretty cool!
- Comments: 0
- Trackbacks: 0
Google Page Speed and Google’s JavaScript
- 2009-06-07 (Sun)
- JavaScript | Tech
Google recently introduced a Firebug extension, called Google Page Speed. Simply, it’s a Google version of YSlow. I heard the author of YSlow, Steve Souders moved to Google, so I thought it’s a bit awkward corporate feeling but he himself said that he is not involved with this project. But even so, Yahoo has a hard time anyway.
As other Google’s products, Google Page Speed is also open source project, hosted on Google Code. So I was curious to browse their code. I don’t really read anything but JavaScript, and I found very familiar code on their internal library: /src/js/closure/base.js.
Do you remember when I talked about Google’s bad contamination on google_service.js before?
The problem is fixed now but you can find very identical code to the code I quoted on the post (well, it’s obfuscated, but you can imagine). I have strong feeling that the one I accused, “google_service.js” contains the google closure, or maybe it was just a google closure.
And I also found a project named Google Closure. It’s empty so far, and its founder is… ExplorerCanvas guy!
I originally had a very difficult feeling about so-called Google Closure, because it potentially breaks lots of other library as I stated on the post. But if it’s open sourced and I will definitely be more interested in. What it does so far is very… engineering smart. Somethng you must need on JavaScript. It comes with lots of lots of comments, and its abstraction level is very clear. Maybe I should do drill down series of blog post about it?
- Comments: 0
- Trackbacks: 0
Objectified
- 2009-05-26 (Tue)
- Life
I watched Objectified today at IFC with Lia.
Lots of interviewees are English, or at least Queen’s English speakers. That makes me a little hard to listen to.. But anyway, Jonathan Ive’s saying “That’s obsessive, right?” Right. People, who got involved with design, need to be obsessive.
I have to say, there are several differences between software development and product development, but one thing I’m sure in common, is there are lots of not fully considered design decision everywhere (in face not at all). Very inspiring, and resetting my own original goal experience.
Whatever you do, if you think, you’re creative, you can find something in it. At the bottom, you’re only loose $10+ and 1h+. Go to IFC tomorrow, if you’re in NYC.
- Comments: 0
- Trackbacks: 0
Timer Performance in Browsers
- 2009-04-30 (Thu)
- JavaScript | Tech
courtesy of Telstar Logistics / Todd Lappin
After finishing Meetup.Tweener, I started to do lots of animation by JavaScript. In JavaScript, all animation happens by built-in timer. You can call either window.setTimeout or window.setInterval. So it’s all about how accurate the timer is fired, if you want to do precise animation.
I guess I have read somewhere before, but I just made up tiny JavaScript page here.
Timer Check @ archive.nydd.org
My observation:
- Firefox 3 is not that accurate. The interval tends to be much more wobbling than others. My Firefox is significantly slow.. Maybe because theme (Gray Modern 2), Firebug or something else.
- Safari is not bad. Sometimes, it does GC? it takes 10 times more than usual. But mostly, the performance is constant.
- Google Chrome is supreme. It has the best accuracy. If I cut counter update, I guess it can do much more.
- IE 6 is actually very good too. It never hits less than certain point, but the interval is very steady.
- Opera is also not too bad too. I don’t understand why, but it sometimes hits double time, very periodically.
- IE7, IE8, I will take a look at it soon.
Try the page! Questions and comments are all welcomed, And let me know if you find something interesting.
- Comments: 0
- Trackbacks: 0
Dear Google: Stop contaminating Standard Global Objects in JavaScript
- 2009-04-29 (Wed)
- JavaScript | Tech
So, I was at work in this morning, tried to start to work on the task I’ve been working on a while. I looked up my task note (wiki) and run some code (on browser, naturally, I’m a JavaScript geek), then I realized that it stopped because of unfamiliar errors. Wait. It was working last night. Then I ran some debuggers, then I found weird functions on each function. I asked people on the internal IRC channel. And I figured this:
http://partner.googleadservices.com/gampad/google_service.js
Let me just quote its high light here:
if (t.MODIFY_FUNCTION_PROTOTYPES = f) {
Function.prototype.bind = function(a) {
if (arguments.length > 1) {
var b = Array.prototype.slice.call(arguments, 1);
b.unshift(this, a);
return t.bind.apply(c, b)
} else return t.bind(this, a)
};
Function.prototype.partial = function() {
var a = Array.prototype.slice.call(arguments);
a.unshift(this, c);
return t.bind.apply(c, a)
};
Function.prototype.inherits = function(a) {
t.inherits(this, a)
};
Function.prototype.mixin = function(a) {
t.mixin(this.prototype, a)
}
};
It looks even different from what I saw at the office, actually. but I believe it’s the very same result since variable f is actually assigned for “true” in the very beginning.
And I googled a while and found this:
Question: google_service.js conflicts with prototype.js
Good job jimthoburn! Google usually doesn’t listen to outside voice.
I really hope that Google will stop doing this very very soon. I mean like tomorrow. It’s not only about Prototype.js, in face I don’t use Prototype.js at work. But IT IS REALLY BAD practice to contaminate Standard Global Objects in JavaScript. Please please do not do this.
- Comments: 0
- Trackbacks: 0
Meetup.Tweener (0.5.1)
- 2009-04-14 (Tue)
- JavaScript | Tech
Not really announcing yet, but I started a repository Meetup.Tweener on Github. Check it out, if you’re interested in. I will write more samples soon. Comments are all written in NaturalDocs compatible style in its source code. Once I finish styling for it, I will include that in the repository, which, I wish, will happen soon…
- Comments: 0
- Trackbacks: 0
Emacs Again (7): Using Emacs…
Now I really started to use Emacs as a daily life. Well, I only use it at home at this point, but I actually am getting used to it slowly but surely. Here’s the list of commands I most frequently use. By using search and tag jump, Emacs makes me so happy. The code completion runs a bit weird right now. I will try to figure out and will share with you.
Key Stroke |
Command Name |
Action |
|---|---|---|
C-s |
isearch-forward |
Do incremental Search forward. After typing some, it gets modal. You should see C-h k RET C-s to what you can do. |
C-r |
isearch-backward |
Do incremental search backward. |
M-g g |
goto-line |
Go to line. |
C-x k |
kill-buffer |
It’s equivalent to “close” of usual editors. |
M-. |
find-tag |
Find tag (in current tags table) whose name contains TAGNAME. |
|
tags-apropos |
Display list of all tags in tags table REGEXP matches. |
C-x o |
other-window |
Select next window on the frame |
C-x b |
switch-to-buffer |
Select buffer BUFFER in the current window |
C-x C-b |
list-buffers |
Display a list of names of existing buffers. |
- Comments: 0
- Trackbacks: 0
jsgrep (Mac OS X only!)
After Mac OS X 10.4, Mac has Spotlight, which is automatic metadata indexing for your data. By using its metadata, you can do grep, but only for JavaScript files. The command called mdfind (Meta Data FIND) does the job for you. I wrote a shell script, not to remember all the tedious options.
#!/bin/sh /usr/bin/mdfind "kMDItemContentTypeTree == 'public.source-code' && kMDItemFSName == '*.js' && kMDItemTextContent == '$1'"
It’s just verbose, but easy to understand, right? So, what if you want to do the same thing for… Ruby? Just find a ruby script you’re using, or make “test.rb” on your home directory. do “mdls test.rb”, which will probably give you something like follows:
% mdls test.rb
kMDItemContentCreationDate = 2009-04-XX XX:XX:XX -XXXX
kMDItemContentModificationDate = 2009-04-XX XX:XX:XX -XXXX
kMDItemContentType = "public.ruby-script"
kMDItemContentTypeTree = (
"public.ruby-script",
"public.shell-script",
"public.script",
"public.source-code",
"public.plain-text",
"public.text",
"public.data",
"public.item",
"public.content"
)
kMDItemDisplayName = "test.rb"
kMDItemFSContentChangeDate = 2009-04-XX XX:XX:XX -XXXX
kMDItemFSCreationDate = 2009-04-XX XX:XX:XX -XXXX
kMDItemFSCreatorCode = ""
kMDItemFSFinderFlags = 0
kMDItemFSHasCustomIcon = 0
kMDItemFSInvisible = 0
kMDItemFSIsExtensionHidden = 0
kMDItemFSIsStationery = 0
kMDItemFSLabel = 0
kMDItemFSName = "test.rb"
kMDItemFSNodeCount = 0
kMDItemFSOwnerGroupID = 20
kMDItemFSOwnerUserID = 501
kMDItemFSSize = 13
kMDItemFSTypeCode = ""
kMDItemKind = "Ruby Source File"
kMDItemLastUsedDate = 2009-04-XX XX:XX:XX -XXXX
kMDItemUsedDates = (
2009-04-XX XX:XX:XX -XXXX
)
So it should be like…
mdfind "kMDItemContentTypeTree == 'public.ruby-script' && kMDItemFSName == '*.rb' && kMDItemTextContent == 'SEARCH_QUERY'"
mdfind gives you many advantages of metadata search. You should definitely give a shot.
- Comments: 0
- Trackbacks: 0
Emacs Again (6): Learning GNU Emacs Chap 2
Here’s a list of commands I learned from Learning GNU Emacs, Third Edition Chapter 2.
Chpater 2 — Editing
Key Stroke |
Command Name |
Action |
|---|---|---|
C-x |
Control-X-prefix |
Try C-h v and type ctl-x-map |
M-x |
execute-extended-command |
Run a function by name. Try C-h f for each specific function name and what it does. |
C-f |
forward-char |
Move point one character right |
C-b |
backward-char |
Move point one characer left |
C-p |
previous-line |
Move point vertically up |
C-n |
next-line |
Move point vertically down |
M-f |
forward-word |
Move point forward by a word |
M-b |
backward-word |
Move point backward by a word |
C-a |
move-beginning-of-line |
Move point to beginning of current line as displayed |
C-e |
move-end-of-line |
Move point to end of current line as displayed |
M-a |
backward-sentence |
Move point backward to start of sentence |
M-e |
forward-sentence |
Move point forward to next "sentence-end". (The variable "sentence-end" is a regular expression) |
M-} |
forward-paragraph |
Move point forward to end of paragraph |
M-{ |
backward-paragraph |
Move point backward to start of paragraph |
C-x ] |
forward-page |
Move pointforward to page boundary |
C-x [ |
backward-page |
Move point backward to page boundary |
C-q |
quoted-insert |
Read next input character and insert it. This is useful for inserting control characters. For example, if you want to insert \?, you'll type C-q DEL |
C-v |
scroll-up |
Scroll text of current window upward |
M-v |
scroll-down |
Scroll text of current window down |
M-> |
end-of-buffer |
Move point to the end of the buffer; leave mark at previous position. |
M-< |
beginning-of-buffer |
Move point to the beginning of the buffer; leave mark at previous position. |
M-g M-g |
goto-line |
Goto line ARG, counting from line 1 at beginning of buffer. |
|
goto-char |
Set point to POSITION, a number or marker. |
M-(number) |
digit-argument |
Repeat following command (number) times. For example: M-3 C-f will move point 3 characters forward. |
C-u |
universal-argument |
Begin a numeric argument for the following command. For example: C-u 9 C-q DEL will insert nine \? at point, C-u 3 C-f will move point 3 chars forward. |
C-l |
recenter |
Center point in window and redisplay frame. |
C-d |
delete-char |
Delete the following character. Defaultly assigned on delete button |
M-d |
kill-word |
Kill characters forward until encountering the end of a word. |
M-DEL |
backward-kill-word |
Kill characters backward until encountering the beginning of a word |
C-k |
kill-line |
Kill the rest of the current line; if no nonblanks there, kill thru newline. |
C-y |
yank |
Reinsert ("paste") the last stretch of killed text. |
C-SPC or C-@ |
set-mark-command |
Set the mark where point is, or jump to the mark. |
C-x C-x |
exchange-point-and-mark |
Put the mark where point is now, and point where the mark is now |
M-h |
mark-paragraph |
Put point at beginning of this paragraph, mark at end |
C-x h |
mark-whole-buffer |
Put point at beginning and mark at end of buffer |
C-x C-p |
mark-page |
Put mark at end of page, point at beginning |
M-y |
yank-pop |
After C-y, Rotate Kill Ring. Let's say, you have ['latest', '2nd', '3rd'] as Kill Ring. When you do C-y, Emacs inserts latest at point. Then M-y will change latest to 2nd, and type M-y again, 2nd will be 3rd. M-y again, 3rd will be back to latest. |
C-t |
transpose-chars |
Interchange characters around point, moving forward one character |
M-t |
transpose-words |
Interchange words around point, leaving point at end of them |
C-x C-t |
transpose-lines |
Exchange current line and previous line, leaving point after both |
C-g |
keyboard-quit |
Signal a quit condition. |
C-x u |
advertised-undo |
Undo some previous changes |
Notes
Like other editors in Mac/Windows or even in vi… You know, when you start to select characters, background and foreground colors are inverted. In order to visualize where you are selecting (in Emacs way, it should say… make a region by using set-mark command), you have to add the following line in your .emacs.el. I just wonder why this is not default configuration… Anyway.
(setq-default transient-mark-mode t)
I’ve started my unix career with vi, like 1997? Even the first information technology class in my college taught me to use emacs, I liked vi better because, in that class, I think we have around 100 ~ 200 students one class, and all of them were connecting to “Clay Super Computer” with a few giga-bytes of memory space… It was just insane, to use a “memory sucker Emacs” with that terminal.
So, I still, when I did something wrong on editor, I type ESC! ESC! ESC!.. but instead, I should start to do C-g! C-g! C-g!!
Clipboard-Pasetboard interoperability/synchronization doesn’t work in my environment, Mac OS X 10.5 with Terminal Emacs 22.1.
Changing capital, Overwrite and Customization doesn’t seem to be important to me so I skipped it for now.
- Comments: 0
- Trackbacks: 0
Home > Tags > english
- Search
- Feeds
- Meta
- Links
- Ads!
-




