Saturday 5 October 2013

How to install ruby in rails alongside wampserver

Twitter Demo [PHP and javascript]

Twitter Demo [PHP and javascript]

htttp://dev.artoonsolutions.com/demo/twitter
htttp://dev.artoonsolutions.com/demo/twitter/javascript.php // for javascript reference

** inside this folder you will find javscript.php file this file help you to fetch some unauthorized data from twitter server
** Othere files inside in this folder for php oauth twitter referrence.

NOTE : [ Twitter still not providing oauth with javascript, so please do not waste time to find this kind of googling.]

STEPS :
1) Go to developer.twitter.com and create your own application.
2) At creation step of twitter you must have to provide callback url. [currently we have callback.php]
3) After application created you have to put application and secret key inside the code.

Facebook php demo and facebook javascript demo

Facebook php demo and facebook javascript demo

Please read first from this URL : http://thinkdiff.net/facebook/php-sdk-3-0-graph-api-base-facebook-connect-tutorial/

Demo code is here :
http://dev.artoonsolutions.com/demo/facebook

1) Go to developer.facebook.com
2) Then create your facebook application with demo URL detail.
3) Grab your application key and secret key from application that you created. and put into fbmain.php file.
4) You can also test with javascript authentication detail. Look at url
http://dev.artoonso lutions.com/demo/facebook/javascript.php

NOTE : [Facebook is providing javscript and php Oauth 2.0 support.]

linkedin php demo and linkedin javascript demo

linkedin php demo and also linkedin javascript demo


Login and Register Script with Linkedin API and Javascript

Login and Register Script with Linkedin API and Javascript

Linkedin is the topmost social network for professionals. In this article I have explained how to use the Linkedin JavaScript API to access and use the user details from Linkedin. Linkedin provides a very beautiful API for developers to fetch the user details. We can use these details for a number of purpose on our web pages like login/register using Linkedin, showing user details from Linkedin, form autofills etc.

For registering the new application, go to Linkedin developers Page. Here you will get a from to fill, fill it as follows:



Now you will get the API key and secret for your application:

Adding Linkedin framework to page

<script type="text/javascript" src="http://platform.linkedin.com/in.js">
 api_key: lg2s1jdk6lfv //your application key
 onLoad: onLinkedInLoad //function to be called on JS framework load (optional)
 authorize: true   //true will detect if the user is logged in already (optional)
</script>

Add a Sign in with LinkedIn button

Adding Linkedin JS framework will give access to various user variables on our page. We can access these variables as <?js= firstName ?>. The following code will add the 'Linkedin Login' button on our page. After successful login, the button will be replaced by the message written in the script and the JS variables will be replaced by there actual values.
<script type="in/Login">
 Welcome, <?js= firstName ?> <?js= lastName ?>.
 </script>

Autofill Login form LinkedIn

Linkedin can fill details in the login/register form on our web pages. For this it provides a specific script tag of "IN/Login" type. See the following code:
<script type="IN/Login"> 
 <form method="post" action="register.html">
 <table>
  <tr>
   <td>First Name:</td><td><input type="text" name="first_name" value="<?js= firstName ?>" /></td>
  </tr>
  <tr>
   <td>Last Name:</td><td><input type="text" name="last_name" value="<?js= lastName ?>" /></td>
  </tr>
  <tr>
   <td>Password:</td><td><input type="password" name="pwd" value="" /></td>
  </tr>
  <tr>
   <td colspan="2"><input type="submit" value="Register" /></td>
  </tr>
 </table>
 </form>
</script>

Using Callback on LinkedIn JS load

<script type="text/javascript">
// 1. Runs when the JavaScript framework is loaded
function onLinkedInLoad() {
 IN.Event.on(IN, "auth", onLinkedInAuth);
}

// 2. Runs when the viewer has authenticated
function onLinkedInAuth() {
 IN.API.Profile("me").result(displayProfiles);
}

// 3. Runs when the Profile() API call returns successfully
// Insert user variables in the HTML
function displayProfiles(profiles) {
 member = profiles.values[0];
 document.getElementById('demo').style.display = 'block';
 var profile = "<p class='name' id=\"" + member.id + "\">" +  member.firstName + " " + member.lastName + "</p>";
 profile += '<p class="headline">'+member.headline+'</p>';
 document.getElementById("profiles").innerHTML = profile;
 document.getElementById("picture").innerHTML = '<img src="'+member.pictureUrl+'" class="image" />';
}
</script>

Complete Script

<html>
<head>
<title>WebSPeaks.in | LinkedIn API Usage<title>
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
 api_key: lg2s1jdk6lfv
 onLoad: onLinkedInLoad
 authorize: true
</script>
<script type="text/javascript">
// 1. Runs when the JavaScript framework is loaded
function onLinkedInLoad() {
 IN.Event.on(IN, "auth", onLinkedInAuth);
}

// 2. Runs when the viewer has authenticated
function onLinkedInAuth() {
 IN.API.Profile("me").result(displayProfiles);
}

// 3. Runs when the Profile() API call returns successfully
function displayProfiles(profiles) {
 member = profiles.values[0];
 document.getElementById('demo').style.display = 'block';
 var profile = "<p class='name' id=\"" + member.id + "\">" +  member.firstName + " " + member.lastName + "</p>";
 profile += '<p class="headline">'+member.headline+'</p>';
 document.getElementById("profiles").innerHTML = profile;
 document.getElementById("picture").innerHTML = '<img src="'+member.pictureUrl+'" class="image" />';
}
</script>
</head>
<body>
<div id="main">
 <h4>JS template method</h4>
 <script type="in/Login">
  <div class="data">
   <div class="picture">
    <img alt="<?js= headline ?>" src="<?js= pictureUrl ?>" class="image" />
   </div>
   <div class="profiles">
    <p class='name'><?js= firstName ?> <?js= lastName ?></p>
    <p class="headline"><?js= headline ?></p>
   </div>
  </div>
 </script>

 <div id="demo">
  <h4>Dom insertion method</h4>
  <div class="data">
   <div id="picture" class="picture"></div>
   <div id="profiles" class="profiles"></div>
  </div>
 </div>

 <div id="form">
  <h4>Register/Login Form Autofill</h4>
  <script type="IN/Login"> 
   <form method="post">
   <input type="hidden" name="linkedin-id" value="<?js= id ?>" />
   <table>
    <tr>
     <td>First Name:</td><td><input type="text" name="first_name" value="<?js= firstName ?>" /></td>
    </tr>
    <tr>
     <td>Last Name:</td><td><input type="text" name="last_name" value="<?js= lastName ?>" /></td>
    </tr>
    <tr>
     <td>Password:</td><td><input type="password" name="pwd" value="" /></td>
    </tr>
    <tr>
     <td colspan="2"><input type="submit" value="Register" /></td>
    </tr>
   </table>
   </form>
  </script>
 </div>
</div>
</body>
</html>

Register/login.php

<?php
$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$pwd = $_POST['pwd'];
$linkedin_id = $_POST['linkedin-id'];

//write mysql insert logic dor registration
//or
//write mysql logic for login
?>

CSS Code

body {
 font-family:Helvetica,"Nimbus Sans L",sans-serif;
}
#main{
    -moz-box-align: center;
    -moz-box-orient: vertical;
    border: 0.5em solid #E3E9FF;
    display: block;
    height: auto;
    margin: auto;
    padding: 10px;
    text-overflow: ellipsis;
    width: 350px;
    word-wrap: break-word;
}
.data{
 background-color: #e3e3e3;
    height: 88px;
    padding: 5px;
 margin-bottom:20px;
}
.image{
 border: 1px solid #ffffff;
 padding:3px;
}
.picture{
 float:left;
 width:90px;
}
.profiles{
 float:left;
 width:225px;
 padding: 0 0 0 10px;
}
p.name{
 color:#069;
 font-weight:bold;
 margin:0;
}
p.headline{
 font-size:12px;
}
#demo{
 display:none;
}

die ajax request - best habit for auto search

die ajax request - best habit for auto search

var ajax_request;
function do_something()
{
if(typeof ajax_request !== "undefined")
ajax_request.abort();

ajax_request = $.ajax({
-----------------
-----------
--

simple login page using PHP and MongoDB.

simple login page using PHP and MongoDB.


Installation

Windows
http://docs.mongodb.org/manual/tutorial/install-mongodb-on-windows/

You can download PHP mongo drive/extension dll file from following URL https://github.com/mongodb/mongo-php-driver/downloads. Copy php_mongo.dll file into your PHP extension directory

Linux & Mac
http://docs.mongodb.org/manual/tutorial/install-mongodb-on-ubuntu/

http://docs.mongodb.org/manual/tutorial/install-mongodb-on-ubuntu/

Connecting into MongoDB
PHP code connecting with out Authentication.
<?php
$mongo = new Mongo();
$db = $mongo->selectDB(“test”);
?>

With Authentication
<?php
$mongo = new Mongo(“mongodb://{$username}:{$password}@{$host}”);
$db = $mongo->selectDB(“test”);
?>

By default MongoDB contains sample database called “test”.

Creating New Database
$db = $mongo->Database_Name;

Note: Technically, you don't need to manually create databases in MongoDB due to its schemaless "lazy" way of creating databases.

Queries
PHP code to get MongoDB databases.
//Get list of databases
$mongo->admin->command(array(“listDatabases” => 1));
//Get list of Collections in test db
$db->listCollections();

Mongo Shell/Terminal/Command Prompt
db.listDatabases
db.test.showCollections

Create Collection(table)
You can created a collection/table but executing following code.
$db->createCollection(“people”,false);

Note: here false referred to unlimitted size, if you give true you have to mention the size of maximum.

Mongo Shell
db.createCollection(“people”,false);

Insert Record
Insert records int MongoDB.
<?php
$people = $db->people;
$insert = array(“user” => “demo@9lessons.info”, “password” => md5(“demo_password”));
$db->insert($insert);
?>

Mongo Shell:
db.people.insert({user:”user_name”,password:”password”});

Update Records
Update records into MongoDB
<?php
$update = array(“$set” => array(“user” => “demo@9lessons.info”));
$where = array(“password” => “password”);
$people->update($where,$update);
?>

Mongo Shell:
db.people.update({password:”password”},{$set : {user:”demo@demo.com”}});

HTML Code
<form action="index.php" method="POST">
Email:
<input type="text" id="usr_email" name="usr_email"  />
Password:
<input type="password" id="usr_password" name="usr_password" />  
<input  name="submitForm" id="submitForm" type="submit" value="Login" />
</form>

PHP Code
<?php
$succss = "";
if(isset($_POST) and $_POST['submitForm'] == "Login" )
{
$usr_email = mysql_escape_string($_POST['usr_email']);
$usr_password = mysql_escape_string($_POST['usr_password']);
$error = array();
// Email Validation
if(empty($usr_email) or !filter_var($usr_email,FILTER_SANITIZE_EMAIL))
{
$error[] = "Empty or invalid email address";
}
if(empty($usr_password)){
$error[] = "Enter your password";
}
if(count($error) == 0){
$con = new Mongo();
if($con){
// Select Database
$db = $con->test;
// Select Collection
$people = $db->people;
$qry = array("user" => $usr_email,"password" => md5($usr_password));
$result = $people->findOne($qry);
if($result){
$success = "You are successully loggedIn";
// Rest of code up to you....
}
} else {
die("Mongo DB not installed");
}
}
}
?>