Display web notifications only when the browser window/tab is not active

HTML5 has brought with it the Notification API. In other words, HTML5 allow us to show browser notifications to the web app users. The most important feature is that the notification will be displayed regardless of which tab or window is focused.

That being said, personally I want to display a notification only when the source tab is not focused (actually,  that’s the desired behavior in most of the cases).
So, how can we display browser notifications only when the tab is not active/focused?

 
 //make sure the tab is not active/focused
 if(!document.hasFocus()) {
     showNotification('Hello world!');
 }

//source: https://developer.mozilla.org/en-US/docs/Web/API/notification
function showNotification($message) {
    // Let's check if the browser supports notifications
    if (!("Notification" in window)) {
        alert("This browser does not support desktop notification");
    }

    // Let's check whether notification permissions have already been granted
    else if (Notification.permission === "granted") {
        // If it's okay let's create a notification
        var notification = new Notification($message);
    }

    // Otherwise, we need to ask the user for permission
    else if (Notification.permission !== 'denied') {
        Notification.requestPermission(function (permission) {
            // If the user accepts, let's create a notification
            if (permission === "granted") {
               var notification = new Notification($message);
            }
        });
     }

 // At last, if the user has denied notifications, and you
 // want to be respectful there is no need to bother them any more.
 }

Resources:

Notification documentation on MDN

Browser compatibility

Official Notification API specs

How to insert a page break in html/css for printing

Add this page-break css rule for the element you don’t want to break or split between pages at print:

[CSS]
p.print, blockquote.print, tr.print {
page-break-inside: avoid;
}


Browser compatibility for page-break on caniuse.com

Page-break on css-tricks.com

20 tips to become a better PHP Programmer

If you are a beginner in PHP programming here are 20 tips that will help you to become a better PHP programmer (as suggested by Marc on his post on webgeekly.com):
1) Use <?php and ?>
2) Separate Configuration Files
3) Comment, comment, comment
4) Use Indentation and Spacing (don’t be cheap on whitespaces)
5) Give your Variables Meaningful Names
6) Initialize your Variables
7) Boolean is False, unless True
8) Using Quotes when accessing Array Keys
9) Use commas to echo different strings
10) Use Ternary Operators
11) Use === for Boolean Checks
12) Use ++ and — Operators
13) Use Assignment Operators
14) Create a Variable Dump Function
15) Use Constants
16) Use $_GET and $_POST, avoid $_REQUEST
17) If your function has lots of paramaters use objects instead of functions
18) Use Method Chaining
19) Stop Repeating Code
20) Aim for Loose Coupling, Strong Cohesion

For full post (and explaination) check 20 Tips you need to learn to become a better PHP Programmer

Playing with CenterIM, a command line instant messenger

When working in the terminal, I use a lot CenterIM, an instant messenger client. While Finch (Pidgin on ncurse) is more feature-rich than CenterIM and has almost all the plugins that Pidgin has, I prefer CenterIM because it has a very clean interface, offering you just what you need to communicate:

-a contact list

-a chat window

-a log window (I find it quite informative)

There is one function in Pidgin that I like a lot and that is  the “Pounce”  option (being announce with a pop-up when an user log off, log in or some other event you select).  After reading the   CenterIM Documentation, I found a very simple solution to implement this feature to my favorite command line IM client. So here it is:

Top 10 torrent clients for linux

Two years ago I wrote an article about the best 5 torrent clients for linux. In the open-source world, two years means a lot of time. So, here it is an updated and enlarged list :

GUI torrent clients:

1)  Deluge

Deluge is a full-featured BitTorrent client written in python, for Linux, OS X, Unix and Windows. It uses  libtorrent in it’s backend and features multiple user-interfaces including: GTK+, web and console. It has been designed using the client server model with a daemon process that handles all the bittorrent activity. The Deluge daemon is able to run on headless machines with the user-interfaces being able to connect remotely from any platform.

[Homepage] [Download]

Written in: Python & C++ Library: libtorrent (Rasterbar version) Last release: 1.3.0  2010/09/13 Interface: GUI (GTK),  Web, CLI, Daemon Encryption: Yes Mainline DHT: Yes Magnet link: Yes Peer Exchange: Yes UPnP: Yes NAT: Yes

Local Peer Discovery: Yes IPv6 support: Yes Super Seeding: No Selective downloads: Yes Search engine: Yes RSS: Yes (via plugin) Remote control: Yes Prioritization: Yes Proxy: Yes

A simple solution for “image not available” problem

Is there a simple solution for problems with missing or broken images? Yes, it is. You don’t need any script, just an alternate image to display when this problem occur and the “onerror” event available with the img element. Here is an example:

< img src="/path/to/image.jpg" height="100px" width="100px" onerror="this.src = '/path/to/alternate-image.png'" / >

This simple solution was posted by Satya on his web scripting blog. Anyway, if you preffer a more elegant solution, you could use a script that dynamically detects the missing images and replace them with an alternate image. A good Java Script solution is presented on the tech evangelisit’s article.

PHP: Functions with arbitrary number of arguments

Sometimes you may have to use a function with a variable number of arguments. Here is a simple method of passing a list of variables to a function:


function foo() {

// returns an array of all passed arguments
$args = func_get_args();

foreach ($args as $k => $v) {
echo "arg".($k+1).": $v\n";
}

}

foo();
/* prints nothing */

foo('hello');
/* prints
arg1: hello
*/

foo('hello', 'world', 'again');
/* prints
arg1: hello
arg2: world
arg3: again
*/


For more interesting functions and futures, read the 9 useful php functions and futures you need to know article on net.tutsplus.com.

DOJO: Opening menu item on mouseover when using dijit.MenuBar

I’m using dojo at the project I’m working on now. One of the problems I encounter when  was how  to make the menu open when mouse over it.  I found a solution on the dojo maillist. Here is the function that does the “magic”:

dijit._MenuBase.prototype.onItemHover = function(item){

       this.focusChild(item);

       if(this.focusedChild.popup && !this.focusedChild.disabled){
            this._openPopup();
       }
};

Source: here

How would you describe a linux geek father?

Maybe this short clip could be the best answer:

History of internet in less than 10 minutes

Aristotle said: “If you would understand anything, observe its beginning and its development.”. I don’t know if this statement is completely true, but surely when talking about internet, it is (at least) interesting to know how this vital tool (for many of us) was born and developed to what is today. So here is IMO the simplest and well explained version of the history of the internet (having over 1 million views on youtube):