Friday, April 10, 2015

Icons and Splash Screens

 Usage and Additional Information

The following is a list of the currently supported icon and splash screens supported for this release of Cordova/Phonegap on PhoneGap Build.

Unless otherwise specified in a config.xml, each platform will try to use the default icon.png during compilation. To define platform specific icons please use the guide provided below.

Icon files should be the file formats specified in the examples below, other file types are not guaranteed to work across platforms.

<icon>
  

You can have zero or more of these elements present in your config.xml. If you do not specify a icon then the PhoneGap logo will be used as your application's icon.

src: (required) specifies the location of the image file, relative to your www directory

width: (optional) but recommended to include, width in pixels

height: (optional) but recommended to include, height in pixels
Default

The default icon must be named icon.png and must reside in the root of your application folder.

<icon src="icon.png" />

iOS

We support classic, retina, iPhone 5 and iPad displays.

The names below reflect the names of the destination files when they are added to the application. During app submittal you may get feedback that has a reference to these filenames.
iOS 7.0+

<!-- iPhone 6 / 6+ -->
<icon src="icon-60@3x.png" gap:platform="ios" width="180" height="180" />
<!-- iPhone / iPod Touch  -->
<icon src="icon-60.png" gap:platform="ios" width="60" height="60" />
<icon src="icon-60@2x.png" gap:platform="ios" width="120" height="120" />
<!-- iPad -->
<icon src="icon-76.png" gap:platform="ios" width="76" height="76" />
<icon src="icon-76@2x.png" gap:platform="ios" width="152" height="152" />
<!-- Settings Icon -->
<icon src="icon-small.png" gap:platform="ios" width="29" height="29" />
<icon src="icon-small@2x.png" gap:platform="ios" width="58" height="58" />
<!-- Spotlight Icon -->
<icon src="icon-40.png" gap:platform="ios" width="40" height="40" />
<icon src="icon-40@2x.png" gap:platform="ios" width="80" height="80" />

iOS 6.1

<!-- iPhone / iPod Touch -->
<icon src="icon.png" gap:platform="ios" width="57" height="57" />
<icon src="icon@2x.png" gap:platform="ios" width="114" height="114" />
<!-- iPad -->
<icon src="icon-72.png" gap:platform="ios" width="72" height="72" />
<icon src="icon-72@2x.png" gap:platform="ios" width="144" height="144" />
<!-- iPhone Spotlight and Settings Icon -->
<icon src="icon-small.png" gap:platform="ios" width="29" height="29" />
<icon src="icon-small@2x.png" gap:platform="ios" width="58" height="58" />
<!-- iPad Spotlight and Settings Icon -->
<icon src="icon-50.png" gap:platform="ios" width="50" height="50" />
<icon src="icon-50@2x.png" gap:platform="ios" width="100" height="100" />

Android

We support all Android resource qualifiers. Commonly used qualifiers refer to device density and language.

<icon src="ldpi.png" gap:platform="android" gap:qualifier="ldpi" />
<icon src="mdpi.png" gap:platform="android" gap:qualifier="mdpi" />
<icon src="hdpi.png" gap:platform="android" gap:qualifier="hdpi" />
<icon src="xhdpi.png" gap:platform="android" gap:qualifier="xhdpi" />
<icon src="xxhdpi.png" gap:platform="android" gap:qualifier="xxhdpi" />
<icon src="fr-xxhdpi.png" gap:platform="android" gap:qualifier="fr-xxhdpi" />

A list of these qualifiers can be viewed on Table-2 here. Note that compound qualifiers (eg. "port-xhdpi") have to

be in the same order as viewed on this table.

We also support the deprecated gap:density attribute that will only support the following densities:

<icon src="ldpi.png" gap:platform="android" gap:density="ldpi" />
<icon src="mdpi.png" gap:platform="android" gap:density="mdpi" />
<icon src="hdpi.png" gap:platform="android" gap:density="hdpi" />
<icon src="xhdpi.png" gap:platform="android" gap:density="xhdpi" />
<icon src="xxhdpi.png" gap:platform="android" gap:density="xxhdpi" />

We do not recommend using this attribute as the above gap:qualifer attribute offers more flexibility and more importantly, future support of new screen sizes etc.
Windows Phone

We support two icons for Windows Phone, a regular icon and a tile image.

<icon src="icon.png" gap:platform="winphone" />
<icon src="tileicon.png" gap:platform="winphone" gap:role="background" />

Splash Screens

You can have zero or more of these elements present in your config.xml. This element can have src, gap:platform, width and height attributes, just like the <icon> element above. Like icon files, your splash screens should be saved as png files.

<gap:splash src="splash/ios/Default-568h@2x~iphone.png" gap:platform="ios" width="320" height="480" />

Usage and Additional Information:

Unless otherwise specified in a config.xml, each platform will try to use the default splash.png during compilation. To define platform specific splash screens please use the guide provided below.

Splash files should be the file formats specified in the examples below. Any other file type is not guaranteed to work across platforms.
Warning:

If you do not supply the gap:platform attribute, the referenced image will be copied to ALL platforms, increasing the size of their application packages.
Default

The default splash must be named splash.png and must reside in the root of your application folder.

<gap:splash src="splash.png" />

iOS

We support classic, retina, iPhone 5 and iPad displays; the following will define splash screens for each of those. Standard iPads have two different splash screens, portrait, landscape. Retina iPads have two additional splash screens, retina portrait and retina landscape.

The names below reflect the names of the destination files when they are added to the application. During app submittal you may get feedback that has a reference to these filenames.

<!-- iPhone and iPod touch -->
<gap:splash src="Default.png" gap:platform="ios" width="320" height="480" />
<gap:splash src="Default@2x.png" gap:platform="ios" width="640" height="960" />
<!-- iPhone 5 / iPod Touch (5th Generation) -->
<gap:splash src="Default-568h@2x.png" gap:platform="ios" width="640" height="1136" />
<!-- iPhone 6 -->
<gap:splash src="Default-667h@2x.png" gap:platform="ios" width="750" height="1334" />
<gap:splash src="Default-Portrait-736h@3x.png" gap:platform="ios" width="1242" height="2208" />
<gap:splash src="Default-Landscape-736h@3x.png" gap:platform="ios" width="2208" height="1242" />
<!-- iPad -->
<gap:splash src="Default-Portrait.png" gap:platform="ios" width="768" height="1024" />
<gap:splash src="Default-Landscape.png" gap:platform="ios" width="1024" height="768" />
<!-- Retina iPad -->
<gap:splash src="Default-Portrait@2x.png" gap:platform="ios" width="1536" height="2048" />
<gap:splash src="Default-Landscape@2x.png" gap:platform="ios" width="2048" height="1536" />

Android

We support all Android resource qualifiers. Commonly used qualifiers refer to device orientation, language and density.

<gap:splash src="ldpi.png" gap:platform="android" gap:qualifier="ldpi" />
<gap:splash src="mdpi.png" gap:platform="android" gap:qualifier="mdpi" />
<gap:splash src="hdpi.png" gap:platform="android" gap:qualifier="hdpi" />
<gap:splash src="xhdpi.png" gap:platform="android" gap:qualifier="xhdpi" />
<gap:splash src="fr-xhdpi.png" gap:platform="android" gap:qualifier="fr-xhdpi" />
<gap:splash src="portrait-xxhdpi.png" gap:platform="android" gap:qualifier="port-xxhdpi" />
<gap:splash src="landscape-xxhdpi.png" gap:platform="android" gap:qualifier="land-xxhdpi" />

A list of these qualifiers can be viewed on Table-2 here. Note that compound qualifiers (eg. "port-xhdpi") have to

be in the same order as viewed on this table.

Patch-9 backgrounds are supported. All patch-9 files have to have a ".9.png" suffix.

We also support the deprecated gap:density attribute that will only support the following densities:

<gap:splash src="ldpi.png" gap:platform="android" gap:density="ldpi" />
<gap:splash src="mdpi.png" gap:platform="android" gap:density="mdpi" />
<gap:splash src="hdpi.png" gap:platform="android" gap:density="hdpi" />
<gap:splash src="xhdpi.png" gap:platform="android" gap:density="xhdpi" />
<gap:splash src="xxhdpi.png" gap:platform="android" gap:density="xxhdpi" />

We do not recommend using this attribute as the above gap:qualifer offers more flexibility and more importantly, future support of new screen sizes etc.
Windows Phone

Windows Phone supports a single splash image and can be defined as below. Unlike the other supported platforms, Windows Phone splash screen should be in jpg format

<gap:splash src="splash/winphone/splash.jpg" gap:platform="winphone" />

How to create an SlideShow of images on click using jquery?

How to create an SlideShow of images on click using jquery?

To create an SlideShow of images on click using jquery we need to fist create an html page with image and some images in our folder as shown in below code.

<html>
<head>
<tittle> Slidshow</tittle>
<script src="jquery.min.js"></script>
<script src="coustom.js"></script>

</head>
<body>
<img class="play" src="img/button_play.png">
<img class="pause" src="img/button_pause.png">

<img class="slide" src="img/1.jpg">
</body>
</html>

In our above code we have three images one for Play, Pause and third is our image.Each image is given one class named as play, pause and slide respectively.

In the next step we create an custom.js file where we will give our js code which would be as followed.

Var d=1;
$(".play").click(function(){
        $(".slide").attr('src', 'img/'+d+'.jpg');
        i=parseInt(d) + 1;
        t= setInterval(function(){ 
        $(".slide").fadeOut(1000, function () {
        $(".slide").attr('src', 'img/'+[i++]+'.jpg');
        $(".slide").fadeIn(1000);
    });
    if(i == lastimgno)
    i = 1;
    }, 5000); 
});     


    $(".pause").click(function(){
        clearInterval(t);
    });



In above js code we changed the source of the image on click of the class or we can say that on click of the image.

When we click on the play image we would get the slid show started where the images get changed after an interval of 5000 which means after 5 sec. This time can be changed according to your requirements.

And when we click on the pause image we distroy the interval set when we clicked on the play button.

Thats what the code is.

If it helped you than just make the comments. Any query please comment.

Thursday, April 09, 2015

How to use the PHP download Script?

How to Downlaod a pdf,jpg,png,doc or any other file buy just using the bellow script.

The below code is where the name of the file is displayed to be downloaded. 
 
<?php
    include("config.php");
       
    $query1 = "SELECT * FROM upload";
    $result = mysql_query($query1);
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>File download</title>
</head>

<body>



<?php
while($row1=mysql_fetch_array($result))
{
    $name=$row1['name'];
   
    ?>
<center>
<a href="download1.php?filename=<?php echo $name ;?>" >
<?php echo $name ;?></a><br />
</center>
<?php }?>



</body>
</html>


Now we will write the script for downloading a file:-

<?php

function output_file($file, $name, $mime_type='')
{
 
 //Check the file premission
 if(!is_readable($file)) die('File not found or inaccessible!');

 $size = filesize($file);
 $name = rawurldecode($name);

 /* Figure out the MIME type | Check in array */
 $known_mime_types=array(
     "pdf" => "application/pdf",
     "txt" => "text/plain",
     "html" => "text/html",
     "htm" => "text/html",
    "exe" => "application/octet-stream",
    "zip" => "application/zip",
    "doc" => "application/msword",
    "xls" => "application/vnd.ms-excel",
    "ppt" => "application/vnd.ms-powerpoint",
    "gif" => "image/gif",
    "png" => "image/png",
    "jpeg"=> "image/jpg",
    "jpg" =>  "image/jpg",
    "php" => "text/plain"
 );

 if($mime_type==''){
     $file_extension = strtolower(substr(strrchr($file,"."),1));
     if(array_key_exists($file_extension, $known_mime_types)){
        $mime_type=$known_mime_types[$file_extension];
     } else {
        $mime_type="application/force-download";
     };
 };

 //turn off output buffering to decrease cpu usage
 @ob_end_clean();

 // required for IE, otherwise Content-Disposition may be ignored
 if(ini_get('zlib.output_compression'))
  ini_set('zlib.output_compression', 'Off');

 header('Content-Type: ' . $mime_type);
 header('Content-Disposition: attachment; filename="'.$name.'"');
 header("Content-Transfer-Encoding: binary");
 header('Accept-Ranges: bytes');

 /* The three lines below basically make the
    download non-cacheable */
 header("Cache-control: private");
 header('Pragma: private');
 header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");

 // multipart-download and download resuming support
 if(isset($_SERVER['HTTP_RANGE']))
 {
    list($a, $range) = explode("=",$_SERVER['HTTP_RANGE'],2);
    list($range) = explode(",",$range,2);
    list($range, $range_end) = explode("-", $range);
    $range=intval($range);
    if(!$range_end) {
        $range_end=$size-1;
    } else {
        $range_end=intval($range_end);
    }

    $new_length = $range_end-$range+1;
    header("HTTP/1.1 206 Partial Content");
    header("Content-Length: $new_length");
    header("Content-Range: bytes $range-$range_end/$size");
 } else {
    $new_length=$size;
    header("Content-Length: ".$size);
 }

 /* Will output the file itself */
 $chunksize = 1*(1024*1024); //you may want to change this
 $bytes_send = 0;
 if ($file = fopen($file, 'r'))
 {
    if(isset($_SERVER['HTTP_RANGE']))
    fseek($file, $range);

    while(!feof($file) &&
        (!connection_aborted()) &&
        ($bytes_send<$new_length)
          )
    {
        $buffer = fread($file, $chunksize);
        print($buffer); //echo($buffer); // can also possible
        flush();
        $bytes_send += strlen($buffer);
    }
 fclose($file);
 } else
 //If no permissiion
 die('Error - can not open file.');
 //die
die();
}
//Set the time out
set_time_limit(0);

//path to the file
$file_path='admin/files/'.$_REQUEST['filename'];


//Call the download function with file path,file name and file type
output_file($file_path, ''.$_REQUEST['filename'].'', 'text/plain');
?>