Tutorial Online: javascript

Showing posts with label javascript. Show all posts

Tuesday, March 10, 2015

Introducing JavaScript Support for the Drive API

Did you know you can write a complete Google Drive App with JavaScript that runs completely in the web browser? You can! Your browser-based application, including Chrome extensions, can take advantage of our client library, or just use CORS requests to the API.

Your app can support all the functionality of the Drive API, including uploading files, downloading files, tracking changes, listing files and managing revisions. Also you can take advantage of our user interface components that make opening and sharing files easy.

We are really keen to offer first-class support to browser-based applications, so we have added JavaScript snippets to all our API reference documentation. Please let us know how we are doing by posting to Stack Overflow.

Want to try it out? Check out our Javascript Quickstart Guide, which helps you get your application up and running in five minutes or so.

Ali Afshar profile | twitter

Tech Lead, Google Drive Developer Relations. As an eternal open source advocate, he contributes to a number of open source applications, and is the author of the PIDA Python IDE. Once an intensive care physician, he has a special interest in all aspects of technology for healthcare

Simple Login and Sign Up using Facebook Javascript SDK

Filling Sign Up and Login form were part of every web application nowadays. Users feel it hard to fill the sign up form again with same information. With Facebook API you can easily collect the basic user information needed for sign up.

This is the simplest working example for facebook based sign up.

This tutorial uses Facebook Javascript SDK v2.2

Demo| Download

Needables

Facebook SDK
Facebook Application ID

You can create your application for free from here https://developers.facebook.com/apps

App ID (Application ID) can be obtained from the facebook application page, as show in above screenshot.

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>

Signup Html Form

      <form class="form-signin" role="form">
            <div id="status"></div>
        <h2 class="form-signin-heading">User Registration</h2>
        
        <label for="inputFname" class="sr-only">First Name</label>
            <input type="text" id="inputFname" class="form-control" placeholder="First Name" required autofocus>
        
        <label for="inputLname" class="sr-only">First Name</label>
            <input type="text" id="inputLname" class="form-control" placeholder="Last Name" required >
            
        <label for="inputEmail" class="sr-only">Email address</label>
        <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required >
        
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
        <div class="checkbox">
          <label>
            <input type="checkbox" value="remember-me"> Remember me
          </label>
        </div>
        
        <button class="btn btn-sm btn-primary btn-block" type="submit">Sign Up</button> <button class="btn btn-sm btn-primary btn-block" onclick="_login();" type="submit">Sign Up using Facebook</button>
      </form>

Javascript

    <script>
  // Load the SDK asynchronously
  (function(thisdocument, scriptelement, id) {
    var js, fjs = thisdocument.getElementsByTagName(scriptelement)[0];
    if (thisdocument.getElementById(id)) return;
    
    js = thisdocument.createElement(scriptelement); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js"; //you can use 
    fjs.parentNode.insertBefore(js, fjs);
  }(document, script, facebook-jssdk));
    
  window.fbAsyncInit = function() {
  FB.init({
    appId      : 1449392918617564, //Your APP ID
    cookie     : true,  // enable cookies to allow the server to access 
                        // the session
    xfbml      : true,  // parse social plugins on this page
    version    : v2.1 // use version 2.1
  });

  // These three cases are handled in the callback function.
  FB.getLoginStatus(function(response) {
    statusChangeCallback(response);
  });

  };
    
  // This is called with the results from from FB.getLoginStatus().
  function statusChangeCallback(response) {
    if (response.status === connected) {
      // Logged into your app and Facebook.
      _i();
    } else if (response.status === not_authorized) {
      // The person is logged into Facebook, but not your app.
      document.getElementById(status).innerHTML = Please log  +
        into this app.;
    }
  }  
  
  function _login() {
    FB.login(function(response) {
       // handle the response
       if(response.status===connected) {
        _i();
       }
     }, {scope: public_profile,email});
 }
 
 function _i(){
     FB.api(/me, function(response) {
        document.getElementById("inputFname").value = response.first_name;
        document.getElementById("inputLname").value = response.last_name;
        document.getElementById("inputEmail").value = response.email;
    });
 }

</script>