Monday, November 23, 2009

Syntax Highlighting

notesI posted a blog on code syntax hilighting last year. I have tried to add syntax hilighting for my codes in my blogs since then. The color settings are based on css styles embeded in my Blogger's html settings. The css classes I used are based on ASP.NET forum editor page settings. The problem I have is that the classes are very limited. They are limited to C#, HTML and SQL codes. It is very hard to expand my css classes to cover a wide range of codes.

Later on, I changed my code syntax hilighting strategy from HTML class to direct style settings. The advantage I can easily use other editor's syntax color schema to my blog codes. VIM is a great editor I can use. The following are major steps I use.

Use VIM to Edit Source Codes

First I use VIM to edit as a tool for codes. VIM supports a wide range of languages. For some new languages, if I don't have syntax vim files, there must be some syntax vims available on web. For example, I got and installed Microsoft PowerShell script ps1.vim.

In addition to VIM's syntax lighliting feature, I also use VIM's colour scheme. I have put some of my favourite colour scheme files in my /.vim/colors folder. The following is current colour scheme files:

[Home] .vim $ ls colors
fog.vim  spring.vim torte.vim

This Google code project, VIM Color Scheme Test, contains hundreds of colour scheme files. I got my colour files from this site.

To change different color scheme in VIM, just type command

:colorscheme ...

or tab through different colours.

Convert to HTML

To covert colourful codes to html, you can use the command


This command will open another window on top with html codes. Note: by default, my VIM has line number displayed. It is very convenient to locate codes. However, it is not good to convert line number to html as well. Normally I disable line number first:

:set nonumber

Here is an example of my VIM:

In the top window, it contains complete html codes as a HTML page. What I need is just a part of my codes starting from <font> to </font>

Clean up HTML Codes

Use the following commands to clean up codes:


This command search for new lines globally and replace them with empty, that is removing all the new lines. Note to replace something with line breaks, the command is


Removing all the extra new lines is needed for Bloger content.

Finally, add a div tag around the html codes (<div class="outlinebox4wrappercodes">):

Copy and paste these html codes to my blog. Job is done!

Note: if you use colour scheme in VIM, you may need to copy the background colour from html <body bgcolor="..."> and paste it next to div like <span style="background-color:...;" >


The limitation of this strategy is not easy to manage or maintain blog codes, especially when I need to correct, delete or add a long section of codes. Normally, I would use VIM as my editor fro my source codes, and repeat these steps again if any changes are needed.

The advantage of this method is that there is no any dependency on css classes. All the syntax settings are done directly by using html font tag with colour settings. To manage classes in Blogger's header to cover various languages is very difficult. Any change to the classes may break previous blogs.


Saturday, November 21, 2009

VIM Syntax Settings

Recently I started to learn and working on Windows PowerShell scripts. PowerGUI is a nice tool as script IDE or editor. However, when I wanted to write a blog on PowerShell with some example script codes, I have to use VIM or MacVim to convert codes to HTML. By default, my VIM does not have syntax vim file for PowerShell, since it is a new script language. Then I searched for the ps1.vim on web. It does not take much time to find out one at's syntax library.

This is first time for me to add syntax file to VIM. It was challenge for me and I took about 2 hours in last evening to figure it out. VIM is an excellent editor for programmers. It provides configuration settings for adding syntax files. Basically, the settings are in two different areas. The first one is to add syntax file to a specified directory. Most cases, syntax files can be found on web by many VIM fans and gurus. I don't need to write one even there are detail information about writing syntax files. Taking PowerShell script as example, the syntax file should be ps1.vim.

Add Syntax File

In case of my Mac OS(UNIX system), there are two places I can place the file. One is for all users and another one is a login user. All the syntax files come with VIM are installed in my Mac at /usr/share/vim/vim72/syntax/ folder. I found this location by using the following command in Terminal:

[Home] $ find / -name "html.vim" -print

Since I have never added any syntax file by myself before, there is no syntax files specific for my login name. I have to create the following folder for my syntax files.

[Home] $ mdkdir ~/.vim/syntax
[Home] $ cp ~/Downloads/ps1.vim ~/.vim/syntax/ps1.vim

After that, I thought I should be able to test a ps1 file in VIM with syntax colors. I did not see any syntax colour when I opened a test file: test.ps1. It took a while to figure out a way to manually load or test the syntax file by using the command in vim:

:source ~/.vim/syntax/ps1.vim

The loading process was failed because there are some syntax errors in the ps1.vim file. I think that actually is the line break problems when I downloaded the file from web: some line breaks are actually ^M chars. Then I found another updated ps1.vim from tomsr. I copied the source codes from web page and replaced ps1.vim's whole content. After that, the loading process was OK.

NOTE on September 16, 2010: for Windows XP, the vim.ps1 from VIM syntax library is OK. I have to copy this file to my VIM\vimfiles\syntax folder.

Define File Types

Still I could not see syntax colour. This is because VIM requires another setting to define file types. This second setting is called as *new-filetype*. I choose C option to define my new file type. I copied the following codes to a file at ~/.vim/filetype.vim:

if exists("did_load_filetypes")
augroup filetypedetect
  au! BufRead,BufNewFile *.ps1    setfiletype ps1
augroup END

Then I restarted my VIM. Finally I can see my test.ps1 file in VIM with syntax colours.

NOTE on September 16, 2010: for Windows XP, the file filetype.vim should be copied to VIM\vimfiles.


Thursday, November 19, 2009

Google Chrome OS

Today Google announced its Chrome OS progress. Goole revealed more detail information and early stage of the Chrome OS. I watched some video shows and it is a new way to explore the usage of web. For sure its new structure opens a different view of OS. It is new but it is a result based on the development of computer hardware and software, as well as the development of Web in the past 10 years.

More shows are available at Google Chrome Themes.

I really like its way to explore OS for net-book. OS is based on web browser and web applications to provide applications for end users. That's not new. The only problem is that it is heavily depended on Web or Cloud servers. In case of none-web available cases, it would be useless. That's why Google come out Chrome OS. It provides OS level APIs and storage (solid-base HD) with off-line features, just like OS still live. As many critics recall this light-weighted OS is not new thing. Early in 21st century, Sun Microsystems tried to provide Java based NC (network computers). I remembered that I attended a tech talk in Calgary by Sun, talking on JENI Project based computer terminals. The speaker said that NC should be like a telephone device, which is very cheap and can be placed anywhere. It is a network based computer systems. I was expecting the new change happening and it looks like a failure.

However, I think Chrome OS will be very different. It will be great challenge for Microsoft and Windows. For Apple, it is a challenge as well, but I think Apple has better position to move its OS forward. I believe that UNIX based OS has great future since it is based on solid and proven computer concept. 2010 will be very interesting year to see new OS and net-book hardware appearing. Chrome OS will have great impact in all areas and out daily lives.


Wednesday, November 11, 2009

Go: New Open Source Language from Google

Last night I read a news from CNET news about a new language as an experiment and promising language targeting today's computer trend with multi-processors: Google hopes to remake programming with Go. Then I went to Google Go language site: I watched two shows there. One is an introduction about Go, last about one hour, and another promotion show in about 2 minutes. Here is the introduction show on YouTube:

Show link: The Go Programming Language

It is very impressive. I really like it even I did understand all the codes in their new syntax. The codes look very similar as C/C++ and some like C# or Java, however, many new features are introduced to Go. The team behind Go is a group of very talent people who were the original creator of UNIX and Chrome's Javascript and compiler. As it is mentioned at Go's web page: Go is ...simple,,, ...concurrent,, and source.

I am very impressed with its compiler result, 13k lines of codes compiled within 209 nanoseconds and whole math and other calculation libraries compiled in about 9 seconds. The current version is only available for Linux and Mac OS.

It looks that Go will have great feature. Comparing to the current computer languages, Go's great performance will be very attractive to programers. It is built from ground up with clean design. I guess the future Google OS may be based on Go and more great applications written by Go will be coming out soon. Still as Rob pike said in the show, (Go) is early yet ... more will be coming soon.


Sunday, November 08, 2009

SyncToy 2.0 - A Windows 7 Tool by Microsoft Home Server Team

toolsLast week, I was asked to investigate an issue of backup some files from remote network drives. I thought the basic concept is to find out if a file has been changed or not. This could be file name, modified date. It can go further complicated such as file name changes, deleting, as well as content change. This must be a very common issue in Windows platform, I thought, and there must be something available such as libraries or tools.

Soon I found out SyncToy 2.0, a free Windows utility application offered by Microsoft. It was actually for Windows 7. The tool is based on Microsoft Sync Framework File Synchronization Provider. In other words, you can use the tool or use the library in .Net. The tool provides three basic actions:

  • Sync: bi-directional sync, any change in either left or right will synced to opposite side. New and updated files are copied both ways. Renames and deletes on either side are repeated on the other.
  • Echo: any change on the left side will be echoed to the right side, but any changes on the right side will not be on right side or reload to right side. New and updated files are copied left to right. Renames and deletes on the left are repeated on the right.
  • Contribute: only new files on left side will be added to the right side. New and updated files are copied left to right. Renames on the left are repeated on the right. No deletions.

For my case, Contribute is the right action for me. I tried this tool and it works well. If there are a lots of files on the left side, the first time may take long time since all the files will be copied to the right side. The later sync process may be much faster if there is a few files changed or no change. It can be used against network drive and the sync process can be done as a scheduled job with sync name. Each sync is defined as a pair of left and right, with additional options such as file exclusion, hidden files and more.

The tool provides log under current user profile. I think the log file is saved at %userprofile%Local Settings/Application Data/Microsoft/SyncToy 2.0. The left and right sides, there are some hidden dat files, which store sync information for the next sync.

There are also some examples of how to use the Sync Framework. I think this provides more more control over how to sync and realtime sync.

Reference: a blog on SyncToy 2.0 by Microsoft Home Server Team.


Wednesday, November 04, 2009 and WidExplorer

StackOverflow has another site for computer Q&As: Super User. The structure of this site is very similar as StackOverflow. Any user can ask and answer computer related questions, vote Q&As, and make comments. Any user can gain reputations by badges. This is a complementary to StackOverflow's developers site. I, as with 163 reputation currently, have asked several questions and answered a few.

Today, I asked a question about using browser to display multiple web sites in one page or tab. This could be done by browser's add-ins or web services. I prefer web services since it is less dependent on browsers. I got some answers, but soon I found a web service doing what I want: a wide view of the web(WE). Basically, the web service has the following features:

  • Search engine: it provides a text field for search. The search results will be a list of google, being, yahoo, wikipedia, youtube and more. The display is one page with wide view of those results.
  • An edit UI for multiple URLs. From there you can enter a list of ULRs and get a wide view of results.
  • Short URLs. Since the view is in one page or tab with a list of results of web sites separated in horizontal view, this browser view has a long URL. At the end of the view (far right side), WE provides a UI for edit URLs and a short or tiny URL for the current view. For example, this tiny URL name( is a view of a list of stocks.

In addition to that, the wide view also provides "-" and "+" to shrink and expand a URL view. The wide view and UIs are based javascript codes on client side so the view is very fast. The only thing is that each URL view has its full width without its own horizontal scroll bar. Another thing is that some empty URL are displayed as expanded mode instead of shrink mode, or empty URLs should not be displayed.