Category: HTML

Dynamic desktop push notifications using the Notifications API

devat karethaLeave a comment

Hello friends,

Today we are going to implement Push Notifications for desktop.

Copy below code and run in your localhost or live:

Code of JS:


    var articles = [
        ["Laravel 5.4 Socialite Facebook Login", "https://devat73.wordpress.com/2017/05/31/dynamic-desktop-push-notifications-using-the-notifications-api/"],
        ["How to migrate single database table in laravel", "https://devat73.wordpress.com/2017/05/24/how-to-migrate-single-database-table-in-laravel/"],
        ["How to solve the phpmyadmin not found issue", "https://devat73.wordpress.com/2017/05/18/how-to-solve-the-phpmyadmin-not-found-issue/"],
        ["localhost is not working?", "https://devat73.wordpress.com/2017/05/18/localhost-is-not-working/"],
        ["Un-install and Re-install PHP", "https://devat73.wordpress.com/2017/05/15/un-install-and-re-install-php/"]
    ];

    setTimeout(function () {
        var x = Math.floor((Math.random() * 5) + 1);
        var title = articles[x][0];
        var desc = 'Most popular article.';
        var url = articles[x][1];
        notifyBrowser(title, desc, url);
    }, 200000);

    document.addEventListener('DOMContentLoaded', function ()
    {
        if (Notification.permission !== "granted")
        {
            Notification.requestPermission();
        }

        document.querySelector("#notificationButton").addEventListener("click", function (e)
        {
            var x = Math.floor((Math.random() * 10) + 1);
            var title = articles[x][0];
            var desc = 'Most popular article.';
            var url = articles[x][1];
            notifyBrowser(title, desc, url);
            e.preventDefault();
        });
     });

    function notifyBrowser(title, desc, url)
    {
        if (!Notification) {
            console.log('Desktop notifications not available in your browser..');
            return;
        }
        if (Notification.permission !== "granted")
        {
            Notification.requestPermission();
        } else {
            var notification = new Notification(title, {
            icon: 'https://lh3.googleusercontent.com/-aCFiK4baXX4/VjmGJojsQ_I/AAAAAAAANJg/h-sLVX1M5zA/s48-Ic42/eggsmall.png',
            body: desc,
            });

        // Remove the notification from Notification Center when clicked.
            notification.onclick = function () {
                window.open(url);
            };

        // Callback function when the notification is closed.
            notification.onclose = function () {
                console.log('Notification closed');
            };

        }
    }

Code of CSS:


    .hover{ background-color: #cc0000 }
    #container{ margin:0px auto; width: 800px }
    .button {
        font-weight: bold;
        padding: 7px 9px;
        background-color: #5fcf80;
        color: #fff !important;
        font-size: 12px;
        font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
        cursor: pointer;
        text-decoration: none;
        text-shadow: 0 1px 0px rgba(0,0,0,0.15);
        border-width: 1px 1px 3px !important;
        border-style: solid;
        border-color: #3ac162;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        zoom: 1;
        border-radius: 3px;
        box-sizing: border-box;
        box-shadow: 0 -1px 0 rgba(255,255,255,0.1) inset;
    }
    .authorBlock{border-top:1px solid #cc0000;}

Code of HTML:

         
    
Dynamic desktop push notifications using the Notifications API Demo
         
    
Click notification button
         
    Notification

Enjoy…cheers…friends.

CodeIgniter Simple Login Form With Sessions

devat karethaLeave a comment

In this tutorial, we are going to learn about creating a simple login form in CodeIgniter. In login form, we made registration module, login module and admin panel using sessions.

We also have a paid ready-to-use advance login & registration module built on CodeIgniter that you can check out at CodeIgniter Login Registration Form.

Creating sessions in CodeIgniter is different from simple PHP. I will give you detailed information about all the method as we move further in this tutorial.

Watch the live demo or download code from the link given below

LIVE Demo: http://www.aorank.com/tutorial/login_demo/index.php
Download: https://www.formget.com/market/codeigniter-login-registration-form/

OR create by your self: https://www.formget.com/form-login-codeigniter/

Note : You can also refer the PHPProjectInstall.pdf file given in the download code folder.

Before starting, let’s have a look on what we are going to learn about.

Create login page, signup page and admin page.
Setting up validation to all input field.
Check for existing users in database during signup process.
Check for username and password in database and show their information stored in database.
Create session for admin panel, store users input data in session and destroy session(logout).

We are introducing a flow chart which will give you a clear vision about the objectives of this tutorial.

codeigniter-login-flow-chart

Codeigniter-login-logout-register

devat karethaLeave a comment

Create basic structure of website using Codeigniter Framework.

A user login, logout, register start for Codeigniter 3

Below is the link to build a simple auth module.
https://github.com/hedii/Codeigniter-login-logout-register

Installation

1. Open /application/config/database.php and edit with your database settings
2. On your database, open a SQL terminal paste this and execute:

CREATE TABLE IF NOT EXISTS `users` (
`id` int(11) unsigned NOT NULL AUTO_INCREMENT,
`username` varchar(255) NOT NULL DEFAULT '',
`email` varchar(255) NOT NULL DEFAULT '',
`password` varchar(255) NOT NULL DEFAULT '',
`avatar` varchar(255) DEFAULT 'default.jpg',
`created_at` datetime NOT NULL,
`updated_at` datetime DEFAULT NULL,
`is_admin` tinyint(1) unsigned NOT NULL DEFAULT '0',
`is_confirmed` tinyint(1) unsigned NOT NULL DEFAULT '0',
`is_deleted` tinyint(1) unsigned NOT NULL DEFAULT '0',
PRIMARY KEY (`id`)
);
CREATE TABLE IF NOT EXISTS `ci_sessions` (
`id` varchar(40) NOT NULL,
`ip_address` varchar(45) NOT NULL,
`timestamp` int(10) unsigned DEFAULT 0 NOT NULL,
`data` blob NOT NULL,
PRIMARY KEY (id),
KEY `ci_sessions_timestamp` (`timestamp`)
);

Go to http://example.com/register and create a user

It is just a starter for user login logout register functionalities.

Extend the user controller or keep it as it is and write your own application with Codeigniter.