* Modifications to the browser, adding buttons, toolbars, bookmarks, icons, ….
* Access to local files
* Running music files or apply effects
* HotKeys gives conflicts in other browsers
* Access Hardware
* Comnicaciones extended HTTP and other protocols.
* Interaction with the Operating System
Anyway time to time 
Doodle.js is a library that allows us to easily work with the element <canvas /> and everything that entails. With a similar aesthetic to jQuery, drawing on the canvas that is <canvas /> is as simple as this:
<head>
<!--[if IE]><script type="text/javascript" src="http://explorercanvas.googlecode.com/svn/trunk/excanvas.js"></script><![endif]-->
<script src="./doodle-0.1.js" type="text/javascript"></script>
<script type="text/javascript">
function init() {
(function(oo) {
oo.canvas('#my_canvas');
oo.rect({x:25, y:25, width:50, height:50}).draw();
})($doodle);
};
</script>
</head>
<!--init() is called when the canvas is ready for us.-->
<body onload="javascript:init();">
<canvas id="my_canvas" width="600" height="400">
<p>Fallback: Canvas element is not supported in this browser!</p>
</canvas>
</body>
Do not miss some of the examples available on the homepage of the library:
Spiral multicolor
Rebounds multiple
Detect faces and is not just for Google Images. Now you can implement it on your website using Javascript and the canvas properties.
To do this we need to work only 2 files in our <head />
<script type="text/javascript" src="dat.js"></script> <script type="text/javascript" src="detector.js"></script> |
Dat.js the file shows how to detect and detector.js the file has the logic of the script can detect faces in any photo.
1 can detect faces in the photos, the process becomes slower depending on what we choose (of course).
face_detect_one( document.getElementById("myCanvas") ); |
face_detect_multi( document.getElementById("myCanvas") , progress_callback, result_callback ); function progress_callback( StepsCompleted, TotalSteps){ .... } |
The response functions that returns the values we obtain a rectangle that contains the person’s face.
var myCanvas = document.getElementById("mycanvas"); var result = face_detect_one( myCanvas ); if (result) draw_rect(result, myCanvas); function draw_rect(r, myCanvas){ var CanvasContext = myCanvas.getContext("2d"); CanvasContext.strokeRect( r.x, r.y, r.w, r.w ); } |
Link: via Percobaan
Javascript Image ComboBox is a jQuery plugin that allows our items <select/> have a life that until now could not have.
This is an extension that allows items of <select /> have an image to facilitate the selection of items within a list of options.
To do this using an attribute (not standard) element <option /> named icon which will indicate where we’ll take the image next to <option />
<select name="webmenu" id="webmenu" onchange="showValue(this.value)">
<option value="calendar" icon="icons/icon_calendar.gif">Calendar</option>
<option value="shopping_cart" icon="icons/icon_cart.gif">Shopping Cart</option>
<option value="cd" icon="icons/icon_cd.gif">CD</option>
<option value="email" selected="selected" icon="icons/icon_email.gif">Email</option>
<option value="faq" icon="icons/icon_faq.gif">FAQ</option>
<option value="games" icon="icons/icon_games.gif">Games</option>
<option value="music" icon="icons/icon_music.gif">Music</option>
<option value="phone" icon="icons/icon_phone.gif">Phone</option>
<option value="graph" icon="icons/icon_sales.gif">Graph</option>
<option value="secured" icon="icons/icon_secure.gif">Secured</option>
<option value="video" icon="icons/icon_video.gif">Video</option>
</select> |
After a line of JavaScript with this attribute will be housed within an image <select />
MSDropDown.init(); |
If you want to see a demo of how to be, you can take a look here.
Call accordion those dynamic elements of our Web pages that show an item to move the mouse (or click on it) to conceal the other components. This technique very convenient for displaying large amounts of information in a small space usually give a headache to match all the information.
With BySlideMenu never have problems. This is a MooTools plugin that allows us to make a wide variety of accordions, with very few lines of code.
The HTML code we use to generate our accordion will be based on a list of elements:
<ul id="pinclickmenu">
<li><img src="creditcards.jpg" /></li>
<li><img src="games.jpg" /></li>
<li><img src="computer.jpg" /></li>
<li><img src="eiffeltower.jpg" /></li>
<li><img src="electronic.jpg" /></li>
</ul> |
Each <li/> will be one of the elements that make up the accordion.
var pinclickmenu = new BySlideMenu('pinclickmenu', {pinMode: 'click'}); |
As we see fewer lines is impossible
You can see more demos and download the plugin from the project page.
Happy Programming!!! 
Validate of Username, Email Id, Phone No, Zip/Postal Code & URL In Javascript, C#.Net, VB.Net, JAVA & PHP !
1. Validate username: Validate alpha numeric values
2. Validate email addresses : example@domain.com
3. Validate Phone numbers: Validate US phone number eg: 123-456-7890
4. Validate Zip/Postal Codes: Validate US Zip/Postal Code eg: 12345-6789
5. Validate Domain Name eg: http://live.com
function is_valid_username(str_username) { var filter = /^([a-zA-Z\s0-9]*)$/; if (!filter.test(str_username)) { alert(’Wrong username format.’); } else { alert('Username format is ok.') } return false; } |
using System.Text.RegularExpressions; private void is_valid_username(string str_username) { Regex matchRegex = new Regex(@"^[a-zA-Z0-9_]{3,16}$"); MatchCollection matches = matchRegex.Matches(str_username); if(matches.Count==0) { Response.Write("Wrong username format."); // In Webserver //MessageBox.Show("Wrong username format."); //In Windows Form } else { Response.Write("Username format is ok."); // In Webserver //MessageBox.Show("Username format is ok."); //In Windows Form } } |
Imports System.Text.RegularExpressions Private Sub is_valid_username(ByVal str_username As String) Dim matchRegex As New Regex("^[a-zA-Z0-9_]{3,16}$") Dim matches As MatchCollection = matchRegex.Matches(str_username) If matches.Count = 0 Then Response.Write("Wrong username format.") ' In Webserver 'MessageBox.Show("Wrong username format."); 'In Windows Form Else Response.Write("Username format is ok.") ' In Webserver 'MessageBox.Show("Username format is ok."); 'In Windows Form End If End Sub |
import java.util.regex.*; public class is_valid_username { public static void main(String str_username) { Pattern p=Pattern.compile("^[A-Za-z0-9]+$"); Matcher m=p.matcher(str_username); boolean matchFound = m.matches(); if(matchFound) { System.out.println("Username format is ok."); } else { System.out.println("Wrong username format."); } } } |
Function is_valid_username($str_username) { if (preg_match('/^[a-z\d_]{5,20}$/i',$str_username)) { echo "Username format is ok."; } else { echo "Wrong username format."; } } |
function is_valid_email(str_email_id) { var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; if (!filter.test(str_email_id)) { alert(’Wrong email address format.’); } else { alert('Email address format is ok.') } return false; } |
using System.Text.RegularExpressions; private void is_valid_email(string email_id) { Regex matchRegex = new Regex(@"[a-zA-Z0-9_\-\.]+@[a-zA-Z0-9_\-\.]+\.[a-zA-Z]{2,5}"); MatchCollection matches = matchRegex.Matches(email_id); if(matches.Count==0) { Response.Write("Wrong email address format."); // In Webserver //MessageBox.Show("Wrong email address format."); //In Windows Form } else { Response.Write("Email address format is ok."); // In Webserver //MessageBox.Show("Email address format is ok."); //In Windows Form } } |
Imports System.Text.RegularExpressions Private Sub is_valid_email(ByVal email_id As String) Dim matchRegex As New Regex("[a-zA-Z0-9_\-\.]+@[a-zA-Z0-9_\-\.]+\.[a-zA-Z]{2,5}") Dim matches As MatchCollection = matchRegex.Matches(email_id) If matches.Count = 0 Then Response.Write("Wrong email address format.") ' In Webserver 'MessageBox.Show("Wrong email address format."); 'In Windows Form Else Response.Write("Email address format is ok.") ' In Webserver 'MessageBox.Show("Email address format is ok."); 'In Windows Form End If End Sub |
import java.util.regex.*; public class is_valid_email { public static void main(String str_email_id) { Pattern p=Pattern.compile("[a-zA-Z]*[0-9]*@[a-zA-Z]*.[a-zA-Z]*"); Matcher m=p.matcher(str_email_id); boolean matchFound = m.matches(); if(matchFound) { System.out.println("Email address format is ok."); } else { System.out.println("Wrong email address format."); } } } |
Function is_valid_email($email_id) { if (preg_match('/^[^0-9][a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)*[@][a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)*[.][a-zA-Z]{2,4}$/',$email_id)) { echo "Email address format is ok."; } else { echo "Wrong email address format."; } } |
function is_valid_phone_no(str_phone_no) { var filter = /^((\+?1-)?\d\d\d-)?\d\d\d-\d\d\d\d$/; if (!filter.test(str_phone_no)) { alert(’Wrong phone number format.’); } else { alert('Phone number format is ok.') } return false; } |
using System.Text.RegularExpressions; private void is_valid_phone_no(string str_phone_no) { Regex matchRegex = new Regex(@"\d{3}-\d{3}-\d{4}$"); MatchCollection matches = matchRegex.Matches(str_phone_no); if(matches.Count==0) { Response.Write("Wrong phone number format."); // In Webserver //MessageBox.Show("Wrong phone number format."); //In Windows Form } else { Response.Write("Phone number format is ok."); // In Webserver //MessageBox.Show("Phone number format is ok."); //In Windows Form } } |
Imports System.Text.RegularExpressions Private Sub is_valid_phone_no(ByVal str_phone_no As String) Dim matchRegex As New Regex("\d{3}-\d{3}-\d{4}$") Dim matches As MatchCollection = matchRegex.Matches(str_phone_no) If matches.Count = 0 Then Response.Write("Wrong phone number format.") ' In Webserver 'MessageBox.Show("Wrong phone number format."); 'In Windows Form Else Response.Write("Phone number format is ok.") ' In Webserver 'MessageBox.Show("Phone number format is ok."); 'In Windows Form End If End Sub |
import java.util.regex.*; public class is_valid_phone_no { public static void main(String str_phone_no) { Pattern p=Pattern.compile("^\\(?(\\d{3})\\)?[- ]?(\\d{3})[- ]?(\\d{4})$"); Matcher m=p.matcher(str_phone_no); boolean matchFound = m.matches(); if(matchFound) { System.out.println("Phone number format is ok."); } else { System.out.println("Wrong phone number format."); } } } |
Function is_valid_phone_no($str_phone_no) { if (preg_match('/\(?\d{3}\)?[-\s.]?\d{3}[-\s.]\d{4}/x',$str_phone_no)) { echo "Phone number format is ok."; } else { echo "Wrong phone number format."; } } |
function is_valid_zip_code(str_zip_code) { var filter = /^\d\d\d\d\d-\d\d\d\d$/; if (!filter.test(str_zip_code)) { alert(’Wrong Zip/Postal Code format.’); } else { alert('Zip/Postal Code format is ok.') } return false; } |
using System.Text.RegularExpressions; private void is_valid_zip_code(string str_zip_code) { Regex matchRegex = new Regex(@"\d{5}-\d{4}$"); MatchCollection matches = matchRegex.Matches(str_zip_code); if(matches.Count==0) { Response.Write("Wrong Zip/Postal Code format."); // In Webserver //MessageBox.Show("Wrong Zip/Postal Code format."); //In Windows Form } else { Response.Write("Zip/Postal Code format is ok."); // In Webserver //MessageBox.Show("Zip/Postal Code format is ok."); //In Windows Form } } |
Imports System.Text.RegularExpressions Private Sub is_valid_zip_code(ByVal str_zip_code As String) Dim matchRegex As New Regex("\d{5}-\d{4}$") Dim matches As MatchCollection = matchRegex.Matches(str_zip_code) If matches.Count = 0 Then Response.Write("Wrong Zip/Postal Code format.") ' In Webserver 'MessageBox.Show("Wrong Zip/Postal Code format."); 'In Windows Form Else Response.Write("Zip/Postal Code format is ok.") ' In Webserver 'MessageBox.Show("Zip/Postal Code format is ok."); 'In Windows Form End If End Sub |
import java.util.regex.*; public class is_valid_zip_code { public static void main(String str_zip_code) { Pattern p=Pattern.compile("^(\\d{5})[- ]?(\\d{4})$"); Matcher m=p.matcher(str_zip_code); boolean matchFound = m.matches(); if(matchFound) { System.out.println("Zip/Postal Code format is ok."); } else { System.out.println("Wrong Zip/Postal Code format."); } } } |
Function is_valid_zip_code($str_zip_code) { if (preg_match('/^([0-9]{5})(-[0-9]{4})?$/i',$str_zip_code)) { echo "Zip/Postal Code format is ok."; } else { echo "Wrong Zip/Postal Code format."; } } |
function is_valid_url(str_url) { var filter = /^(ht|f)tps?:\/\/[a-z0-9-\.]+\.[a-z]{2,4}\/?([^\s<>\#%"\,\{\}\\|\\\^\[\]`]+)?$/ if (!filter.test(str_url)) { alert(’Wrong URL format.’); } else { alert('URL format is ok.') } return false; } |
using System.Text.RegularExpressions; private void is_valid_url(string str_url) { Regex matchRegex = new Regex(@"(http|https)://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?"); MatchCollection matches = matchRegex.Matches(str_url); if(matches.Count==0) { Response.Write("Wrong URL format."); // In Webserver //MessageBox.Show("Wrong URL format."); //In Windows Form } else { Response.Write("URL format is ok."); // In Webserver //MessageBox.Show("URL format is ok."); //In Windows Form } } |
Imports System.Text.RegularExpressions Private Sub is_valid_url(ByVal str_url As String) Dim matchRegex As New Regex("(http|https)://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?") Dim matches As MatchCollection = matchRegex.Matches(str_url) If matches.Count = 0 Then Response.Write("Wrong URL format.") ' In Webserver 'MessageBox.Show("Wrong URL format."); 'In Windows Form Else Response.Write("URL format is ok.") ' In Webserver 'MessageBox.Show("URL format is ok."); 'In Windows Form End If End Sub |
import java.util.regex.*; public class is_valid_url { public static void main(String str_url) { Pattern p=Pattern.compile("(http|https)://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?"); Matcher m=p.matcher(str_url); boolean matchFound = m.matches(); if(matchFound) { System.out.println("URL format is ok."); } else { System.out.println("Wrong URL format."); } } } |
Function is_valid_url($str_url) { if (preg_match('/^([0-9]{5})(-[0-9]{4})?$/i',$str_url)) { echo "URL format is ok."; } else { echo "Wrong URL format."; } } |
Mostly Web Programmers Multilanguage in ASP.NET is by using Localization & Resource rules. But this rule cant use with HTML, PHP etc. Now I’m changing to new rules with Google AJAX Language API. It is very useful for programmers. Click here to read about Localization & Resource
Advantage:
1: Reduce programming time
2. Reduce file size, In Localization & Resource rules, we need resource files by each language
3. No need to find meaning of unknown language for creating site
4. Only one language to store in XML or..5. No need C# & VB.NET.
Disadvantage:
1. Need Internet connection for connecting to Google AJAX Language API’s Script
Click here to read about Google Language AJAX API.
I have a sample program as below. I Hope you will understood.
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("language", "1");
function fnTrans(strTransText,strTransField, strTransFLang, strTransTLang)
{
// Translation
google.language.translate(strTransText, strTransFLang, strTransTLang, function(result) {
var strcontainer = document.getElementById(strTransField);
strcontainer.innerHTML = result.translation ;
});
}
function initialize(strToTxtBox, strFromTxtBox) {
// Translate English to German
strFLang = 'en' //English
strTLang = 'de' //German
var strText = document.getElementById(strFromTxtBox).innerHTML; //Get Lable Name
fnTrans(strText,strToTxtBox, strFLang,strTLang)
}
function fnhi()
{
initialize('ToLableName_FN', 'FrmLableName_FN' ); // First Name
initialize('ToLableName_LN', 'FrmLableName_LN' ); // Last Name
}
</script>
</head>
<body onload="fnhi()">
<label id="FrmLableName_FN" >First Name</label>
<br />
<label id="ToLableName_FN"></label>
<input type="text" name="txtFname" />
</br>
</br>
<label id="FrmLableName_LN" >Last Name</label>
<br />
<label id="ToLableName_LN"></label>
<input type="text" name="txtFname" /> |
Here Sample code of Ajax based search engine with PHP and XML
This is the Javascript Code :
/* <--------------------------> */ /* XMLHTTPRequest Enable */ /* <--------------------------> */ function createObject() { var request_type; var browser = navigator.appName; if(browser == "Microsoft Internet Explorer"){ request_type = new ActiveXObject("Microsoft.XMLHTTP"); }else{ request_type = new XMLHttpRequest(); } return request_type; } var http = createObject(); /* <--------------------------> */ /* SEARCH */ /* <--------------------------> */ function fnSearchName() { txtInput=encodeURI(document.getElementById('txtInput').value); document.getElementById('divmsg').style.display = "block"; document.getElementById('divmsg').innerHTML = "Searching for <strong>" + txtInput+"</strong>"; // Set te random number to add to URL request nocache = Math.random(); http.open('get', 'php_Search.php?name='+txtInput+'&nocache = '+nocache); http.onreadystatechange = fnSearchNameReply; http.send(null); } function fnSearchNameReply() { var response = http.responseText; document.getElementById('divResult').innerHTML=response; } |
This is the PHP Code :
load("NameList.xml"); $x=$xmlDoc->getElementsByTagName('NAME'); for ($i=0; $i<=$x->length-1; $i++) { //Process only element nodes if ($x->item($i)->nodeType==1) { if ($x->item($i)->childNodes->item(0)->nodeValue == $q) { $y=($x->item($i)->parentNode); } } } $cd=($y->childNodes); for ($i=0;$i<$cd->length;$i++) { //Process only element nodes if ($cd->item($i)->nodeType==1) { echo($cd->item($i)->nodeName); echo(": "); echo($cd->item($i)->childNodes->item(0)->nodeValue); echo(""); } } ?> |
Name: Venu Thomas
Location: Cochin, Kerala, India
Bio: I am Venu Thomas, Software Engineer, Pro-Blogger, Mac and Windows User & Web Addicted. I live in Cochin, Kerala, INDIA. I have done programs in ASP.Net, C#, VB.Net, Java, Javascript, PHP, ASP, SQL, VC++, VB , ORACLE, AppleScript, ect ..
Demo
Download Code
