2012-03-24

your regex brain

Perm URL with updates: http://xahlee.org/comp/your_regex_brain.html

your regex brain

Emacs Grep Command and Unix Shell Quote Escape Pain

calling emacs's grep command have always been painful. i want grep with this regex height="[0-9]+">.

When calling emacs's grep command, i tried:

grep -ie -nH 'height\=\"[0\-9]\+\">' *html

and many variations with the backslash in different places, double backslash, single/double quotes. No go.

also, never really figured out the differences or semantics of single/double quote of unix shell.

this is char escaping fucked up to umpteenth level!

sure, one day, i could sit down and really figure it out (AND TRY TO REMEMBER IT (as am sure i've done this before)), then, sit down and figure out how emacs pass string to shell, but usually after 5 min of failures with trial & error, i switch to a short perl/python/elisp script that gets my job done.

btw, in {Perl, Python, PHP}, it's all relative simple. In elisp, it's more complex, and more cumbersome. I think elisp regex char escape situation is still easier to understand than unix shell, but possibly only because i haven't been digging bash as i've with elisp.

Twitter Conversation Spam Farm

Current twitter spam technique: find conversations and spam the shit out of it.

twitter coversation spam ipaddep 2012-03-24
twitter coversation spam ipaddep

Right now, they are spamming at a rate at least 20 spam per 30 seconds. (estimate based on twitter's search and auto-refresh)

Who's a Professional Programer?

got a stupid comment at How To Send HTML Mail With PHP

Quote of the entire comment:

my error:
Warning: Unexpected character in input: '\' (ASCII=92) state=1 in /home/a9904100/public_html/register.php on line 89

line 89? My code is only 31 lines.

what possible programer idiot posts comment like this? I know! Majority of professional programers are like that. Professional programer means anyone who makes a living by coding. Unfortunately, to the tech geekers we see slaving in {emacs, perl, python, lisp, …} newsgroups and {hackernews, reddit/prog, slashdot, …} forums, they don't know this fact, and they sing their songs in their batcave about what emacs/software/language/interface should be. When you turn the mirror around, you can see that they, are just idiots of a different color.

2012-03-23

Emacs: New HTML5 Tag Set for Yasnippet

Here's yasnippet bundle for complete set html5 tags, and html5 tags only. (➲ HTML5 Tags) I've been using them for a year now. Download at Source code.google.com.

For svn users, you can do: svn checkout http://ergoemacs.googlecode.com/svn/trunk/packages/yasnippet-0.6.1c/snippets/text-mode/html-mode (thanks to John Kitchin)

If you enjoyed my work, a donation is much appreciated.

Question: Google Code supports {svn, mercury} too. I'd be interested to know what's the syntax to download a subdir. Thanks.

List of HTML Self-Closing Tags

Perm URL with updates: http://xahlee.org/js/html5_non-closing_tag.html

, 2012-03-23

This page is a list of HTML elements that does not have a closing tag. They are sometimes called {self-closing, empty, void, singleton} tag. Here's a complete list for HTML5:

<area />
<base />
<br />
<col />
<command />
<embed />
<hr />
<img />
<input />
<keygen />
<link />
<meta />
<param />
<source />
<track />
<wbr />

The space before the slash is optional.

Is the Ending Slash Optional?

  • HTML5: the slash is optional.
  • HTML4: the slash is technically invalid. However, it's accepted by W3C's HTML validator.
  • XHTML: The slash is REQUIRED.

I'd recommend to always add the slash. Because, it provides a visual clue of non-closing tags. It's also technically superior, because if you write scripts to check your HTML, you don't need a lookup table to check which tags doesn't need to be closed.

XHTML Supports Self-Closing Syntax for All Tags

In XML/XHTML, every tag can be self-closed by the ending slash <… />. When you test it, you have to make sure the server is sending the correct Internet media type as XHTML (e.g. application/xhtml+xml), otherwise browsers will treat it as HTML, regardless of the DOCTYPE in your file.

I do no recommend self-closing for normal tags.

References

Back to HTML5 Tags.

Working with HTML/CSS Colors in Emacs

Perm URL with updates: http://xahlee.org/emacs/emacs_CSS_colors.html

Am quite annoyed that the colors shown by list-colors-display is not compatible with CSS colors. In emacs, you can call list-colors-display. It'll display X11 color names with its hex values, with the text colored. Very convenient if you work with HTML/CSS. However, the color names is not compatible with the 16 basic CSS colors.

For example, in CSS, there's a color named “silver” with hex value #c0c0c0. But in emacs, there's no such name nor such value. Here's a list of CSS colors.

Basic CSS Colors
CSS NameCSS Value
White #FFFFFF
Silver ◇ #C0C0C0
Gray ◇ #808080
Black #000000
Red #FF0000
Maroon ◆ #800000
Yellow ◇ #FFFF00
Olive ◇ #808000
Lime ◇ #00FF00
Green ◆ #008000
Aqua ◇ #00FFFF
Teal ◇ #008080
Blue #0000FF
Navy #000080
Fuchsia ◇ #FF00FF
Purple ◆ #800080
Those with a “◇” means it's NOT in emacs's list-colors-display. Those with “◆” means it's got different value in emacs. (GNU Emacs 24.0.93.1)

Here's a quick workaround. Define abbrev so that you can just type CSS color names and it'll expand to the value. Here's the code:

("8white" "#ffffff" nil 0)
("8silver" "#c0c0c0" nil 0)
("8gray" "#808080" nil 0)
("8black" "#000000" nil 0)
("8red" "#ff0000" nil 0)
("8maroon" "#800000" nil 0)
("8yellow" "#ffff00" nil 0)
("8olive" "#808000" nil 0)
("8lime" "#00ff00" nil 0)
("8green" "#008000" nil 0)
("8aqua" "#00ffff" nil 0)
("8teal" "#008080" nil 0)
("8blue" "#0000ff" nil 0)
("8navy" "#000080" nil 0)
("8fuchsia" "#ff00ff" nil 0)
("8purple" "#800080" nil 0)

If you are not familiar with emacs abbrev feature, see: Using Emacs's Abbrev Mode for Abbreviation.

If you want the hex values colored in your HTML/CSS code, see: Emacs: Working with HTML/CSS/X11 Color Values.

2012-03-22

Computer Keyboard: Function Keys as Rubber Buttons

you know how some keyboard have button-style function keys? Look at this pic:

keyboard with button keys

Imagine typing on this keyboard. Here's another one:

bad function keys-2
Worst example of function keys. ① Continuous row, no group-gap. ② hard-to-press cheap buttons.
Kinesis keyboard function keys
Kinesis keyboard function keys. img src

Moral: don't buy keyboard that has the {F1, …, F12} keys in non-standard shape or form. The worst offender here is the Kinesis Contoured Keyboard.

Emacs Keys Summery: M-x, C-x, C-c

emacs keys are often confusing to beginners. Here's a summery.

  • Alt+x】 is to call a command by name.
  • Ctrl+‹letter›】 is for frequently used editing commands. e.g. cursor movement, Paste C-y, mark C-SPC, Cancel C-g, Search C-s, ….
  • Alt+‹letter›】 is for somewhat less frequently used operations, often complement to Ctrl. e.g. move by words {M-f, M-b}, Copy M-w, comment-dwim M-;, ….
  • Ctrl+x …】 is for commands that are useful globally. e.g. dired C-x d, “switch-buffer” C-x b, string-rectangle C-x r t, bookmark-bmenu-list C-x r l, ….
  • Ctrl+c …】 is for major-mode specific commands. e.g. in org-mode, C-c . inserts date.
  • Ctrl+h …】 is for help. e.g. describe-function C-h f, apropos-command C-h a, info C-h i.
  • Ctrl+Alt+…】 is for lisp coding related commands. e.g. backward-sexp <C-M-left>.

Note 【Alt+x】 is technically 【Meta+x】, ususually written as “M-x”. “Meta” is a physical key on lisp machine keyboards. If you are on a text terminal, and no Meta remapping has been setup, you can type 【Meta+x】 by pressing 【Esc x】.

The White Savior Industrial Complex

Recently, i've been thinking of a name for a phenomenon. I just found the proper term.

From Sachs to Kristof to Invisible Children to TED, the fastest growth industry in the US is the White Savior Industrial Complex.

The white savior supports brutal policies in the morning, founds charities in the afternoon, and receives awards in the evening.

The banality of evil transmutes into the banality of sentimentality. The world is nothing but a problem to be solved by enthusiasm.

This world exists simply to satisfy the needs--including, importantly, the sentimental needs--of white people and Oprah.

The White Savior Industrial Complex is not about justice. It is about having a big emotional experience that validates privilege.

Feverish worry over that awful African warlord. But close to 1.5 million Iraqis died from an American war of choice. Worry about that.

I deeply respect American sentimentality, the way one respects a wounded hippo. You must keep an eye on it, for you know it is deadly.

2012-03-20

Screen Density and Web Design Problems

Perm URL with updates: http://xahlee.org/js/web_design_screen_density.html

, 2012-03-20

Screen density is getting higher and higher. In the 1990s, CRT monitors from Apple Computers Inc is standardized at 72 ppi (pixels per inch), which became a de facto standard for desktop publishing (Apple started this field). But since ~2000, LCD replaced CRT, then came laptops, and now smart phones and tablets are more popular than desktop PCs. The iPad 3 has a density of 264 PPI. (See: iPad, iPhone, Kindle, Xoom: Pixel Dimension, Resolution, Density.)

This creates a problem for web designs. In html and CSS, there are 3 types of units for length:

  1. Physical: cm centimeter, mm millimeter, in (inch), pt (point = 1/72 inch), pc (pica = 12/72 inch)
  2. Pixel: px.
  3. Relative: % percent, ex (letter x of the font used of current element), em (current font height)

Physical unit is entirely useless. The problem with physical length such as centimeter is that usually the browser doesn't know the density of your display device. (i.e. it doesn't know how many pixels is a centimeter. Around ~2005, browser's preference pane lets you set it manually.) (has the situation improved today? i.e. are there some protocol or something that automatically sets the value?)

The more serious problem with physical length is that you don't really want to use it. Because, screen size varies. On big screen, you might want text be 1 cm in height. But on a hand-held tablet, you might want it to be just 0.2 cm.

The problem with pixels is that it's device dependent. On a desktop computer display, you might want text to be 20 pixels. But on a high-density tablet, 20 pixels needs a magnifying glass to see.

However, most web designers want exact layout. So, they just use pixels, and assume a particular display dimensions and density, based on what's most common. Around ~1998, it is 640×480. In ~2005, it's 800×600. Today, it's 1024×800. See: Web Design 2012: Minimal Windows Width of Popular Sites.

Due to the rise of high-density display starting with iPhone in ~2008 and now tablets, the web standard body seems to have retrofitted the meaning of px in CSS. It used to mean the pixel on your screen. Now, W3C seem to say that the pixel unit in CSS is meant to be a abstract pixel. (Question: was this “abstract pixel” meaning in the CSS 1 spec in the beginning?)

Here's a bunch of articles addressing issues related to screen density.

They are all giant hacks.

The bottom line of the problem is, that HTML is never designed for page layout. It is only meant to capture the meaning of content, mostly of the academic publications type. That is, you have Title, Chapter Header, Sections, Subsections, Paragraphs, Lists. But, most people actually need layout and exact appearance specification. The vast majority of web use is not academic papers. It's online stores, for-profit publishing, stocks, entertainment, random chats (online forums), and porn. So, font tag, tables, Spacer GIF, CSS, and all are hacked in, with various degrees of blessing by standard bodies or tech geekers.

Fuck Python. Hello Ruby

Background: coding perl in a day job 1998 to 2002. Learned python in ~2004. Hated perl for its unix drivel and Larry Wall snake oiling shit. (See: Larry Wall and Cults.) I thought python is antidote to perl's ways. It turns out, python is a cult of a different kind. But worse, it is actively anti functional programing. So, if your coding habit is FP, it's a pain in the ass in python. In fact, worse than Perl. Also, python doc is actually WORSE than perl in practice, despite that perl's is intentionally littered with drivels and obfuscations.

Been smelling ruby since the ~2008 Ruby On Rails shit. Heard great things about it from people i trust. But resisted learning it, because i don't plan to spend another few years to learn something that is really the same as perl and python. Plus, ruby didn't support unicode.

but now, since i love langs so much, i don't see reason not to. Latest Ruby support Unicode well now. Never learned much of Python anyway, other than writing some scripts for text processing my site. The precious time that's meant to be spent on something i really should such as OCaml, math proof systems (HOL, Coq) and practical JS/DOM, never really happened that much. And lately been reading more python doc, and am reminded what shit python is.

Ruby the lang, i knew for sure is better than perl and python. The question remains is whether its community is culty. I have a sense it's at least not as bad as perl/python. It's a lang from Japan….

Unicode Characters for Centimeter

Discovered special Unicode chars for Centimeter

  • = cm
  • = cm²
  • = cm³

Note: cm is used a lot in Taiwan, but not in USA. In USA, if metric length is used at all, it's more common to see millimeter (mm).

Is cm used in other Asian countries? (China, Hong Kong, Japan, South Asia, India, …) Also, what about Europe? cm or mm?

2 Articles on the Problems of EmacsWiki

Note: Emacswiki was great, it served its time, helped people tremendously, but now it might be good time to change, since lots has changed in past 7 years since it started.

If you feel the same, please send a kind notice to Alex. He might be convinced now. Also, Alex was kind enough to license the whole thing as open source. He has mentioned that he doesn't mind if people mirror or start another wiki. So, if you are ambitious, you can start a fresh one.

2012-03-19

Xah Emacs Tutorial News: Some Article Updates, and Thank You

In past months, Jon Snader (jcs) (irreal.org) has gone thru my elisp tutorial and corrected many errors and given me feedback. I really like to say a big thank you to Jon here. Thank you Jon.

Also, i have now and then received donations from people, with encouraging words. Recently got one from a professor from a well-known university. I really like to thank you guys. Some of you sent donation but i know that some are buried in my email that i have not replied. I just want to say here Thank You, whoever may be reading this. I will continue working on the emacs tutorial and ErgoEmacs as usual. Many elisp topics, such as emacs's font system, buffer/frame system, display system, i yet have to explore and write about. Thank you all for the support. And thank you for reading.

A Tale of Hackery: Keyboards with Numberic Keypad Sawed Off

Perm URL with updates: http://xahlee.org/kbd/keyboard_with_numpad_cutoff.html

Many programers find the numeric keypad annoying, because it forces the mouse to be placed far to the right, making the right arm traveling a big distance whenever switching between keyboard and mouse.

A friend was asking about keyboard without the number pad. After text messaging on Facebook to and pro in a day showing links to some such keyboard, then, next thing i knew, he saw'd off his keyboard!

Here's the pics:

sawed off keyboard 584
sawed off keyboard 585
sawed off keyboard 586
sawed off keyboard 587
sawed off keyboard 588

Thanks to David Rogoff for the pics and this tale of hackery.

but folks, DON'T DO THIS to Your Keyboard! A perfect Gaming Keyboard is now ruined. How do you feel if your keyboard wants to saw off your arm?

The number pad is actually quite useful if you are a programer.They provide 17 extra function keys. (See: Increase Productivity Using Function KeysWhy Dedicated keys are better than key combo) I use it heavily, especially in emacs. (for example, to open my bookmarks, i press 7 on numpad, instead of 【Ctrl+x r l】. (See: Emacs: How to Define Keyboard Shortcuts.)) I use AutoHotkey (and Microsoft IntelliType) to program the keys. (see: AutoHotkey TutorialMac OS X Keyboarding Tools.):

If you really want a keyboard without number pad, see: Keyboards Without Numberic Keypad.

Tip for Parallel Programing: Always Use Map When Possible

always use “map” whenever possible. Use loops (e.g. “for”, “while”, “do”) only if absolutely necessary (i.e. when you actually need to work on the items one by one in order.)

See: Guy Steele on Parallel Programing: Get rid of cons!

2012-03-18

Keyboards Without Number Pads

Perm URL with updates: http://xahlee.org/kbd/keyboard_no_numpad.html

Some collection of keyboard without numeric keypad. The list is ordered roughly starting with the best ones.

Filco Majestouch-2, Tenkeyless

Linear Key Action

Filco Ninja Majestouch-2 Tenkeyless NKR Linear Action Keyboard FKBN87ML EFB2
“Filco Ninja Majestouch-2 Tenkeyless NKR Linear Action”, Model: “FKBN87ML/EFB2”. amazon

Notice, the key labels are printed in front of the keys. Nice touch! This way, the key labels won't wear away (and they don't have to use other more expensive tech for key labeling such as laser-etching.)

This “linear action” means the keys are suitable for gaming. That is, no “click”, so you can press fire button rapidly. They use Cherry MX Black mechanical key switches. (See: Guide to Computer Keyboard Key Switch Mechanisms.)

This keyboard also features true N-key rollover. (meaning, you can press many keys simultaneously and it'll work correctly.) (See: Keyboard Ghosting & N-key Rollover: How Many Keys Your Keyboard Can Take?)

The company Filco is known among keyboard enthusiasts for its high quality keyboards.

For me, i must have split ergonomic keyboards. But if you don't mind straight keyboard, i highly recommend Filco.

Tactile/Click Key Action

Filco make several models, with different touch sensation and colors.

Filco Majestouch-2 Tenkeyless NKR Click Keyboard FKBN87MC/EMU2
“Filco Majestouch-2 Tenkeyless NKR Click Keyboard” (model FKBN87MC/EMU2) amazon

These are suitable for heavy typers.

  • “linear action” (Cherry MX Black), means smooth. No “click” sensation for key press.
  • “tactile action” (Cherry MX Brown), means there's a “click” sensation for key activation.
  • “click action” (Cherry MX Blue), is like tactile, but with audible click. Even more clicky.

(See: Guide to Computer Keyboard Key Switch Mechanisms.)

  • Color Black. (Cherry MX Black) (Model FKBN87ML/EFB2) amazon
  • Color Black. (Cherry MX Black) (model FKBN87ML/EB2) amazon
  • Color Metalic Pink. (Cherry MX Brown) (model FKBN87M/PWE2) amazon
  • Color White. (Cherry MX Brown) (model FKBN87M/EW2) amazon
  • Color Camouflage. (Cherry MX Blue) (model FKBN87MC/EMU2) amazon

Cooler Master

Cooler Master Storm QuickFire Rapid Keyboard SGK-4000-GKCL1-US
“Cooler Master Storm QuickFire Rapid Keyboard”. (model: SGK-4000-GKCL1-US) amazon

This is made by the company Cooler Master, another reputable company, known in gaming communities.

Features:

  • Cherry MX Blue keyswitch. (very clicky, audible)
  • laser-marked keycaps (so the key labels won't wear off)

One bad point about this one is that it has a FN key, instead of a normal Menu key. The problem with this is that you won't be able to customize that key, because FN key is usually hard-wired and your OS won't see it. See: Computer Keyboard: What Are F1 … F12 Keys Used For? Increase Productivity Using Function Keys.

Microsoft Sidewinder X6

MS Sidewinder x6 gaming keyboard
MS Sidewinder X6 gaming keyboard amazon

This is discontinued, because Microsoft is getting out of gaming keyboard/mouse business.

The cool thing about gaming keyboards is that you have many extra function keys, great for programing and emacs use. For this one, the 2 big wheel controls are nice too.

HP USB mini Keyboard

HP USB mini keyboard
HP USB mini keyboard amazon

A cheap rubber-dome keyboard. If you don't really care that much about keyboard, and all you wanted is a keyboard without that number pad, this is the one to get.

Happy Hacking, KCB Poker, Ducky, Apple

Here's some others. Some of these do not have function keys. Some are laptop-style shallow flat keys. If you are a programer or gamer, i do not recommend keyboard without dedicated function keys.

Google Plus Page Account: How to View a Post in Your Personal Account

if you are running g+ pages, often you see a interesting post and you want to comment/share, but you want to do that with your personal account, not your page account. How to do that?

Copy the URL, e.g.

https://plus.google.com/b/113859563190964307534/113666291948192249820/posts/dLAu3fiKbKv

remove the first sequence of digits, to get

https://plus.google.com/b/113666291948192249820/posts/dLAu3fiKbKv

Paste in a new tab. That's it.