create a mobile app in php

How to start?

Development of a complex iPFaces application is really simple because the simulation mode can be used. This mode is capable of transfering XML content to a HTML page, which can be displayed in a web browser. It is a helpful tool for developers who can see their iPFaces application in the browser window and they do not need a real iPhone device for main development.
Developers can build and deploy an application to the application server and the browser will show them the GUI which is almost the same as a screen in an iPhone application. There is a difference in the GPS elements. A GPS field is working in a browser only as text field that can be filled by user and GPS coordinates will be submitted. The GPS field is hidden on mobile devices, because the location of the device is detected without interaction with the user.

Hello world example

To use PHP iPFaces library, just include “ipfaces-php-lib-1.1.php” file, construct the component tree and call “render()” method on the component form.

<?php
   require "path/to/ipfaces/library/ipfaces-php-1.1.php";

   $ipf_form = new IPFForm("form1", "Form");
   $ipf_screen = $ipf_form->addScreen("Hello World Application", "screen1");
   $ipf_screen->addLabel("Hello World!");
   $ipf_form->render();
?>
 

Hello world app on the iPhone device and in a web browser

Use of location service

To obtain a user location from a mobile device use the IPFGsm class. Upon submission of a form, the location data will be sent as a parameter with the selected name (gpsElement in this example).

<?php
      require "../lib/ipfaces-php-lib-1.1.php";


      $form = new IPFForm();

      $screen = $form->addScreen("How Far Is It?");

      $screen->addLabel("You can find distance between your position and selected city.");

      $select = new IPFSelect("countrySelect", "1", "Distance to", "list" );

      $select->addOption("35.17 149.13 Australia Canberra", "Canberra");
      $select->addOption("51.30 0.10 UK London", "London");
      $select->addOption("50.05 14.28 Czech Prague", "Prague");
      $select->addOption("38.53 77.02 USA Washington", "Washington");

      $select->Icon = "../img/distcalc.png";
      $screen->addItem($select);

      $screen->addButton("backButton", "1", "Examples", "../index.php", IPFButton::BUTTON_TYPE_LINK, IPFButton::BUTTON_POSITION_BACK);

      $screen->addButton("submitButton", "0", "Calculate" , "distance.php", IPFButton::BUTTON_TYPE_SUBMIT, IPFButton::BUTTON_POSITION_FORWARD);

      $screen->addGps("gpsElement");

      $form->render();
?>

 

READ EXAMPLE
 

get response after sharing with Facebook feed dialog?

<body>
    <div id='fb-root'></div>
    <script src='http://connect.facebook.net/en_US/all.js'></script>
    <p><a onclick='postToFeed(); return false;'><img src="RANDOM IMAGE.png" alt="IMAGE"/></a></p>
    <p id='msg'></p>

        <script> 
          FB.init({appId: "1234567890", status: true, cookie: true});

          function postToFeed() {

            // calling the API ...
            var obj = {
              method: 'feed',
              link: 'https://developers.facebook.com/docs/reference/dialogs/',
              picture: 'http://fbrell.com/f8.jpg',
              name: 'Facebook Dialogs',
              caption: 'Reference Documentation',
              description: 'Using Dialogs to interact with users.'
            };

            function callback(response) {
              document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
            }`enter code here`

            FB.ui(obj, callback);
          }
        </script>
  </body>

Improve your experience by adding svg graphic editor to your website

This is probably the coolest free add-on you can embed into your website in 120 seconds or less. SVG is a free open source vector graphics editor that is much more powerful than you might first think. You may be surprised that it has layers. You can load graphics in just by clicking and dragging them in. It does not yet allow you edit graphic files you bring in, but you can use these images as objects in your graphic creation. SVG even supports layers. The following instructions will help you learn how to embed this graphics editor into your website in just a couple minutes. I will also show you how you can alternatively download the source and serve it up yourself. In addition, as time permits, additions will be made to this wiki, including a few of the features it will bring to your user's experience when they visit your website.

Embed SVG Graphic Editor using an iframe from the latest stable version via svn

You can embed directly from svn the latest stable release which has the added benefit of always serving the latest version without the need for you to do anything.

<iframe 

  src="http://svg-edit.googlecode.com/svn/tags/stable/editor/svg-editor.html"

  width="800" 

  height="700"

/>

Alternatively you can choose to embed a particular release directly from svn. This way you can checkout new versions before releasing them to your website visitors. Once you are comfortable you want to rollout the new version you can simply change the version number to the latest branch.

<iframe 

  src="http://svg-edit.googlecode.com/svn/branches/2.6/editor/svg-editor.html"

  width="800" 

  height="700"

/>

Learn More   Demo

how to show loader image before loading from ajax data php

<html>
<body>
<script language="javascript">function loaddata(){
datastring = 'favour='+id+'&itemsId='+chkItem;

                        jQuery.ajax({

                        type: "POST",  

                        url: "cuponcode.php",  

                        data: datastring,   
                        beforeSend:function(){

                        jQuery('#overlay_loader').css("display","block"); 

                        },
                        success: function(data){ 

                        jQuery('#overlay_loader').css("display","none");

                        alert('Your coupon code is created successfully for selected items');

                        // jQuery("#fav_itm").html(data);

                        },

                            error:function(data){

                            alert(data);

                            }       

                        });
}
</script>
<style>#overlay_loader {
     display:none;  
    position:fixed; 
    left:0px;       
    top:0px;        
    width:100%;     
    height:100%;    
    /*background:#000; */
    opacity:0.5;    
    z-index:99999;
    background:url("images/loader_icon.gif") no-repeat center center rgba(0,0,0,0.5);
    }
</style>
<div id="overlay_loader"></div>

<button name="send" onClick="loaddata();">Send</button>
</body>
</html>

Sliders or Range Selecter and Mobile Price Sliders jQuery

This post is a list of jQuery Mobile Price Sliders. These plugins can be used for numbers, prices or anything that requires a range of selection. Mobile slides provide the mobile user with an easy way to select values simply by sliding any touch device by finger and the current value is displayed in the box. Our favourite is #2 as it allows for easy creation, min/max set and themes. Enjoy!


 
READ MORE 
DEMO 

How to take a screenshot of the current screen of web page and save it as a png image through php

// an example html page
<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
    <script type="text/javascript" src="./javascripts/html2canvas.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('#screenshot').on('click', function(e){
                e.preventDefault();
                html2canvas($('body'), {
                    onrendered: function(canvas){
                        var imgString = canvas.toDataURL();
                        window.open(imgString);
                        $.ajax({
                            url: '',
                            type: 'POST',
                            data: {
                                file: imgString
                            },
                            success: function(response){
                                //alert('Everything works fine.');
                            },
                            error: function(response){
                                //alert('Server response error.');
                            }
                        });
                    }
                });
            });
        });
    </script>
</head>
<body>

<div style="width: 800px; margin: auto;">
    <input type="button" id="screenshot" value="Screenshot!"/>
    <div style="height: 100px;border: 1px solid #D8D8D8;">
        Big header!
    </div>
    <div style="height: 500px;border: 1px solid #D8D8D8;">
        Medium Content
    </div>
</div>

</body>
</html>



// Your php side script
<?php
if($_POST['file'] != "") {
    header('Content-Type: application/json');
    $file = base64_decode(str_replace('data:image/png;base64,','',$_POST['file']));
    $im = imageCreateFromString($file);
    if($im){
        $save = imagepng($im, '/path/to/the/new/file.png');
        echo json_encode(array('file' => true));
    }
    else {
        echo json_encode(array('error' => 'Could not parse image string.'));
    }
    exit();
}

?>

Read More

how to get java script variable in php variable

First way =>
-------------------------------
 <script>
var x = document.write(""<?php echo $b; ?>) ;
alert(x);
</script>

--------------------------------------
Second way =>
--------------------------------------
<script>
var id = jQuery(this).attr("id");
        var comment = jQuery("#"+id).val();
        var dataString = "comment="+comment+"&user_id=<?=base64_encode(json_encode($_SESSION['user_id']))?>"+"&ans_id="+id;
jQuery.ajax({
                type: "POST",  
                url: "page/xyz.php",  
                data: dataString,  
                beforeSend:function(){
                  jQuery('#loader_pic').css("display","block"); 
                }, 
                success: function(data){ 
                    //alert(data);
                    jQuery('#loader_pic').css("display","none");
                    jQuery("#show_more_comment_"+id).append(data);
                    jQuery("#"+id).val('');
                },
                error:function(data){
                    jQuery('#loader_pic').css("display","none");
                    alert(data);
                  
                }       
            });
</script>
<a href="" onclick="abc(12)" />

how to calculate price on change of item value

<script>
$(document).ready(function(){

 var x=parseInt($("#env_amt").val());
 var y1=parseInt(0);
// alert(x);
//----------envolope price-----------
 $(".parax").each(function(){

 var y=parseInt($(this).val());
 //alert(y);
 y1=y1+y;
 });
  var z=(x*y1);
 $("#para1").html(z);

 $(".parax").keyup(function(){
 var m =parseInt(1);
var z1 = parseInt(0);
 var x=parseInt($("#env_amt").val());
 var y1=parseInt(0);

 $(".parax").each(function(){

 var y=parseInt($(this).val());
  y1=y1+y;
  var x1=parseInt($(".qtyprc"+m).val());
 var y2=parseInt($(this).val());
  m++;
   z1 += (x1*y2);
 });

 var z=(x*y1);
 z3 =  z1+z;
 $("#para1").html(z);
  $("#para2").html(z1);
  $("#para3").html(z3);
  $("#amount").val(z3);
 });
//-------------Price calculate------
  var x1;
 var m =parseInt(1);
var z1 = parseInt(0);
 $(".parax").each(function(){
 var x1=parseInt($(".qtyprc"+m).val());
 var y2=parseInt($(this).val());
  m++;
   z1 += (x1*y2);
    z3 =  z1+z;
 //alert(z1);
 });

 $("#para2").html(z1);
  $("#para3").html(z3);
  $("#amount").val(z3);

 /*$(".parax").keyup(function(){
var x1;
 var m =parseInt(1);
var z1 = parseInt(0);
$(".parax").each(function(){
 var x1=parseInt($(".qtyprc"+m).val());
 var y2=parseInt($(this).val());
  m++;
   z1 += (x1*y2);
   z3 =  z1+z;
//alert(z1);
 });
  $("#para2").html(z1);
  $("#para3").html(z3);
 });*/

});
</script>
/* -----------html and php --------*/

<?php 

$sessitems=array();

foreach($sessitems as $key => $item)
{
if($item["addfavtype"]=='His'){
                // echo $itemindex.'.';?> <li class="box">
                 <?php   if(isset($item)) { ?>
                   <span><img src="<?php echo $item["imgsrc"];?>"></span>
                      <?php } ?><input type="text" name="qtyItem<?php echo $itemindex;?>" class="parax" value="1" size="2" maxlength="3"/>$<input type="hidden" class="qtyprc<?php echo $itemindex;?>" value="<?php echo $item["itmprc"];?>" size="2" maxlength="3" readonly/><span><?php echo $item["itmprc"];?></span></li>
                     <?php $itemindex++; $totalcost+=$item["itmprc"]; $itemcount++; }}?></ul>