2015 July

Search Box using QLineEdit

Jul 30, 2015

This week, at work I had to implement a search box for a software I am working on. The search box is to filter some data dynamically as user types a query. I wanted to show a clear (cross) icon at the right side of the search box so that user can clear the results instead of selecting the current query and deleting it manually. Lastly, for clarity I wanted to show a search icon on the left side of search box. The search box looks like this:

Screenshot of the Search box implemented using QLineEdit

After the user enters a query a clear icon appears on the right. The clear icon is in fact a button and clicking it will clear the current search.

It is really easy to make this search box using QLineEdit. We need only the following three lines of code:

QLineEdit* _lineEdit = new QLineEdit();
_lineEdit->setClearButtonEnabled(true);
_lineEdit->addAction(":/resources/search.ico", QLineEdit::LeadingPosition);
_lineEdit->setPlaceHolderText("Search...");

// add _lineEdit to your widget

Line 2 enables the clear button which adds the clear action and cross icon to the right. Line 3 adds another action with a search icon to the left of the QLineEdit. We don’t listen to this action as it is merely decorative. Line 4 adds a placeholder text which is shown in the QLineEdit but is cleared as soon as user starts typing.

We only connect textChanged(const QString&) signal which is emitted both when a user clicks on the cross icon and when he enters a search query.

Markdown to PDF Converter

Jul 29, 2015

Few weeks ago, I published SLogLib (a cross-platform logging library) on GitHub. I wrote the user manual in a readme.md file as is the standard practice at GitHub. However, since most of users don’t have markdown viewers installed on their machines they would either need to access GitHub repository or would have to convert it to more popular format such as PDF or perhaps HTML. For many users going online is becoming standard practice to access documentation but I prefer offline manuals. Thus, I wanted to ship a PDF manual along with the code.

I searched high and low for a standalone tool to convert markdown to PDF but surprisingly there are not a lot of options out there. The first tool I came across was GitPrint. It is conceptually innovative and straightforward to use with GitHub. Just add /your_user_name/repository_name at the end of http://gitprint.com and it prints the readme.md in the repository to PDF. The PDF generated is of good quality but there are no styling options. Also, it failed to include images in the PDF so I had to kept looking. One of the frequently recommended tool is PanDoc, which is a swiss-army knife to convert files from one markup format into another. However, in my experience it doesn’t do a good job of converting markdown to PDF. Another popular tool online is a markdown-pdf package for Node.js. Since, I have no prior experience with Node.js I haven’t tried it yet.

Earlier this year, I bought a MacBook Pro and installed a markdown editor called MacDown. It is really nice tool with side-by-side rendering of markup and HTML. It can export markdown as PDF and produces very good quality PDF’s. It also supports lots of styling options as well as a CSS to customize PDF generation. In the end, I used it to generate PDF for SLogLib.

Even though I had a PDF for SLogLib, I wanted to find/build a cross-platform tool to convert markdown to PDF.

The basic idea to convert markdown to PDF is simple. First convert markdown to HTML and then print HTML to PDF. I used hoedown to convert markdown to PDF because of several reasons:

First and foremost it is cross-platform and compiles as a standalone binary for all three main platforms: Windows, Linux, and OSX.
MacDown uses it too and I was quite happy with its rendering.
It supports not only standard markdown but also several non-standard extensions.

To converted HTML to PDF one of the most popular tool I came across was wkhtmltopdf. It is also cross-platform and complies into standalone binaries for all popular platforms. In fact, it is possible to download the pre-built library right from its website. Wkhtmltopdf uses a modified version of webkit shipped with Qt. It uses webkit to render the html and print to PDF. However, while testing I found that on a Windows 7 machines there is a serious problem with font kerning. It has been reported by a lot of users but I haven’t found a solution to fix it. Wkhtmltopdf would have been ideal as I could simply write a command line and/or GUI tool wrapping the functionality of hoedown and Wkhtmltopdf.

Screenshot of markdown to PDF generated from MacDown

Screenshot of PDF generated from MacDown.

Screenshot of markdown to PDF generated wkhtmltopdf

Screenshot of PDF generated from wkhtmltopdf.

I could not find any other standalone cross-platform tool to convert HTML to PDF. So, for now I decided to use dompdf which is written in PHP. Once I started used PHP I thought why not make it a web based tool. This would allow me to learn about SEO which I have been promising myself to learn one day :). The tools is hosted at http://markdown2pdf.com. At the moment it doesn’t appear in first five pages in Google search for “markdown to pdf” or “markdown 2 pdf”. I am playing with various SEO tools and techniques and hope to get it within first five pages.

My quest for a standalone tool is not yet complete. I will try to find a solution for wkhtmltopdf kerning issue or find another standalone cross-platform tool for converting from HTML to PDF. I will update with my findings on this blog.

Onion Cells under Microscope

Jul 27, 2015

In this post, I will show how to make a wet mount slide for looking onion cells under a microscope.

Making the slide

Take a clean slide and place a drop of water in the centre
Take a small piece of onion and carefully peel the translucent membrane from the rough underside
of the slide. To peel the membrane, you can either use a sharp blade or a pair of tweezers. It is important to do this step carefully so as to not break too many cells. So, ideally always hold the peeled membrane at the edges.
Now carefully, place the membrane in the drop of water placed earlier on the slide.
You may want to put a small drop of tincture iodine over the onion membrane. This is to help create contrast between cell nuclei and other parts of cells.
Finally, gently lower a cover slip over the membrane.

Micrographs

Below are the micrographs of the onion cells. The nuclei are the small dark circles and the thick black lines are the cell walls.

Dog Cardiac Muscle l.s. Amscope 50PC Prepared Slides

Jul 26, 2015

Dog cardiac muscle longitudinal section (l.s.) is the 9th slide in the Amscope 50PC prepared slides. A cardiac muscle is found only in heart. These muscles are involuntary i.e. they contract and expand automatically to keep heart pumping. I am not 100% sure but most likely the cark blue dots in the micrographs are the nuclei.

Micrographs [19 July 2015]

Amscope 50PC Prepared Slides

This post lists all the micrographs I have done from the Amscope 50PC prepared slides.

Dense Connective Tissue section Amscope 50PC Prepared Slides

Jul 25, 2015

Dense connective tissue (section) is the 8th slide in the Amscope 50PC prepared slides. Dense connective tissue have densely packed fibers made up of mainly collagen (while lines in the micrograph below). The fibers in these tissues are regularly arranged and they are very strong but inelastic. Due to their in-elasticity, they can break if a strong force is applied across the fibers. Dense connective tissues forms the ligaments (connects muscles to bones) and tendons (connects bones to bones) in our body.

Micrographs [19 July 2015]

Dog Cardiac Muscle (l.s.) magnified 40 times

Dog Cardiac Muscle (l.s.) magnified 100 times

Dog Cardiac Muscle (l.s.) magnified 400 times

Amscope 50PC Prepared Slides

This post lists all the micrographs I have done from the Amscope 50PC prepared slides.

Dandelion Fuzz w.m. – Amscope 50PC Prepared Slides

Jul 23, 2015

Dandelion Fuzz whole mount (w.m.) is the 7th slide in the Amscope 50PC prepared slides. Dandelion is a yellow colored flower native to Eurasia and North America [Wikipedia]. What appears to be a single dandelion flower is actually made up of a large number of small flowers called florets! After removing the yellow petals from all florets, we are left with dandelion fuzz also known as seed head. The micrographs below show a single seed from the seed head.

Micrographs [19 July 2015]

Dandelion Fuzz (w.m.) magnified 40 times

Dandelion Fuzz (w.m.) magnified 100 times

Amscope 50PC Prepared Slides

This post lists all the micrographs I have done from the Amscope 50PC prepared slides.

A man gets an immense satisfaction from the knowledge of having done good work

Jul 17, 2015

You increase your self-respect when you feel you’ve done everything you ought to have done, and if there is nothing else to enjoy, there remains that chief of pleasures, the feeling of being pleased with oneself. A man gets an immense amount of satisfaction from the knowledge of having done good work and of having made the best use of his day, and when I am in this state I find that I thoroughly enjoy my rest and even the mildest forms of recreation.
Journal of Eugene Delacroix

Cross-platform high-resolution timer

Jul 16, 2015

Often there is a need to estimate the time it takes for a piece of code to run. This is useful not only for debugging but also for reporting the execution time of lengthy tasks to the user.

On Windows, QueryPerformanceFrequency() and QueryPerformanceCounter() can be used to determine the execution time of a code. QueryPerformanceFrequency() returns the frequency of the current performance counter in counts per second and QueryPerformanceCounter() returns a high resolution (<1µs) time stamp. Together they can be used to determine time it takes to run a piece of code is:

LARGE_INTEGER _frequency;
QueryPerformanceFrequency(&_frequency);

LARGE_INTEGER _start;
QueryPerformanceCounter(&_start);

// Code which takes a long time to run.

LARGE_INTEGER _stop;
QueryPerformanceCounter(&_stop);

double _intervalInSeconds = (_stop.QuadPart - _start.QuadPart) / _frequency.QuadPart;

On Linux, clock_gettime can be used to get a time interval with a resolution of nano-seconds. clock_gettime() requires two arguments: clockid_t and timespec structure. To build a timer, CLOCK_MONOTONIC is a good choice for clockid_t as the time is guaranteed to be monotonically increasing. timespec structure have two field: tv_sec (time in seconds) and tv_nsec (time in nanoseconds). Code to determine the time it takes to run a piece of code is:

struct timespec _start;
clock_gettime(CLOCK_MONOTONIC, &_start);

// Code which takes long time to run.

struct timespec _stop;
clock_gettime(CLOCK_MONOTONIC, &_stop);

double _intervalInseconds = (_stop.tv_sec + _stop.tv_nsec*1e-9) - (_start.tv_sec + _start.tv_nsec*1e-9);

I have written a simple class which can be user on both windows and Linux. It has the following interface:

class Timer
{
public:

    enum TimeUnit
    {
        TimeInSeconds = 1,
        TimeInMilliSeconds = 1000,
        TimeInMicroSeconds = 1000000
    };

public:

    Timer();
    ~Timer();

    // On Windows, returns true if high performance timer is available.
    // On Linux, always returns true.
    bool IsTimerAvailable();

    // Start the timer.
    void Start();

    // Stop the timer and return the time elapsed since the timer was started.
    double Stop(TimeUnit timeUnit = TimeInMilliSeconds);

    // Get the time elapsed since Start() was called.
    double TimeElapsedSinceStart(TimeUnit timeUnit = TimeInMilliSeconds);

    // Get the total time elapsed between Start() and Stop().
    double TotalTimeElasped(TimeUnit timeUnit = TimeInMilliSeconds);
};

You can download the code from the following links:
Timer.h
Timer.cpp
Timer_Unix.cpp
Timer.zip