Friday, March 21, 2014

Load image url and choose like Google photos using php & jquery

we would be fascinated by using Google to upload photos while mean time we could grab the image by using JQuery and with some inbuilt functions in PHP.I have given a simple script to load the image from the given url and handled some Error occurings with the help of inbuilt functions.Any way You must need minimum PHP version to test this sample because the built in function i have used must have 5.3.2 version minimum as per Docs of PHP.

A final capture from my localhost to grab image from url!
have a look at my code at codepen widget!
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#contentbox").keyup(function()
{
var content=$(this).val();
var urlRegex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;

var url= content.match(urlRegex);

if(url.length>0)
{
   $("#flash").html('<img src="http://www.llandudnohostel.co.uk/assets/images/ajax-loader.gif">');
   $("#linkbox").slideDown('show');
   $.get("i.php?url="+url,function(data)
     {
       var expression=/https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/gi;
       var regex = new RegExp(expression);
       var t = data;
       if (t.match(regex) )
         {
          document.getElementById("linkbox").innerHTML = ''; 
          $("#linkbox").html("<img src='"+data+"' class='img'/>"); 
         }
  else
{
$("#linkbox").html("<h3><span class=\"error\">"+data+"</span></h3>");
}
});
}
else
{  $("#flash").html('<span>Enter valid url !okay?! </span>');
}
return false;
});
});
</script>
See the Pen grab image using url by s.shivasurya (@shivasurya) on CodePen.


php code:

This php code uses get parameter url and undergoes many test to check errors and atlast prints the url which is parsed with JQuery and displayed on clients page.

<?php
if($_GET['url']) {
$shiva=$_GET['url'];
  if($info = new SplFileInfo($shiva)) {
     if($s=$info->getExtension()) {
        $allowedExts = array("gif", "jpeg", "jpg", "png");
          if(in_array($s, $allowedExts)) {
             $size=getimagesize($shiva);
               if($size && $size!=0 ) {
                  $img = $_GET['url'];
                    echo $img;
                } else{echo "size error";}
            } else{echo "existence array error";}
      }else{echo "extension error";}
   }else{echo "file error";}
}
else{echo "error";}
?>

Since i'm currently using free hosting and it is not above 5.3.2 version  :D sorry i couldn't provide however i tried in my Localhost !if u get any error just mail me or comment below.share is care. 

Saturday, March 15, 2014

creating facebook custom stories for facebook application - learn more @i-visionblog.com

we would be fascinated in viewing the status updates,photo updates and as well as many actions that are taking place inside the Facebook.using facebook application we could create custom stories and could be posted inside facebook using such custom stories.Recently i was amazed while using Pintrest and their posts on facebook activity named as pinning action on their wall.This lead me to learn more about Graph API. and posting custom story creation.I was wandering around google for tutorials but facebook developers & stackoverflow gave me brilliant docs to follow and build the custom-stories for facebook application.


creating facebook custom stories for facebook application - learn more @i-visionblog.com

procedure:
first of all for all developers must register in the developer about their new app for any platform provided facebook.it may either windows,android,facebook app,website application,i-os application or it may be a game running on facebook canvas.register with correct URL, domain name, and provide with Developer e-mail.

1)Now go to Graph API side tab listed in left column and click that link.
2)You will be showing with Create new stories (custom).



3)Define new story with action and object.
let us see some terms about action and object below.

action: 

action is something you do on facebook and represent the post and provide a view to the friends and you as post in timeline as well as news-feed. For example SHARE is action made by the user and they are represented as post in timeline and we could post in friends timeline.

object:

object is something which is shared,added or done something on facebook.They are things and important part of the post.We could define our own objects for our custom stories on facebook.for example we could take pintrest application where PIN is action and and post is the object which is important part of the representing data!

my example :

i have choosen Answer as object and Find as action .I have attended many online forum treasure hunt were we could login using facebook and they could post on our timeline after finishing each round!So lets now define a feed that can improve representation of post using custom stories and could create lot of user interaction.


simple custom story from my application!

Working with Graph API Explorer(debugger):

now to check the post with the help of GRAPH API EXPLORER.just click on the GET CODE in stories and it shows variety of options such as Create,update,delete,retrieve for platform such as Http,PHP SDK,Android,I-OS and javascript SDK.

1) select the HTTP platform and click on the Address given it leads to open the Graph Api explorer where we could debug the url and recieve data from Facebook server using Graph API.try the other platforms also!(i have not yet tried on android/i-os)

2) Just submit the url with POST method and important thing here is me/{APP_Namespace}:{story_action} where we are going to apply the post to our timeline activity.After submiting we could see numeric value on click it we could see the post details.

now visit your timeline ->Activity log you may find your activity as sample data and it doesnt goes live to the friends until the custom story is approved by facebook team! for the application you have created.

additional options to provide users to add message,tags,places etc while posting custom stories so enable it in Action centre at below.
options under action tab!


submit your custom story action for review:

under status and review option you must submit the custom story with lot of restriction made by facebook since to enhance the quality of sharing on facebook and giving clear mind picture if the post produce by the third party apps on facebook that never correlates with native facebook applications and makes the user to experience the real life posts on facebook which are made by developer and could integrate their website with facebook for social traffic and support.

1) click start submission!
before that every developer must know the settings before applying for review in facebook. Each app on facebook must have a LOGO image and have a detailed description about the application for the users to know about your application.
overcome this error by adding necessary details!

2)you must have flow of data and working of your post with screen shot with minimum of 3 photos 
3) a detailed description about working of your custom story details and working of applications and uses of it.
4)once again submit 4 different types of snapshot of your post on facebook that are made using platforms!
5)and then submit for review and be free and have a cup of coffee aside.after three days facebook team approaches you about your status and describes what to be done.

assume that if they have given authorization then you can configure your application properly and then work with graph API calls to update in Facebook.there are lot of rules and regulations using custom stories via graph api login !I will explain how to work after getting authorization for custom stories in my next post!

if you could find errors!report the bug as comments or mail me! share is care!

Tuesday, March 11, 2014

Android Stepping into Space - Post snippet by @nancy.joslin

android stepping into space- i-visionblog.com
We use Smartphone for many purposes but some minds planned to land it in space and they achieved it.
An ongoing project of NASA, Phonesat made their goal successful. Phonesat is a nano-satellite which uses Smartphone and run on android platforms. This idea was suggested in order to reduce the cost of the satellites. This android satellite is launched into the lower orbit of the earth.
Phonesat was developed for the first time in 2009 at NASA Ames Research Center in Moffett field, California. Various versions are being developed and ready to launch. They are launched as test samples now.

Advantages of this phonesat is that they have faster CPU than the other satellites, one or two cameras for capturing images of earth and space, rotation sensors to detect and orient the satellite , GPS receiver to receive commands, radios to send images .It uses Li-Ion batteries (Lithium ions batteries).

PHONESAT 1.0:

Phonesat 1.0 is the first nano-satellite launched into the low earth orbit. It used Nexus One (Smartphone from HTC & Google) which uses android 2.3.3 operating systems. This was designed with three prototypes at a cost of $3500 for each prototype .This satellite runs in 12 Li-Ion batteries .They had no solar panels. It is approximately 10x10x10cm (4 inch) cube.
                The mission of this phonesat 1.0 is to obtain digital images of earth and space through the camera. This satellite is capable of staying alive for short period in space .The images and satellite health were sent as radio signals via inbuilt radio.This nanosatellite was tested under various conditions in various environments like thermal-vacuum chamber, alpha and beta radiations, vibration and shock tables, high altitude balloons. Phonesat 1.0 was named as GRAHAM and next was named as BELL with Iridium transceiver mounted at one end to receive and send information.

PHONESAT 2.0

Phonesat 2.0 uses Nexus s (from Samsung) which runs on Google android 2.3.3 platform. It has solar panels, 4 Li-Ion batteries, two ways S-band radio to communicate with earth and GPS receiver.ALEXANDER is the name of this satellite, it is also called as Phonesat 2.0 beta, phonesat v2a. This satellite sends packets over amateur radio at 437.4 MHz . This is programmed in such a way that when the packets are not sent it reboots the phone.

PHONESAT 2.4

Phonesat 2.4 also uses Nexus s and android version 2.3.3. It uses 2ways-band radio and it has super control over the orientation of the phone. The Smartphone works as the computing unit and its camera observes the earth while its sensors senses and orient the satellite.
ANTARES 110 launch vehicle on 21 April 2013 carried two phonesat 1.0(GRAHAM and BELL) and one phobesat 2.0(ALEXANDER) and set them in the orbits. It was alive for 2 weeks in space and images sent by phonesat are below here .

 (a) Picture of earth sent by BELL. 

 (b) Picture of earth sent by GRAHAM.









MINOTAUR LORS-3 launch vechile carried phonesat 2.4 and Phonesat 2.5 is being developed and NASA will launch very soon.
author info:

Author       : Nancy joslinDharshini and shivaranjani

contact us : visit our facebook fan page i-visionblog and feel free to comment below.

Monday, March 03, 2014

reCAPTCHA Library for PHP - Learnmore @i-visionblog.com

The world is very competitive and every one tries to uphold the growth of others or promote their contents through SPAM E-mail,comments and through various aspects.So,let us see how to prevent SPAM submissions by using reCAPTCHA to validate user input and proving that user is a human being and not a ROBOT.This generally used to prevent users to make spam on site and increase duplication of data.Hope this technique may control to some extent because human become monotonous to such validation on reading the real life image and answer it in correct manner.


download library  -  Live DEMO 


First Register your DOMAIN and get your unique private & public Key.visit here to register

after registration try to get the the public and private.

then now let us set up a form for submission and try to reduce the spam actions that are over thrown on your form.

PHP & HTML code:



 <html>
  <body>
    <form action="" method="post">
<?php

require_once('recaptchalib.php');

// Get a key from https://www.google.com/recaptcha/admin/create
$publickey = "YOUR_PUBLIC_KEY";
$privatekey = "YOUR_PRIVATE_KEY";

# the response from reCAPTCHA
$resp = null;
# the error code from reCAPTCHA, if any
$error = null;


if ($_POST["recaptcha_response_field"]) {
        $resp = recaptcha_check_answer ($privatekey,
                                        $_SERVER["REMOTE_ADDR"],
                                        $_POST["recaptcha_challenge_field"],
                                        $_POST["recaptcha_response_field"]);

        if ($resp->is_valid) {
                echo "You got it!";
#REST OF YOUR CODE HERE TO UPDATE IN DATABASE OR VARIOUS OPTIONS TO PERFORM
        } else {
                # set the error code so that we can display it
                $error = $resp->error;
        }
}
echo recaptcha_get_html($publickey, $error);
?>
    <br/>
    <input type="submit" value="submit" />
    </form>
  </body></html>    

the above code include recaptchalib.php file in your download folder,just include it in the form to manage the spam.this form automatically detects the error and process the form accordingly.you can add the check up in the another file instead of same file in PHP.

you can customize the Recaptcha theme also- read here

if any bugs report as comments and feel free to share and prevent spam better using google web services.