How to create vertical menu with sub menu using CSS

HTML Part:

<div id="menuwrapper">
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">Products</a>
            <ul>
                <li><a href="#">Product 1</a>
                    <ul>
                        <li><a href="#">Sub Product 1</a></li>
                        <li><a href="#">Sub Product 2</a></li>
                        <li><a href="#">Sub Product 3</a></li>
                    </ul>
                </li>
                <li><a href="#">Product 2</a></li>
                <li><a href="#">Product 3</a></li>
            </ul>
        </li>
        <li><a href="#">About Us</a>
            <ul>
                <li><a href="#">Faqs</a></li>
                <li><a href="#">Contact Us</a></li>
                <li><a href="#">Where are we?</a></li>
            </ul>
        </li>
        <li><a href="#">Help</a>
    </ul>
</div>


CSS Part:
/* We remove the margin, padding, and list style of UL and LI components */
#menuwrapper ul, #menuwrapper ul li{
    margin:0;
    padding:0;
    list-style:none;
}

/* We apply background color and border bottom white and width to 150px */
#menuwrapper ul li{
    background-color:#7f95db;
    border-bottom:solid 1px white;
    width:150px;
    cursor:pointer;
}

/* We apply the background hover color when user hover the mouse over of the li component */
#menuwrapper ul li:hover{
    background-color:#6679e9;
    position:relative;
}

/* We apply the link style */
#menuwrapper ul li a{
    padding:5px 15px;
    color:#ffffff;
    display:inline-block;
    text-decoration:none;
}

/**** SECOND LEVEL MENU ****/
/* We make the position to absolute for flyout menu and hidden the ul until the user hover the parent li item */
#menuwrapper ul li ul{
    position:absolute;
    display:none;
}

/* When user has hovered the li item, we show the ul list by applying display:block, note: 150px is the individual menu width.  */
#menuwrapper ul li:hover ul{
    left:150px;
    top:0px;
    display:block;
}

/* we apply different background color to 2nd level menu items*/
#menuwrapper ul li ul li{
    background-color:#cae25a;
}

/* We change the background color for the level 2 submenu when hovering the menu */
#menuwrapper ul li:hover ul li:hover{
    background-color:#b1b536;
}

/* We style the color of level 2 links */
#menuwrapper ul li ul li a{
    color:#454444;
    display:inline-block;
    width:120px;
}

/**** THIRD LEVEL MENU ****/
/* We need to hide the 3rd menu, when hovering the first level menu */
#menuwrapper ul li:hover ul li ul{
    position:absolute;
    display:none;
}

/* We show the third level menu only when they hover the second level menu parent */
#menuwrapper ul li:hover ul li:hover ul{
    display:block;
    left:150px;
    top:0;
}

/* We change the background color for the level 3 submenu*/
#menuwrapper ul li:hover ul li:hover ul li{
    background:#86d3fa;
}

/* We change the background color for the level 3 submenu when hovering the menu */

#menuwrapper ul li:hover ul li:hover ul li:hover{
    background:#358ebc;
}

/* We change the level 3 link color */
#menuwrapper ul li:hover ul li:hover ul li a{
    color:#ffffff;
}

/* Clear float */
.clear{
    clear:both;

}

How to check internet Connection using Ionic V 1

Add Network information cordova plugin

Syntax:   

cordova plugin add cordova-plugin-network-information

// Check for network connection
    if(window.Connection) {
      if(navigator.connection.type == Connection.NONE) {
        $ionicPopup.confirm({
          title: 'No Internet Connection',
          content: 'Please check your Internet connection and try again.'

        })
        .then(function(result) {
          if(!result) {
            ionic.Platform.exitApp();
          }
        });
      }
    }

Note: You must test only mobile.

Ionic Get Current date [Get current date using Angularjs]

Show Full Date: (Method 1)

$scope.currDate = new Date();

alert($scope.currDate )

Output like this:
Wed Aug 16 2017 12:11:06 GMT+0530 (India Standard Time)



Show Full Date: (Method 2)

var date = new Date();

$scope.FromDate = date.getFullYear() + '-' + ('0' + (date.getMonth() + 1)).slice(-2) + '-' + ('0' +
date.getDate()).slice(-2);

Output like this:
2017-08-16


Get Current Date Only:
var date = new Date();

$cur_date = date.getDate();
alert($cur_date)

Get Current Month Only:
var date = new Date();
$cur_mon = date.getMonth() + 1;
alert($cur_mon)

Get Current Year:
var date = new Date();
$cur_year = date.getFullYear();
alert($cur_year)

Error with $http.get in angularJS — Response :Success & Error ionic

// Simple GET request example:

$http({

  method: 'GET',

  url: '/someUrl'

}).then(function successCallback(response) {

    // this callback will be called asynchronously

    // when the response is available

     var data = response.data;

    var status = response.status;

    var statusText = response.statusText;

    var headers = response.headers;

    var config = response.config;

    $scope.user = data;

    console.log(data);

  }, function errorCallback(response) {

    // called asynchronously if an error occurs

    // or server returns response with an error status.

     var data = response.data;

    var status = response.status;

    var statusText = response.statusText;

    var headers = response.headers;

    var config = response.config;

    $scope.user = data;

    console.log(data);

  });

More Details: 

https://docs.angularjs.org/api/ng/service/$http

Ionic 3 - Syntax for ionic version 3

Ionic 3 CLI Syntax

Check the installed version of Node.js:
npm version

Check the installed version of Git:
git --version

Check ionic version Details:
ionic info

Check Java version:
java -version

Install Cordova:
npm install -g cordova ionic

Ionic Framework Installation:
npm install -g ionic

*****************************************************************
Create New App(Name: samApp)

Syntax:
ionic start [<name>] [<template>]
name ..................... The name of your project directory
template ................. The starter template to use (e.g. blank, tabs; use --list to see all)

Examples:
    $ ionic start
    $ ionic start --list
    $ ionic start samApp blank
    $ ionic start samApp tabs --cordova
    $ ionic start samApp blank --type=ionic1

The Starter Ionic Template:
tabs ............... ionic-angular A starting project with a simple tabbed interface
blank .............. ionic-angular A blank starter project
sidemenu ........... ionic-angular A starting project with a side menu with navigation in the content area
super .............. ionic-angular A starting project complete with pre-built pages, providers and best practices for Ionic development.
conference ......... ionic-angular A project that demonstrates a realworld application
tutorial ........... ionic-angular A tutorial based project that goes along with the Ionic documentation
aws ................ ionic-angular AWS Mobile Hub Starter
tabs ............... ionic1 A starting project for Ionic using a simple tabbed interface
blank .............. ionic1 A blank starter project for Ionic
sidemenu ........... ionic1 A starting project for Ionic using a side menu with navigation in the content area
maps ............... ionic1 An Ionic starter project using Google Maps and a side menu


*****************************************************************

Start a local dev server for app dev/testing:

ionic serve
Examples:
$ ionic serve -lcs
$ ionic serve --lab -lcs
More Details: http://ionicframework.com/docs/cli/serve/

Stop Ionic Serve

Ctrl + C

Manage Cordova platform targets:

Synopsis:
$ ionic cordova platform [<action>] [<platform>]
Examples
$ ionic cordova platform
$ ionic cordova platform add ios
$ ionic cordova platform add android
$ ionic cordova platform rm android

Generate pipes, components, pages, directives, providers, and tabs 

(ionic-angular >= 3.0.0)

Synopsis:
$ ionic generate [<type>] [<name>]
Examples:
$ ionic generate
$ ionic generate component
$ ionic generate directive
$ ionic generate page
$ ionic generate pipe
$ ionic generate provider
$ ionic generate tabs
$ ionic generate component foo
$ ionic generate page Login
$ ionic generate pipe MyFilterPipe

Manage Cordova plugins:

Synopsis:
$ ionic cordova plugin [<action>] [<plugin>]
Examples:
$ ionic cordova plugin
$ ionic cordova plugin add cordova-plugin-inappbrowser@latest
$ ionic cordova plugin add phonegap-plugin-push --variable SENDER_ID=XXXXX
$ ionic cordova plugin rm cordova-plugin-camera
More: http://ionicframework.com/docs/cli/cordova/plugin/

Automatically create icon and splash screen resources

Synopsis:
$ ionic cordova resources [<platform>]
Examples:
$ ionic cordova resources
$ ionic cordova resources ios
$ ionic cordova resources android
More: http://ionicframework.com/docs/cli/cordova/resources/

Build (prepare + compile) an Ionic project for a given platform

Synopsis:
$ ionic cordova build [<platform>]
Examples:
$ ionic cordova build ios
$ ionic cordova build ios --prod --release
$ ionic cordova build android
$ ionic cordova build android --prod --release

Login with your Ionic ID:

Synatx: ionic login [<email>] [<password>]
Example: ionic login hello@example.com secret

Upload a new snapshot of your app:

Synopsis: $ ionic upload 
Examples:
$ ionic upload
$ ionic upload --deploy=dev
$ ionic upload --deploy=production --note="add menu entry" --metadata='{"custom_data":true}'

*****************************************************************

Ionic Publishing Part:** Click here

Remove Console:
$ ionic cordova plugin rm cordova-plugin-console

Production Release Builds: (To run or build your app for production, run)
ionic cordova build --release android

Release:
ionic cordova build --release android

*****************************************************************

Ionic Clear:

npm cache clear

npm cache clean -f

npm install npm -g

Ionic Update:

npm install -g cordova

npm install -g ionic@latest

Ionic Uninstall:
npm uninstall node

npm uninstall -g cordova
npm uninstall -g ionic

npm uninstall cordova ionic


*****************************************************************


More Details: http://ionicframework.com/docs/cli/

Ionic 3 - Installing Ionic Framework in Windows

Ionic Version 3

Step 1: Installing Node.js
Download the installer for Node.js 6 or greater and then proceed to install the Ionic CLI and Cordova for native app development:
Download Link: https://nodejs.org

Step 2: Installing Git SCM
It also a standard installation of windows. Download latest version and click next and proceed to install Git SCM(Source Code Management).
Download Link: https://git-scm.com/

Step 3: Apache Cordova Installation
Open a terminal window (Mac) or a command window (Windows), and install Cordova and Ionic:
npm install -g cordova

Step 4: Ionic Framework Installation
npm install -g ionic

Step 5: Check Your Version
To get installed version of ionic use below command.
ionic info


So far, you have set up Ionic Framework only. With this installation alone, we cannot build(create) Android(apk) and iOS(ipa) application file. By using Ionic framework, you can develop mobile applications, but you can’t build. To build Android and iOS, you must install corresponding SDK. For iOS SDK, we need Mac(This is explained in another post).
To install Android SDK , you must install Java before Android.

Step 6: Installing Java
The latest version of Java is JDK.
Download Link: http://www.oracle.com/

Step 7: Set Java location to the path.
After installing Java, you must include the installed Java location to the path.

To set Java path, right click on My Computer and then go to Properties. In Properties click.
Advanced System Settings ->Advanced->Environment Variables

In Environment Variables, if path variable doesn’t exist, create a new variable named as path or click Edit button close to path and give the installed Java location as value.

The Java installed location will look like below.
C:\Program Files\Java\jdk1.8.0_131\bin

Step 8: Installing Android
Download Android Studio Bundle using the below link(The file size is more than 2GB).
Download Link: https://developer.android.com/studio/index.html


After downloading click next and proceed to install Android.
That's all. Everything is set. Now you can develop Android application using Ionic Framework and build APK files.

***Ionic Installation -Done ***

Ionic 3 - Publishing your app Syntax (android)

Ionic Version 3

Build your app for testing:

ionic cordova run android
ionic cordova build android --verbose

PUBLISH::

1>>Remove console

ionic cordova plugin rm cordova-plugin-console


2>>Release:
This will generate a release build based on the settings in your config.xml

cordova build --release android


3>>Generate keystore for keytool: Let’s generate our private key using the keytool command that comes with the JDK. If this tool isn’t found, refer to the installation guide:

"C:/Program Files/Java/jre1.8.0_131/bin/"keytool -genkey -v -keystore your_app_name.keystore -alias your_app_name_key -keyalg RSA -keysize 2048 -validity 10000

You’ll first be prompted to create a password for the keystore. Then, answer the rest of the nice tools’s questions and when it’s all done, you should have a file called your_app_name.keystore created in the current directory.

Note: a.Make sure to save this file somewhere safe, if you lose it you won’t be able to submit updates to your app!. b.Make sure your build apk file and keystore file path are same.

4>>jarsigner: To sign the unsigned APK, run the jarsigner tool which is also included in the JDK:

"C:/Program Files/Java/jdk1.8.0_131/bin/"jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore your_app_name.keystore android-release-unsigned.apk your_app_name

5>>zipalign:
"C:/Android/android-sdk/tools/build-tools/26.0.0/"zipalign -v 4 android-release-unsigned.apk your_app_FINAL_name.apk

Now we have our final release binary called your_app_FINAL_name.apk and we can release this on the Google Play Store for all the world to enjoy!

**********Know Your App Ready for google play store**********


More Details:
http://ionicframework.com/docs/v1/guide/publishing.html

PHP API to SpamAssassin spamd Protocol

On the past few days Ive been working on a PHP spamd client, and I think it is somewhat usable for now since it already implements all of the protocol commands. This is release 0.1.0, so you might expect some API changes for the next versions. Feedback is always welcome. I tried to make this the most straight-forward as possible, abstracting some nasty things that happens under the hood, so you can do things like:

require('Spamassassin/Client.php');

require('Spamassassin/Client/Result.php');

 
$params = array
    "hostname" => "localhost",
    "port" => "783",
    "user" => "ppadron",
;
 

$sa = new Spamassassin\Client($params);
 
$message = file_get_contents'/path/to/message/file';
var_dump$sa->isSpam$message;

$result = $sa->getSpamReport($message);

echo "Message: ".$result->message . "\n";
echo "<br><br>Your Spam Score: ".$result->score;

Methods available

ping()
Pings the server to test the connection
getSpamReport($message)
Returns a detailed report if the message is spam or null if its ham
headers($message)
Processes the message and returns its headers (like X-Spam-Flag and X-Spam-Status)
check($message)
Checks if a message is spam with the CHECK protocol command
isSpam($message)
Shortcut to check() method that returns a boolean
process($message)
Processes the message, checks it for spam and returning its modified version
symbols($message)
Returns all rules matched by the message
learn($message, $learnType)
Uses SpamAssassin learning feature with TELL. Must be enabled on the server.
report($message)
Report message as spam, both local and remote
revoke($message)
Revokes a message previously reported as spam

How to change localhost to ip address in wamp server

Port Forwarding

In order to be reached by the world, you should tell your gateway where is your web server. All incoming request on port 80 should be redirected to your own private IP address. Even this process may vary; it really depends on your router. By the way, this is what you basically want to do: forward every request on port 80 to 192.168.1.27 (of course you must use your own IP address). But since the router’s web server already keeps the port 80 busy, here’s what you can do:

• Move the gateway’s web interface to another port;
• Move your web server to another port.

I’ll pick the last one, since it’s usually easier to do, and the first option is not always possible. So, let’s change the port: 

Just go to httpd.conf file, for ex. under WAMP environment its situated at:
File path: C:\wamp\bin\apache\apache2.2.22\conf\httpd.conf


New Version of WAMP uses these 2 lines:
Listen 0.0.0.0:80
Listen [::0]:80

Change it to:

Listen 0.0.0.0:8033
Listen [::0]:8033


Next go to edit ServerName localhost:80 to your requirement for ex.
Find  ServerName localhost:80

Change it to:

ServerName localhost:8033

Also find this line:
#   onlineoffline tag - don't remove
    Require local

Change it to:

#   onlineoffline tag - don't remove
    Require all granted



OLD Version:
Find 
Listen 80

Change it to:

Listen <port number>
for example:
Listen 8080
And restart the server. Now go to http://localhost:8080 and check that everything went as expected.

Restart Apache and its done !!

Now, you can access with your URL:




http://localhost:8033 or http://192.168.1.1:8033

How to Use Shortcode in your WordPress Sidebar Widgets (Text)

Just Add the following short code in your theme function.php

// Enable shortcodes in text widgets
add_filter('widget_text','do_shortcode');

Now check it ...

Don’t auto-p wrap shortcodes that stand alone use this like same
add_filter( 'widget_text', 'shortcode_unautop');