How to handle negative TimeSpan value in C#?

I had problems with casting TimeSpan object to DateTime. Error occured: FormatException (“the input string was not in proper format”).

Code I tried:
DateTime.Parse(record.Field(“Hours”)); // raised error

Here record is a DataRow object and I’m using Linq to Objects to parse the Date.

//Field actual value :”{-06:25:00}”

How did I overcome?
I used .Duration() method of TimeSpan object.




What is self hosting?

Self Hosting is a terminology defined for integrating all the required applications for a purpose together. To understand the concept you can think of a dynamic website that talks to some API over the internet in order to generate the desired output. In this scenario the Web Server is apart from API Server which is at a different location whereas, Self-Hosting is just about keeping all the services running at one place in integrated way. It means, the Web Server and API Server both are situated at the same place talking to each other at the same endpoint.

It’s only a simple example as you can go further and imagine of having any software compilation done and tested together at the same moment.
Self hosting is the act of having your website totally under your control. This can include you managing all whole aspects of it, from setting up the web server to installing software.


Creating Reusable and Scalable Calendar Icon in HTML5 and CSS3

This article explains how tro create a calendar icon for your blog or website, and yes, it is scalable, so you can resize it to any ratio and it will not be blurred just by changing a font-size. 

You’re free to change the color/size of the text or an icon or anything as you prefer. I’m going to show you how:

Figure 1: Template Div

The following is the template that I will be modifying to get the desired output. It contains a main wrapper Div and three elements inside for Day, Month and Date respectively. I had the option to put all the three in a span but just to reduce the complexity of the CSS I put them in separate tags.

And here’s the style for this icon wrapper, you can change the size of the icon in just one go by changing the wrapper’s font-size attribute.

Figure 2: Icon Wrapper style

Here’s the complete HTML and CSS:

Reusable Calendar Icon

  font-family: “Segoe UI”, Frutiger, “Frutiger Linotype”, “Dejavu Sans”, 
  “Helvetica Neue”, Arial, sans-serif;
  font-size: 100%;

  margin: 10px
  color: #333;
  background-color: #cecece;
  font-size:1em; /*change calendarIcon size */
  display: block;
  position: relative;
  width: 7em;
  height: 7em;
  background-color: #fff; 
  border-radius: 0.7em;
  -moz-border-radius: 0.7em; 
  box-shadow: 0 1px 0 #bdbdbd, 0 2px 0 #fff, 0 3px 0 #bdbdbd,
  0 4px 0 #fff, 0 5px 0 #bdbdbd, 0 0 0 1px #bdbdbd;
  overflow: hidden;
 div.calendarDate *
  display: block;
  width: 100%;
  font-size: 1em;
  font-weight: bold;
  font-style: normal;
  text-align: center;
div.calendarDate strong
  position: absolute;
  top: 0;
  padding: 0.4em 0;

  color: #fff; 
  background-color: #19aaaa;
  border-bottom: 1px dashed #ddd;
  box-shadow: 0 2px 0 #19aaaa;
div.calendarDate em
  position: absolute;
  bottom: 0em;
  color: #fff;
  height: 1.6em;
  background-color: #19aaaa;
div.calendarDate span
  font-size: 2.8em;
  letter-spacing: -0.05em;
  padding-top: 0.65em;
  color: #2f2f2f;


Just in case you may want to fiddle around, see:

Thanks for reading this article, I hope you find this article useful. Feedback and comments are highly appreciated!


Template Tag in HTML5

W3C has introduced a new “template” tag that provides a mechanism to define HTML markup fragments as prototypes. In practice, a template can be used to insert fragments of HTML code into your page, for example:
<template id=”rowTemplate”>
<td class=”record”></td>
The following are the features of the template tag:
  • The template code can be defined nearly anywhere; the head, body or even a frameset.
  • Templates will not be displayed
  • Templates are not considered to be part of the document, in other words using document.getElementById(“mytablerow”) will not return child nodes.
  • Templates are inactive until used, in other words enclosed images will not download, media will not play, scripts will not run, and so on.
Using templates
To use a template, it must be cloned and inserted into the DOM. For example, assuming the following HTML:
<table id=”testTable”>
<template id=”rowTemplate”>
<td class=”record”></td>

Use the following to clone the new row and append it to the table in JavaScript:

// get tbody and row template
var t = document.querySelector(“#testTable tbody”),
row = document.getElementById(“rowTemplate”);
// modify row data
var td = row.getElementsByTagName(“td”);
td[0].textContent = “1”;
td[1].textContent = “Sunny”;
td[2].textContent = “@sunny_delhi”;
// clone row and insert into table

Q: Can we use templates?
A: Not yet. For now, it’s supported in the latest version of Chrome and Firefox nightly builds but yes, there’s a shim demonstrated that you can use as a workaround until it is implemented by all prominent browsers. It probably works in IE also.

Shim DemoLinkjsfiddle

Separation of HTML code and JavaScript is a good idea!