Friday 15 November 2013

What does “event bubbling” mean?

Event bubbling means that an event propagates through the ancestors of the element the event fired on.

Lets show what this means using the HTML markup below:

<div>
    <h1>
        <a href="#">
            <span>Hello</span>
        </a>
    </h1>
</div>
Lets assume we click the span, which causes a click event to be fired on the span; nothing revolutionary so far. However, the event then propagates (or bubbles) to the parent of the span (the <a>), and a click event is fired on that. This process repeats for the next parent (or ancestor) up to the document element.

You can see the live example in action here

Tuesday 8 October 2013

How to Install and Uninstall Windows Services manually without setup

To install your service manually


  1. On the Windows Start menu, choose Visual Studio 2010, Visual Studio Tools, Visual Studio Command Prompt (2010).
    A Visual Studiocommand prompt appears.
  2. Access the directory in which your project's compiled executable file is located.
  3. Run InstallUtil.exe from the command prompt with your project's output as a parameter. Enter the following command.
installutil yourproject.exe


To Uninstall your service manually

  1. On the Windows Start menu, choose Visual Studio 2010, Visual Studio Tools, Visual Studio Command Prompt (2010).
  2. A Visual Studiocommand prompt appears.
  3. Run InstallUtil.exe from the command prompt with your project's output as a parameter. Enter the following command:
installutil /u yourproject.exe

Saturday 5 October 2013

Monitor Printing Jobs in .Net

You may be in need of Monitoring different Print Jobs submitted to printer in our local network.

For that, PrintQueueWatch printer monitoring component is the one stop for you.

  • PrintQueueWatch is a .NET component (as class library) that facilitates monitoring one or more printers from a WinForms application and gathering information from the print system above and beyond that provided by the .NET Framework
Download dll files from there and add reference to your project.

And below is the code you need.


        public void StartWatching(string PrinterDeviceName)
        {
             PrintMonitor[] objPrint = new PrintMonitor[2];
             mPr = new PrinterMonitorComponent();
             mPr.MonitorPrinterChangeEvent = false;
             mPr.JobAdded += Addedtest;
             try
             {
                 mPr.AddPrinter(PrinterDeviceName);
             }
             catch (Exception e)
             {
                 clsErrorTrace.CreateLog("StartWatching", e);
             }
        }
        public void Addedtest(object sender, PrintJobEventArgs e)
        {
            try
            {   string str = "";
                str += "Printer Name: " + e.PrintJob.PrinterName + Environment.NewLine;
                str += "User Name: " + e.PrintJob.UserName + Environment.NewLine;
                str += "Document Name: " + e.PrintJob.Document + Environment.NewLine;
                str += "Total Pages Printed: " + e.PrintJob.TotalPages + Environment.NewLine;
                str += "Date Time: " + e.PrintJob.Submitted + Environment.NewLine;
            }
            catch (Exception ex)
            {
                clsErrorTrace.CreateLog("Addedtest", ex);
            }
        }
Here, you have to pass the Printer Name which you want to monitor for it's jobs.

Ex., I have one printer installed on my PC that is "HP Prolient 2022" then I will Monitor it by this:
StartWatching("HP Prolient 2022");

So "Addedtest" function will be called once any Job will be added and you will be able to get the details related to that job like Printer Name, Document Name, Total Pages Printed, etc.

A life saving utilities a web developer should know

  1. Fire Bug
  2. Colorzilla
  3. File Zilla
  4. ViewPure 
    • Watch a YouTube video. Just the video and not the rest of the crap or ads or other videos around it. It's readability for YouTube.
  5. StackOverflow 
    • Get your questions answered here! If you haven't heard, you better ask someone.
  6. Bit.ly 
    • All the goodness of TinyUrl with statistics, real-time tracking, accounts and much, much more. If you get a Bit.ly url, add a + to the end of it to see lots of statistics!
  7. gSkinner 
    • An amazing Flash-based online RegEx tool for writing and testing RegEx.
  8. JS-Fiddle
    • Sometimes you just want to fiddle with JavaScript. Fire up a text editor, IDE or Firebug? Naw, man. Use JSFiddle, load your framework of choice and get to work. HTML, CSS and JavaScript plus your results. Then share with a friend!
  9. Visual Studio Gallery 
    • All the world's extensions to Visual Studio in one place, and ranked by the public. Easy to search and sort.
  10. CodePaste.NET 
    • When you write code, you need to share it.
  11. LINQPad
    • Interactively query your databases with LINQ with this tool from Joseph Albahari. A fantastic learning tool for those who are just getting into LINQ or for those who want a code snippet IDE to execute any C# or VB expression.
  12. Join.me
    • when I just want to share my screen and give a URL to a bunch of people who can view it without anything other than Flash, I use Join.me
  13. DropBox
    • It's on every platform I want it on. It works great with large stores (mine is over 60gigs) and also allows selective sync for small amounts of data in just certain folders. Ultimately, though, get yourself some cloud storage because when you stuff is just "there", life is better.

Friday 14 June 2013

API v1 Retirement is Complete - Use API v1.1 instead

Twitter has recently translated it's API v1 and fully transitioning it to API v1.1

The Twitter platform is constantly evolving and there is frequent change. If you have an integration that's no longer working, be sure and review the developer blog,platform calendar, recent tweets by the @twitterapi account, the API status dashboard, recently updated documentation and Twitter's status blog athttp://status.twitter.com

API v1 is currently set to retire on June 11, 2013. After retirement (and during the blackout tests leading up to retirement), you can expect the following: 

  • Authenticated & unauthenticated requests to api.twitter.com/1/* will receive HTTP 410 Gone. Use API v1.1 instead.
  • Requests to search.twitter.com/search.* will receive HTTP 410 Gone. Use GET search/tweets instead.
  • Requests to api.twitter.com/1/statuses/oembed.* will continue to be serviced. However, we strongly encourage developers to tolerate HTTP redirects if continuing to use this endpoint.
  • Basic Auth will be disabled on stream.twitter.com/* for all users in non-elevated Streaming API roles. Such requests will receive a HTTP 401Unauthorized. We strongly recommend all Streaming API users, including those in elevated roles, to migrate to OAuth 1.0A now.
  • Requests to Streaming API paths with versions other than "1.1" (such as stream.twitter.com/1/statuses/filter.json) are deprecated — but will not be retired at this phase. We strongly recommend you move to 1.1-era Streaming API paths now.
  • API v1.1 is documented as SSL-only. Make sure you're using SSL and verifying peers — see this guide for more information. Non-SSL requests will eventually be rejected.
  • Legacy widgets (AKA "Goodie" or "Join the Conversation" widgets) will no longer populate with Tweets.
  • JSON is API v1.1's only output format. XML, RSS, and ATOM response formats will be retired along with API v1.

Friday 7 June 2013

Adding Splash Screen and a Start-up Icon in Your iOS Web App

Here is the detailed documentation on how to add a splash screen to your web app.

1) For Start-Up Screen

while your home page loads in the background, iOS will display a startup screen.

iOS comes with a built-in function called "launch image".

iPhone 4/4S supports a higher screen resolution (what so called Retina Display). In order to support both screen resolution of older iPhone models and latest models, you have to prepare two versions of splash screen images of these sizes:
  • 320 x 480 (for iPhone 2G / 3G / 3GS)
  • 640 x 960 (for iPhone 4 / 4S)
The splash screen image should be in PNG format. By default, you should name the image file for lower screen resolution as “Default.png”.

Below is the code to enable splash screen:

<link rel="apple-touch-startup-image" href="images/boot.png" />

Start-up Image will only work if it has this line:
<meta name="apple-mobile-web-app-capable" content="yes" />

Below are the different sizes you will need for iPad/iPhone/iPod etc.

        <!-- iPhone -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPhone.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">
        
        <!-- iPhone (Retina) -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPhone-RETINA.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
        
        <!-- iPhone 5 -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPhone-Tall-RETINA.jpg"  media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
        
        <!-- iPad Portrait -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPad-Portrait.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">
        
        <!-- iPad Landscape -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPad-Landscape.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">
        
        <!-- iPad Portrait (Retina) -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPad-RETINA-Portrait.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
        
        <!-- iPad Landscape (Retina) -->
        <link href="http://www.example.com/mobile/images/apple-startup-iPad-RETINA-Landscape.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

This is the link for detailed information: Home screen icons and startup screens

The output will be:



2) For Home Screen Icon :

Put this tag in between <head></head> tags.

<link rel="apple-touch-icon" href="/timentry2.jpg" />
The Image size must be of (57 x 57)

You can also put multiple Images for different resolution of Iphone as below:

<link rel="apple-touch-icon" href="touch-icon-iphone.png" />

<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" />

<link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone-retina.png" />

<link rel="apple-touch-icon" sizes="144x144" href="touch-icon-ipad-retina.png" />


How it will work: 



Then