Blogger: Adding syntax highlighter to Blogger

As we know it is really hard to post any source code to the blogger as there is no Syntax Highlighting option by default to the blogger (A Big Deficiency).

After doing some web search first I came across a Javascript tool named syntaxhighlighter and then I came across Heisencoder's post on how to add the syntaxhighlighter option to the blogger template.

NOTE: We are about to tweak the HTML code of the blogger template. Inorder to know how to edit the HTML code of the blogger template check this post.

NOTE: For safety precautions click "Download Full Template" link to download full html code of your present blog's template.

Select "Expand Widget Templates" option to see the full html code in the editor. Now we have to make our hands dirty as we are about to add some code into our blogger template code.

1. Go to http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/SyntaxHighlighter.css, and perform "select all" and "copy" the whole code and paste it at the end of the css section of your blogger html template (i.e.,  before ]]--></b:skin>).

2. Before the </head> tag, paste the following code:

<!-- Add-in CSS for syntax highlighting -->
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'></script>

NOTE: Simply remove lines for languages which you will never use (for example, Delphi) -- it will save some loading time of the blogs.

3. Before the </body> tag, insert the following:

<!-- Add-in Script for syntax highlighting -->
<script language='javascript'>
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>

NOTE: Tweaking of the Blogger HTML template code is complete. So before you save the template code just click on "Preview" button to see if the code is not crashing & working fine.

4. While posting a post that has source code then click on "Edit Html" tab and post the source code between pre tags shown below

<pre name="code" class="cpp">
...Your html-escaped code goes here...
</pre>

In the above code substitute "cpp" with whatever language you're using. Choices: cpp, c, c++, c#, c-sharp, csharp, css, delphi, pascal, java, js, jscript, javascript, php, py, python, rb, ruby, rails, ror, sql, vb, vb.net, xml, html, xhtml, xslt. Full list can be accessed at Supported languages.

NOTE: Instead of remembering the code everytime we can add this HTML code simply into the template so that it is displayed whenever we create a new post. Click on "Settings" tab and then "formatting" sub-tab and post the html code in the "Post Template" box. As a result next whenever we create a new post it is displayed when we click "Edit Html".

We have to perform HTML escaping which can be done in the sites like Centricle, Accessify.

Reference

[1] Heisencoder - Link

Gcov - analyzing code produced with GCC

How can a programmer exactly know which part of his code is frequently executed and which part of code is never traversed ? That's where CODE COVERAGE comes for rescue ...

Code Coverage is a measure used in software testing to describe the degree to which the source code of a program has been tested. It is a form of testing that inspects the code directly and checks the active and non-active parts of the source-code.

Basically there are number of code coverage criteria, the main ones being:

• Function coverage
Has each function in the program been executed?


• Statement coverage
Has each line of the source code been executed?


• Decision coverage (also known as Branch coverage)
Has each control structure (such as an if statement) evaluated both to true
and false?


• Condition coverage
Has each boolean sub-expression evaluated both to true and false (this does
not necessarily imply decision coverage)?


• Modified Condition/Decision Coverage (MC/DC)
Has every condition in a decision taken on all possible outcomes at least
once? Has each condition been shown to affect that decision outcome
independently?


• Path coverage
Has every possible route through a given part of the code been executed?


• Entry/exit coverage
Has every possible call and return of the function been executed?

NPTEL - Web Video courses from IIT's and IISc

NPTEL - National Programme on Technology Enhanced Learning, a project funded by the Ministry of Human Resource Development (MHRD) of India.

The main objective of NPTEL program is "To enhance the quality of engineering education in the country by developing curriculum based video and web courses".

Seven IITs and IISc Bangalore together created web courses on different engineering subjects and made them available for all other students around the world.


In the first phase of the project, supplementary content for 129 web courses in engineering/science and humanities have been developed. Each course contains materials that can be covered in depth in 40 or more lecture hours. In addition, 110 courses have been developed in video format, with each course comprising of approximately 40 or more one-hour lectures. In the next phase other premier institutions are also likely to participate in content creation.

The courses can be accessed at http://nptel.iitm.ac.in/

The video lectures of various courses can be directly accessed from Youtube at http://youtube.com/iit

Blogger: Adding Applet code into the blogger post

Since we cant directly upload the Applet code into the google and then include it in the blogger post checkout the the way we have to add the Applet code into the blogger.

We cant simply add the Applet code to post in the blogger. For e.g. let us add the following applet code <applet code=ThreeD.class width=100 height=100></applet> into the post then we see a box with a 'x' mark on the left side corner as shown below.



Inorder to solve the problem we have to modify the Applet code so that blogger can track down where the following applet is actually present.


Solution to the problem comes up with a tag "codebase" ...

What is codebase?
Codebase tells the browser where the applet files are located, but if all files (including the HTML file, .class files, and images) are all together in one folder on your own server or local system, you should not specify CODEBASE. Likewise, if you are going to use the applet off-line, do not use a CODEBASE.

If you are using something like BLOGGER, then yes, you will definitely need to use a codebase address (since .class files can't be directly stored on the .blogspot server).

Something like this

<applet code=ThreeD.class width=100 height=100 codebase=http://www.yoursite.com/files/ ></applet>

I have provided the exact link location where the applet code is stored.