Google Maps traffic layer

<style type=”text/css”>
html { height: 100%;}
body { height: 100%; margin: 0px; padding: 0px; }
#map { height: 600px; width: 600px; }
</style>

/* script call here

http://maps.google.com/maps/api/js?sensor=false&#8221; type=”text/javascript”

*/
/*script start here*/
google.maps.event.addDomListener( window, ‘load’, init );

function init() {
var options = {
zoom: 7,
center: new google.maps.LatLng( 32.715738, -117.161084 ),
mapTypeId: google.maps.MapTypeId.ROADMAP,
overviewMapControl: false
};
var map = new google.maps.Map( document.getElementById( “map” ), options );
var traffic = new google.maps.TrafficLayer();
traffic.setMap( map );

google.maps.event.addDomListener(
document.getElementById( ‘b’ ),
‘click’,
function() {
traffic.setMap( traffic.getMap() === null ? map : null )
} );
}
/*script end here*/

Date formats in php language

<?php
// Assuming today is March 10th, 2001, 5:16:18 pm, and that we are in the
// Mountain Standard Time (MST) Time Zone

$today = date(“F j, Y, g:i a”);                 // March 10, 2001, 5:16 pm
$today = date(“m.d.y”);                         // 03.10.01
$today = date(“j, n, Y”);                       // 10, 3, 2001
$today = date(“Ymd”);                           // 20010310
$today = date(‘h-i-s, j-m-y, it is w Day’);     // 05-16-18, 10-03-01, 1631 1618 6 Satpm01
$today = date(‘\i\t \i\s \t\h\e jS \d\a\y.’);   // it is the 10th day.
$today = date(“D M j G:i:s T Y”);               // Sat Mar 10 17:16:18 MST 2001
$today = date(‘H:m:s \m \i\s\ \m\o\n\t\h’);     // 17:03:18 m is month
$today = date(“H:i:s”);                         // 17:16:18
$today = date(“Y-m-d H:i:s”);                   // 2001-03-10 17:16:18 (the MySQL DATETIME format)
?>

How to create a block to show a digital clock?

function show5(){
if (!document.layers&&!document.all&&!document.getElementById)
return
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
if (hours”+hours+”:”+minutes+”:”+seconds+””
if (document.layers){
document.layers.liveclock.document.write(myclock)
document.layers.liveclock.document.close()
}
else if (document.all)
liveclock.innerHTML=myclock
else if (document.getElementById)
document.getElementById(“liveclock”).innerHTML=myclock
setTimeout(“show5()”,1000)
}
$(document).ready(function(){ show5(); });
//–>

<span id=”liveclock” style=”position:relative;left:0;top:0;”></span>

HTML5 Validations

Radio Button

<input type=”radio” name=”radio” value=”avi” required=”required”>

textbox

<input type=”radio” name=”test” id=”input” required value=”1″ />

<input id=”name” name=”name” value=”” aria-describedby=”name-format” required aria-required=”true” pattern=”[A-Za-z-0-9]+\s[A-Za-z-‘0-9]+”  title=”firstname lastname”>

Checkbox

<input type=”checkbox” required name=”terms”>

textarea 

<textarea rows=”4″ cols=”50″ name=”comment” required></textarea>

Website

<input type=”url” name=”website” required>

Email Address

<input type=”email” name=”email” required placeholder=”Enter a valid email address”>

Age

<input type=”number” size=”6″ name=”age” min=”18″ max=”99″ value=”21″>

Satisfaction

<input type=”range” size=”2″ name=”satisfaction” min=”1″ max=”5″ value=”3″>

date

<input type=”date” name=”date” required>

Basic pagination example in PHP with MySQL

Below specified basic pagination in PHP with MySQL

<?php
$cou_per_page=10;
mysql_connect(‘localhost’,’root’,”);
mysql_select_db(‘pagination’);
if (isset($_GET[“page”])) { $page = $_GET[“page”]; } else { $page=1; };
$start_page = ($page-1) * $cou_per_page;
$sql = “SELECT * FROM page_table LIMIT $start_page, $cou_per_page”;
$rs_result = mysql_query ($sql); //run the query
?>
<table>
<tr><td>Name</td><td>Address</td></tr>
<?php
while ($row = mysql_fetch_assoc($rs_result)) {
?>
<tr>
<td><?php echo $row[‘page_name’]; ?></td>
<td><?php echo $row[‘page_add’]; ?></td>
</tr>
<?php
};
?>
</table>
<?php
$sql = “SELECT * FROM page_table”;
$rs_result = mysql_query($sql); //run the query
$total_records = mysql_num_rows($rs_result); //count number of records
$total_pages = ceil($total_records / $cou_per_page);

echo “<a href=’?page=1′>”.’|<‘.”</a> “; // Goto 1st page

for ($i=1; $i<=$total_pages; $i++) {
echo “<a href=’?page=”.$i.”‘>”.$i.”</a> “;
};
echo “<a href=’?page=$total_pages’>”.’>|’.”</a> “; // Goto last page
?>

Install drupal through command line step by step

Download and extract files

$  wget https://www.drupal.org/files/projects/drupal-x.x.tar.gz
$  tar -zxvf drupal-x.x.tar.gz

Move to root folder

$  mv drupal-x.x /var/www/html

Create the configuration file and grant permissions

In the sites/default directory, copy the default.settings.php file and rename the copied file to settings.php.

$ cp sites/default/default.settings.php sites/default/settings.php

Give the web server write privileges (666 or u=rw,g=rw,o=rw) to the configuration file.

$ chmod a+w sites/default/settings.php

Give the web server write privileges to the sites/default directory.

$ chmod a+w sites/default

Create the Drupal database

To complete the installation, you must create an empty database and a user with full access to the newly created database for Drupal to use. You can do this by command line, or through phpMyAdmin or another database client.

$ mysqladmin -u username -p create databasename

Where ‘username’ is a MySQL user which has the CREATE and GRANT privileges. MySQL will prompt for the ‘username’ database password. Next you must set the access database rights. Log in to MySQL:

$ mysql -u username -p

$ GRANT SELECT, INSERT, UPDATE, DELETE, CREATE, DROP, INDEX, ALTER, CREATE TEMPORARY TABLES, LOCK TABLES ON databasename.* TO ‘username’@’localhost’ IDENTIFIED BY ‘password’;

Run the installation script

Point your browser to the base URL of your website

http://www.example.com

Create an .info.yml file in Drupal 8

You create the .info.yml file in the root of your theme folder. The folder should have the same name as the .info.yml file. So if your theme is named “Fluffiness” then the folder is named “fluffiness/” and the .info.yml file is named “fluffiness/fluffiness.info.yml“. If the file is present your theme will be visible in your website at Manage > Appearance (http://example.com/admin/appearance).

Example

name: Fluffiness (Required)
type: theme (Required)
description: ‘A cuddly theme that offers extra fluffiness.’ (Required)
package: Custom
core: 8.x (Required)
libraries:
– fluffiness/global-styling
stylesheets-remove:
– ‘@classy/css/layout.css’
– core/assets/vendor/normalize-css/normalize.css
regions:
header: Header
content: Content
sidebar_first: ‘Sidebar first’
footer: Footer

.info files are now .info.yml files in Drupal 8

Drupal 7

configure = admin/config/system/actions

Drupal 8

configure: action.admin

Drupal 7 ( theme_name.info )

name = Bartik
description = A flexible, recolorable theme with many regions and a responsive, mobile-first layout.
package = Core
version = VERSION
core = 7.x

; Stylesheets
stylesheets[all][] = css/layout.css
stylesheets[all][] = css/style.css
stylesheets[all][] = css/colors.css
stylesheets[print][] = css/print.css

; Regions
regions[header] = Header
regions[help] = Help
regions[page_top] = Page top
regions[page_bottom] = Page bottom
regions[highlighted] = Highlighted

regions[featured] = Featured
regions[content] = Content
regions[sidebar_first] = Sidebar first
regions[sidebar_second] = Sidebar second

regions[triptych_first] = Triptych first
regions[triptych_middle] = Triptych middle
regions[triptych_last] = Triptych last

regions[footer_firstcolumn] = Footer first column
regions[footer_secondcolumn] = Footer second column
regions[footer_thirdcolumn] = Footer third column
regions[footer_fourthcolumn] = Footer fourth column
regions[footer] = Footer

; Settings
settings[shortcut_module_link] = 0

Drupal 8( theme_name.info.yml )

name: Bartik
type: theme
description: ‘A flexible, recolorable theme with many regions and a responsive, mobile-first layout.’
package: Core
version: VERSION
core: 8.x

# Stylesheets
stylesheets:
all:
– css/layout.css
– css/style.css
– css/colors.css
print:
– css/print.css

# Regions
regions:
header: Header
help: Help
page_top: ‘Page top’
page_bottom: ‘Page bottom’
highlighted: Highlighted
featured: Featured
content: Content
sidebar_first: ‘Sidebar first’
sidebar_second: ‘Sidebar second’
triptych_first: ‘Triptych first’
triptych_middle: ‘Triptych middle’
triptych_last: ‘Triptych last’
footer_firstcolumn: ‘Footer first column’
footer_secondcolumn: ‘Footer second column’
footer_thirdcolumn: ‘Footer third column’
footer_fourthcolumn: ‘Footer fourth column’
footer: Footer

# Settings
settings:
shortcut_module_link: ‘0’

jQuery the noConflict() Method

jQuery and Other JavaScript Frameworks
As you already know; jQuery uses the $ sign as a shortcut for jQuery.

There are many other popular JavaScript frameworks like: Angular, Backbone, Ember, Knockout, and more.

What if other JavaScript frameworks also use the $ sign as a shortcut?

If two different frameworks are using the same shortcut, one of them might stop working.

The jQuery team have already thought about this, and implemented the noConflict() method.

The jQuery noConflict() Method
The noConflict() method releases the hold on the $ shortcut identifier, so that other scripts can use it.

Examples:

$.noConflict();
jQuery(document).ready(function(){
jQuery(“button”).click(function(){
jQuery(“p”).text(“jQuery is still working!”);
});
});

var jq = $.noConflict();
jq(document).ready(function(){
jq(“button”).click(function(){
jq(“p”).text(“jQuery is still working!”);
});
});

jQuery Set Content and Attributes

  1. text() – Sets or returns the text content of selected elements
  2. html() – Sets or returns the content of selected elements (including HTML markup)
  3. val() – Sets or returns the value of form fields

$(“#btn1”).click(function(){
$(“#test1”).text(“Hello world!”);
});
$(“#btn2”).click(function(){
$(“#test2”).html(“<b>Hello world!</b>”);
});
$(“#btn3”).click(function(){
$(“#test3”).val(“Dolly Duck”);
});

The jQuery attr() method is also used to set/change attribute values.

$(“button”).click(function(){
$(“#w3s”).attr(“href”, “http://www.w3schools.com/jquery&#8221;);
});

$(“#w3s”).attr({
“href” : “http://www.w3schools.com/jquery&#8221;,
“title” : “W3Schools jQuery Tutorial”
});