Iphone - icône d'application pour appeler un numero personnel

Description

Téliphon3 - Après un petit tutoriel(TéliPhone sur ce sujet il y a près de deux an puis une une interface pour les créer aisément des icônes sur l'écran d'accueil de l'iPhone (TéliPhone2) il y a moins d'un an, Je reviens avec TéliPhon3 qui désormais permet de créer des web-application et de les installer rapidement sur l'iPhone. Les web-applications se lance beaucoup plus rapidement que les pages web de TeliPhone2. Dans l'ensemble cette interface change peu par rapport à la précédente. Elle bénéficie cependant grâce au nouvel iOS6 de la possibilité d'uploader directement des photo de l'iPhone ; cependant Free, par exemple , limite l'upload à 2 MO ce qui devient faible maintenant avec les nouveaux capteurs photographiques.
Pour rendre la création des contacts téléphonique plus aisée j'ai réalisé un unique script Php qui :
1 - S'auto-installe lors du premier lancement
2 - Gère les icônes de contacts téléphoniques
3 - Installe les web-application sur l'iPhone
Pour ceux qui utiliseraient TéliPhone2, on peut remplacer l'ancien script par ce nouveau. Il sera très intéressant de "modifier" les contacts pour qu'ils se transforment en rapides web-applications.

Source / Exemple :

<?php

/**
 *  TeliPhon3
 *  Par Rainbow 
 *  A Pessac le 10 octobre 2012
 * 
 *  iPhone !
 *  Appeler directement un numéro de téléphone en tapant sur une icône de l'écran d'accueil.
 *  Ce qui n'est toujours pas prévu nativement sur l'iPhone.
 * 
 *  Utilité de ce script :
 *  C'est une interface de saisie Web qui permet de :
 *  - Créer des web-applications pour iPhone, destinées à appeler directement un numéro de téléphone en tapant sur une icône de l'écran d'accueil
 *  - Maintenir et gérer ces web-applications.
 * 
 *  Le grand intéret de cette page est d'être l'unique script à déposer sur le serveur dans le répertoire choisi.
 *  Elle installera tout les fichiers et répertoires dont elle aura besoin lors de son 1er lancement
 *  puis il permettra de créer votre application et enfin de l'installer sur l'iPhone.
 *
 *  Cette page ne peux pas elle-même être utilisée comme une web-application car on utilise le rechargement de la page, sur le serveur, pour faire les mises à jour des créations modifications et autres saisies.
 *  Pour en faire une web-application, il faudrait faire ces mises à jour en Ajax - XMLHttpRequest.
 * 
 *	Sur quel terminal doit-on utiliser cette interface ?
 *  Il est impératif d'utiliser un iPhone au momment de créer l'icône sur l'écran d'accueil,
 *  sinon il faudra spécifier, dans Safari, l'url complète de l'application à installer.
 *  Dans tous les autres cas, on peut utiliser n'importe quel ordinateur.
 *
 *  A l'Installation cette page crée :
 *  - Trois sous-répertoires : 
 *      . un pour stocker des icônes, 
 *      . un second pour installer les applications d'appels téléphoniques
 *      . et un répertoire temporaire pour les upload d'images
 *    Si quelqu'un utilise déjà ma version teliphon2 moins performante, il lui suffira de mettre ce script à la place de l'ancien
 *  Chaque sous-répertoire dispose d'un index qui ramène au répertoire d'installation.
 *  - Le répertoire d'image contiendra d'emblée une icône fabriquée à l'installation
 *    Il contiendra les icônes fabriquées plus tard par réduction d'images uploadées
 *    Depuis l'iOS6, l'iphone accepte les upload des images de l'appareil photo
 *  - Le répertoire des installations recevra d'emblée un fichier .htaccess spécifiant l'extension des fichiers Manifest
 *    Ensuite pour chaque application affichant une icône associée à un appel téléphonique on y mettra 3 fichiers de même nom :
 *      . un Xml contenant les unformation de configuration de l'application
 *      . un fichier Html 5 (avec Css et Js) avec les divers éléments permettant d'en faire une application
 *      . une icône Png  
 * 
 *  Fonctionalité de cette interface :
 *      - Upload d'images transformées en icônes pour les application créées plus tard.
 *          A noter que par défaut Php n'autorise que 2 MO d'upload ; c'est le cas sur Free.
 *      - Création d'application : Icône pour appeler directement un numéro de téléphone sur l'écran d'accueil d'un iPhone
 *      - Lancement de cette application : Appel de la page dans Safari.
 *          A cette occasion il est demandé de faire une icône sur l'écran d'accueil
 *          La création de l'icône installe l'application sur l'iPhone 
 *      - Modification de cette application
 *      - Suppression d'une application.     
 * 
 *  Présentation :
 *      - Bandeau d'entête ou il est possible de modifier l'icône de cette interface sur l'écran d'accueil de l'iPhone
 *      - Un fonction de stockage d'images pour l'upload des images à réduire en icône
 *      - Une cousultation des icônes disponibles
 *      - Une fonction "Nouveau contact" pour définir une nouvelle application
 *          Ouvre une page où saisir le nom du contact, le numéro de téléphone et une icône avec ou sans reflet 
 *          Le nom des fichiers de l'application est fabriqué automatiquement à partir du nom du contact
 *          A cette occasion est donc créé dans le répertoire des applications : 
 *              . Le fichier Html
 *              . L'icône recopiée et renommée avec le nom du Html
 *              . Le fichier Manifest avec le nom du Html.
 *      - Une ligne par application crée par application pour :
 *          . La modifier : Nom, numéro, icône
 *              Le numéro de version, indispensable pour que l'iPhone charge la mise à jour à son changement, 
 *              est une mise en forme de la date système.
 *              C'est aussi ici, qu'on peut supprimer l'application. 
 *          . La Lancer sur Safari en vu de créer l'icône
 * 
 */

	
	

    

	
/** Paramétrage ********************/

	$dirPhones = 'tph';	/** répertoire des numéros de téléphones téléphoniques et des web-appli correspondantes*/
	$dirImages= 'img';	/** répertoire des images disponibles pour associer des icônes aux numéros */

/** fin paramétrage ****************/

$dirTemporaire = 'tmp';	/** répertoire temporaire pour stocker les images */

/** 
	Chaque " numéro " de téléphone, ou contact, est identifié par son mnémonique fabriqué à partir du nom saisi, lors de sa création.
	On peut ainsi modifier le nom et le numéro proprement dit
	Le répertoire $dirPhones contient :
		un fichier .htaccess
		et pour chaque mnémonique : un .xml, un .png, un .html et un .manifest 
	Le but étant d'avoir une icône par numéro à appeler : si une personne est joignable à plusieurs numéros, il faudra créer plusieurs contacts.
*/

$iphone = (preg_match('/(iphone|ipod|ipad)/i', $_SERVER['HTTP_USER_AGENT'])) ? 1 : 0;


$reflets = array('-precomposed','');
$reflet = 0;

$erreur = "";

$tph = array();
$titre = '';

$immediat = 0;

$fraiche = '?'.date("YmdHi");

function afficheNrPhone($nr) {
	if (strlen($nr)==10) {
		if ($nr[1]!='8') {
			$nr = substr($nr,0,2).' '.substr($nr,2,2).' '.substr($nr,4,2).' '.substr($nr,6,2).' '.substr($nr,8,2);
		} else { $nr = substr($nr,0,4).' '.substr($nr,4,2).' '.substr($nr,6,2).' '.substr($nr,8,2);}
	}
	else {
		if (strlen($nr)>10) {
			$nr = substr($nr,0,strlen($nr)-9).' '.substr($nr,-9,1).' '.substr($nr,-8,2).' '.substr($nr,-6,2).' '.substr($nr,-4,2).' '.substr($nr,-2,2);
		}
	}
	return($nr);
}


?>

<?php
		/** Gestion des contacts */

$nomPage = '';
if (preg_match('/'.'([0-9a-z_]+)'.'\.php/i',$_SERVER['PHP_SELF'],$noms)) {
	if ($noms[1]!="") { $nomPage = strtolower($noms[1]);}
}

$nomLogo = 'logo';


$configurer = 0;		/** Type de page à créer : 0 page principale, 1 charger une image, 2 créer ou modifier/supprimer un contact */
$paramConfig = 0;		/** Type traitement à effectuer : 1 charger une image, 2 créer/modifier un contact, 3 supprimer un contact, 4 changer l'icône de la page */
$param2Config = '';		/** complément à $paramConfig ; en général mnémonique du contact à traiter */


if (isset($_POST['configurer'])) { $configurer = intval($_POST['configurer']);}
if (isset($_POST['paramconfig'])) { $paramConfig = intval($_POST['paramconfig']);}
if (isset($_POST['param2config'])) { $param2Config = stripslashes($_POST['param2config']);}

if (($paramConfig == 3)&&($param2Config != '')) {
	/** suppression du numéro de téléphone */
	if (file_exists($dirPhones.'/'.$param2Config.'.png')) {if (unlink($dirPhones.'/'.$param2Config.'.png')) {}}
	if (file_exists($dirPhones.'/'.$param2Config.'.xml')) {if (unlink($dirPhones.'/'.$param2Config.'.xml')) {}}
	if (file_exists($dirPhones.'/'.$param2Config.'.html')) {if (unlink($dirPhones.'/'.$param2Config.'.html')) {}}
	if (file_exists($dirPhones.'/'.$param2Config.'.manifest')) {if (unlink($dirPhones.'/'.$param2Config.'.manifest')) {}}
}

$nouvStockee = 'nouvimage';
$cIco = 114; 
$cIco = 129;
$maxKoImg = 2048; /** Free autorise jusqu'à 2MO qui est la valeur par défaut de Php. A vérifier avec phpinfo() */
function mo2ko($ko) { return(round($ko/1024,1));}	

function messageErreurUpload($nr) {
    $s = "";    
    switch (intval($nr)) {
        case 0 :    break;    
        case 1 :    ;
        case 2 :    $s = "L'image doit être inférieure à ".mo2ko($maxKoImg)."MO"; break;
        default :   $s = "L'image n'a pas été stockée"; break;
    }
}

function lesFichiers($dir,$ext) {
	$dir = getcwd().'/'.$dir;
	$t = array();
	if ( $handle = opendir($dir)) { 
		while (false !== ($file = readdir($handle))) {
			if (preg_match('/'.'([0-9a-z_]+)'.'\.'.$ext.'$/i',$file,$noms)) {
				if ($noms[1]!="") { $t[] = $noms[1];}
			}
		}
		closedir($handle);
	}
	return($t);
}

function creerLogo() {
	global $dirImages, $lesImages, $nomLogo, $nomPage, $nouvStockee, $cIco;
	$cdr = 10;
	$xm = ($cIco+$cdr)/2;
	$ym = $cIco/2;
	$phi = 1.618;
	$image = imagecreate($cIco,$cIco);
	#$couleur = imagecolorallocate($image, 0xab, 0xcd, 0xef);
	$couleur = imagecolorallocate($image, 0xa9, 0x43, 0x21);
	$blanc = imagecolorallocate($image, 0xff, 0xff, 0xff);
	imagefilledrectangle ($image, $cdr, 0, $cIco, $cIco, $blanc);
	imagesetthickness($image, 2);
	imagefilledarc ($image, $xm, $ym,  90, 90, 145, 0, $couleur, IMG_ARC_PIE);
	imagefilledarc ($image, $xm, $ym,  58, round(58/$phi), 175, 0, $blanc, IMG_ARC_PIE);
	imagefilledarc ($image, $xm, $ym,  58, 58, 145, 180, $blanc, IMG_ARC_PIE);
	imagearc ($image, $xm, $ym,  60, 60, 0, 0, $couleur);
	imagearc ($image, $xm+10, $ym-15,  25, 30, 60, 110, $couleur);
	imagearc ($image, $xm+10, $ym+15,  25, 30, 250, 290, $couleur);
	imagearc ($image, $xm-10, $ym-15,  25, 30, 60, 120, $couleur);
	imagearc ($image, $xm, $ym-13,  40, 60, 65, 120, $couleur);
	imagepng($image,$nomPage.'.png');
	imagepng($image,$nomLogo.'.png');
	imagepng($image,$dirImages.'/'.$nomLogo.'.png');
	imagepng($image,$nouvStockee.'.png');
	$lesImages[] = $nomLogo;
}


$lesImages = array();	/** Listes des icônes disponibles */
$lesPhones = array();	/** Listes des numéros de téléphones identifiés par leur mnémonique */

/** Eventuelle installation */

$remonteDir = '<?php header("Location: ../"); exit(); ?>';
if (!(file_exists('index.php'))) { file_put_contents('index.php','<?php echo "Bonjour"; ?>');}
if (!(file_exists($dirPhones))) { 
	if (mkdir($dirPhones)) { 
		file_put_contents($dirPhones.'/'.'index.php', $remonteDir);
		file_put_contents($dirPhones.'/'.'.htaccess', "AddType text/cache-manifest manifest");
	}
}
else {
	$lesPhones = lesFichiers($dirPhones,'xml'); /** Inventaire des numéros de téléphones */
	if (!(file_exists($dirPhones.'/'.'.htaccess'))) {
		file_put_contents($dirPhones.'/'.'.htaccess', "AddType text/cache-manifest manifest");
	}
}
if (!(file_exists($dirImages))) { 
	if (mkdir($dirImages)) { 
		file_put_contents($dirImages.'/'.'index.php', $remonteDir);
		creerLogo();
	}
}
else {
	$lesImages = lesFichiers($dirImages,'png');
}

if (!(file_exists($dirTemporaire))) { 
	if (mkdir($dirTemporaire)) { file_put_contents($dirTemporaire.'/'.'index.php', $remonteDir);}
}

function titreDuXml($leXml) {
	global $dirPhones;
	$titre = ucfirst($leXml);
	if (file_exists($dirPhones.'/'.$leXml.'.xml')) {
		$xml = simplexml_load_file($dirPhones.'/'.$leXml.'.xml');
		if ($xml) { $titre = ucfirst(strval($xml->titre));}
	}
	return($titre);
}

function incrementeNom($nom,$dir,$ext) {
	$nom = strtolower(str_replace(' ','', $nom));
	if (file_exists($dir.'/'.$nom.'.'.$ext)) {
		$i = 1;
		while (file_exists($dir.'/'.$nom.strval($i).'.'.$ext)) { $i++;}
		$nom .= strval($i); 
	}
	return($nom);
}
	
function stockerCetteImage() {
	global $dirImages, $dirTemporaire, $cIco, $nouvStockee, $lesImages;
	/*
	if ($_FILES["file"]["error"] != UPLOAD_ERR_OK) {
		$s = date("Ymd-His").' , '.$noms[0].' : erreur n° '.$_FILES["file"]["error"];
		file_put_contents('erreur.txt', $s);
	}*/
	$noms = explode('.',$_FILES["file"]["name"]);
	$nom = incrementeNom($noms[0],$dirImages,'png');
	$ext = strtolower($noms[1]);
	$typExt = 0;
	if ($ext=='jpg') { $typExt = 1;} else { if ($ext=='gif') {$typExt = 2;}}
	move_uploaded_file($_FILES["file"]["tmp_name"], $dirTemporaire.'/' . $_FILES["file"]["name"]);/* */
	/** On en garde une copie de $cIco pixels de côté */
	$dims = getimagesize($dirTemporaire.'/'.$_FILES["file"]["name"]);
	$nouvImage;
	$origImage;
	/** Si l'image est rectangulaire on ne récupère que le carré central */
	$x0 = 0;
	$y0 = 0;
	$cote = $dims[0]; 
	if ($dims[0]>$dims[1]) {
		$cote = $dims[1];
		$x0 = floor(($dims[0]-$dims[1])/2);
	}
	else {
		if ($dims[0]<$dims[1]) {
			$y0 = floor(($dims[1]-$dims[0])/2);
		}
	}
	$nouvImage = imagecreatetruecolor($cIco, $cIco);
	$blanc_alpha = imagecolorallocatealpha($nouvImage, 255, 255, 255, 0);
	imagefill($nouvImage,0,0,$blanc_alpha);
	switch ($typExt) {
		case 0: $origImage = imagecreatefrompng ( $dirTemporaire.'/'.$_FILES["file"]["name"]); break;
		case 1: $origImage = imagecreatefromjpeg ( $dirTemporaire.'/'.$_FILES["file"]["name"]); break;
		case 2: $origImage = imagecreatefromgif ( $dirTemporaire.'/'.$_FILES["file"]["name"]); break;
	}
	imagecopyresized($nouvImage, $origImage, 0,0, x0,y0 , $cIco,$cIco , $cote,$cote );
	imagepng($nouvImage,$dirImages.'/'.$nom.'.png');
	imagepng($nouvImage,$nouvStockee.'.png');
	imagedestroy($nouvImage);
	imagedestroy($origImage);
	unlink($dirTemporaire.'/'.$_FILES["file"]["name"]);
	$lesImages[] = $nom;
}

$nouveauContact = true;
$contact_ref = "";
$contact_nom = "";
$contact_nr = "";
$contact_ico = "";

switch ($paramConfig) {
	case 1:
		/** Upload d'une nouvelle image */
		if ($_FILES["file"]["error"] < 1) { 
			stockerCetteImage();
		}
        else {
            $erreur = messageErreurUpload($_FILES["file"]["error"]);
        }
		break;
	case 2:
		/** Contact */
		$contact;
		$xml;
		if ($_POST['param2config']!='') {
			/** Modification d'un contact */
			$contact = $_POST['param2config'];
			if ($_POST['contact_ico']!='') {
				copy($dirImages.'/'.$_POST['contact_ico'].'.png', $dirPhones.'/'.$contact.'.png');
			}
		}
		else {
			/** Création d'un nouveau contact */
			$contact = strtolower(str_replace(' ','',$_POST['contact_nom']));
			$contact = str_replace(array("à","â","ä","é","è","ê","ë","î","ï","ô","ö","ù","û","ü","ç"), array("a","a","a","e","e","e","e","i","i","o","o","u","u","u","c"), $contact);
			if ($_POST['contact_ico']!='') {
				copy($dirImages.'/'.$_POST['contact_ico'].'.png', $dirPhones.'/'.$contact.'.png');
			}
			else {
				copy($nomLogo.'.png', $dirPhones.'/'.$contact.'.png');
			}
		}
		$rflt = (isset($_POST['contact_rfl'])) ? 1 : 0;
		/** Caractéristiques du contact*/
		$leXml = $dirPhones.'/'.$contact.'.xml';
		if (!(file_exists($leXml))) {
			$x = '<?xml version="1.0" encoding="utf-8" ?>
				<telephones>
				</telephones>
				';
			$xml = simplexml_load_string($x);
			if ($xml) {
				$xml->addChild('titre',ucfirst($_POST['contact_nom']));
				$telephone = $xml->addChild('telephone');
				$telephone->addChild('nom',$_POST['contact_nom']);
				$telephone->addChild('numero',str_replace(' ','',strval($_POST['contact_nr'])));
				$telephone->addChild('image',$contact);
				$telephone->addChild('reflet',$rflt);
				$xml->asXML($leXml);
				$lesPhones[] = $contact;
			} else echo 'err';
		}
		else {
			$xml = simplexml_load_file($dirPhones.'/'.$_POST['param2config'].'.xml');
			if ($xml) {
				$xml->titre = $_POST['contact_nom'];
				$phone = $xml->telephone[0];
				$phone->nom = $_POST['contact_nom'];
				$phone->numero = str_replace(' ','',strval($_POST['contact_nr']));
				$phone->reflet = $rflt;
				$xml->asXML($leXml);
			}
		}
		/** Création et écriture de la web-application et de son manifest qui lanceront le contact  */
		$wbapp = '<!DOCTYPE html>'.'<html manifest="'.$contact.'.manifest">'.'<head>';
		$wbapp .= '<title>'.ucfirst($_POST['contact_nom']).' &mdash; '.$nomPage.'</title>';
		$wbapp .= '<meta http-equiv="content-type" content="text/html; charset=utf-8"/>';
		$wbapp .= '<meta name="robots" content="noindex, nofollow">';
		$wbapp .= '<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>';
		$wbapp .= '<link rel="apple-touch-icon'.$reflets[$rflt].'" href="./'.$contact.'.png"/>';
		$wbapp .= '<link rel="apple-touch-startup-image" href="./'.$contact.'.png" />';
		$wbapp .= '<meta name="apple-mobile-web-app-capable" content="yes" />';
		$wbapp .= '<style>html{width:100%;}body{font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;font-size:small;margin:0px;padding-left:1%;width:98%;padding-right:1%;padding-top:4px;color:#128;}ul{width:100%;margin:0px;padding:0px;background-repeat:no-repeat;border-radius:13px 0px 0px 13px;}li{padding-left:33%;width:67%;line-height:57px;text-align:center;list-style-type:none;text-decoration:none;font-weight:bold;}a{width:100%;line-height:57px;text-align:center;list-style-type:none;text-decoration:none;font-weight:normal;color:#348;background-color:#cdf;padding-left:1em;padding-right:1em;border-radius:3px;}#msg_accueil{display:none}p{font-size:x-small;color:#567;padding:15px;}</style>';
		$wbapp .= '<script>';
		$wbapp .= 	'var numero="'.str_replace(' ','',strval($_POST['contact_nr'])).'";';
		$wbapp .= 	'window.onload=function(){';
		$wbapp .= 		'if (!(window.navigator.standalone)){document.getElementById("msg_accueil").style.display="inline"; alert("'."Faites une icône sur l'écran d'accueil pour créer l'application".'");}';
		$wbapp .= 		'else {window.location.href="tel:"+numero;}';
		$wbapp .= 	'}';
		$wbapp .= '</script>';
		$wbapp .= '</head>'.'<body>';
		$wbapp .= '<div>'.'<ul style="background-image:url(./'.$contact.'.png);">';
		$wbapp .= '<li>'.ucfirst($_POST['contact_nom']).'</li>';
		$wbapp .= '<li>'.'<a href="tel:'.str_replace(' ','',strval($_POST['contact_nr'])).'">'.afficheNrPhone(str_replace(' ','',strval($_POST['contact_nr']))).'</a>'.'</li>';
        $wbapp .= '</ul>';
		$wbapp .= '<p id="msg_accueil">';
		$wbapp .= "Pour ajouter cet Appel à l'écran d'accueil :";
		$wbapp .= '<br />'."1. tap sur la flèche qui sort de sa boite, en bas de l'écran.";
		$wbapp .= '<br />'."2. puis choisir sur &laquo; Sur l'écran d'accueil &raquo;.";
		$wbapp .= '</p>';
		$wbapp .= '</div>';
		$wbapp .= '</body>'.'</html>';
		file_put_contents($dirPhones.'/'.$contact.'.html', $wbapp);
		$mnfst = 'CACHE MANIFEST'."\n";
		$mnfst .= '# Version '.date("y.z.G.i")."\n";
		$mnfst .= 'CACHE:'."\n";
		$mnfst .= $contact.'.html'."\n";
		$mnfst .= $contact.'.png'."\n";
		file_put_contents($dirPhones.'/'.$contact.'.manifest', $mnfst);
		break;
	# case 3: Suppression du contact, déjà traité dès le début du script  
	case 4:
		/** changement d'icône de la page */
		copy($dirImages.'/'.$_POST['param2config'].'.png',$nomPage.'.png' );
		break;
}	

?>

<!DOCTYPE html>
<html>
	<head>
	
	<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
	<meta name="robots" content="noindex, nofollow">
	<meta name="GOOGLEBOT" content="NOARCHIVE">
	<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
	<link rel="<?php echo 'apple-touch-icon'.$reflets[$reflet]; ?>" href="<?php echo $nomPage.'.png'; ?>"/>
	<link rel="shortcut icon" href="<?php echo $nomPage.'.png'; ?>" />
	<title><?php echo ucfirst($nomPage); ?></title>
	<style>
		html {width:100%;}
		body {font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;font-size:small;margin:0px;padding-left:1%;width:98%;padding-right:1%;padding-top:4px;color:#128;}
		ul {width:100%;margin:0px;padding:0px;}
		li {width:100%;text-align:center;list-style-type:none;text-decoration:none;font-weight:bold;}
		a {width:100%;text-align:center;list-style-type:none;text-decoration:none;font-weight:normal;color:#12d;background-color:transparent;}
		p {font-size:small;color:#89a;}
		label {font-size:small;color:#348; line-height:130%}
		.li2 {margin-top:1px;padding-left:21%;width:79%;max-height:57px;background-repeat:no-repeat;background-size:57px 57px;background-size:57px 57px;border-radius:8px 0px 0px 8px;}
		.li3 {background-image:-webkit-gradient(linear, left bottom, right top, from(#fff), to(#ddd));background: -moz-linear-gradient(left, #fff, #ddd);}
		.li0 {background-image:-webkit-gradient(linear, left bottom, right top, from(#fff), to(#35d));background: -moz-linear-gradient(left, #fff, #35d);}
		.a50 {padding-left:5%;width:40%;padding-right:5%;text-align:right;background-color:transparent;}
		.h29 {line-height:29px; }
		.h28 {line-height:28px; }
		.h57 {line-height:57px; }
		.ico114 {width:114px;height:114px;margin:1px;}
		.ico57 {width:57px;height:57px;margin:1px;}
		.bt57 {border-style:solid;border-width:1px;border-color:#ace;border-radius:5px;background-color:#def; font-weight:bold;cursor:pointer;}
		.bt_annuler {text-align:center;background-color:#def;font-size:medium;line-height:180%;border-style:solid;border-width:1px;border-color:#abc;border-radius:8px;font-weight:bold;margin-bottom:5px;}
		.bt_annuler a {cursor:pointer;list-style-type:none;text-decoration:none;color:#789;font-size:medium;line-height:180%;font-weight:bold;}
		.motclef {color:#35d;}
		.gras {font-weight:bold;}
		#choix_image {display:none;}
		#aide p .nota{color:#a98;}
	</style>	
	<?php 
		echo '<script> var iphone="'.$iphone.'"; var dirImages="'.$dirImages.'"; var erreur="'.$erreur.'"; '.'</script>'; 
	?>
	<script>
		
		var iconeAction = 0;
		
		function annuler() {
			document.getElementById('paramconfig').value = 0;
			document.forms['configuration'].submit();
		}
		function stockerImage() {
			document.getElementById('configurer').value = 1;
			document.forms['configuration'].submit();
		}
		
		function allerA(montrer,cacher) {
			document.getElementById(cacher).style.display = 'none';
			document.getElementById(montrer).style.display = 'block';
		}
		
		function modifierContact(phone) {
			document.getElementById('configurer').value = 2;
			document.getElementById('param2config').value = phone;
			document.forms['configuration'].submit();
		}
		function nouveaunouveauContact() {
			document.getElementById('configurer').value = 2;
			document.forms['configuration'].submit();
		}	
		function iconePourNouviconePourNouvContact() {
			iconeAction = 2;
			allerA('choix_image','gerer_numeros');
		}
		function iconePourLAppli() {
			iconeAction = 4;
			allerA('choix_image','gerer_numeros');
		}
		
		function surEcranAccueil(contact) {
			contact += '.html';
			alert(contact);
			window.open(contact);
		}
		
		function supprimersupprimerContact(mnemo,nom) {
		    if (confirm("Confirmez-vous la suppression de "+nom+" ?")) {	
				document.getElementById('paramconfig').value = 3;
				document.getElementById('param2config').value = mnemo;
				document.forms['configuration'].submit();
			}
		}
		
		function imageChoisie(img) {
			
			switch (iconeAction) {
				case 2: 
					document.images['ico_contact'].src = dirImages+'/'+img+'.png';
					document.getElementById('contact_ico').value = img;
					break;
				case 4:
					document.getElementById('paramconfig').value = 4;
					document.getElementById('param2config').value = img;
					document.forms['configuration'].submit();
					break;
			}
			
			allerA('gerer_numeros','choix_image');
		}
		
		window.onload = function() {
            window.scrollTo(0,1);
            if (erreur != "") { alert(erreur);}
        }
	 
	</script>
	</head>
<body>
	<div id="conteneur">
		<div id="gerer_numeros">
			<div id="appli">
			<?php 
			switch ($configurer)	{
				case 0: /** menu général */
					echo '<form name="configuration" id="configuration" action="'.$_SERVER['PHP_SELF'].'" method="post" >';
						echo '<input type="hidden" id="configurer" name="configurer" value=0 />';
						echo '<input type="hidden" id="paramconfig" name="paramconfig" value=0 />';
						echo '<input type="hidden" id="param2config" name="param2config" value="" />';
					echo '</form>';
					
					echo '<ul>';
					
					echo '<li>';
					echo '<ul>';
						echo '<li class="li2" style="background-image:url('.$nomPage.'.png'.$fraiche.')">'.'<ul>';
						echo '<li class="li0 h29 " id="mon_appli">'.ucfirst($nomPage).'</li>';
						echo '<li class="li0 h28 " id="changer_mon_icone">'.'<a href="javascript:iconePourLAppli();">'.'Changer mon icône'.'</a>'.'</li>';
						echo '</ul>'.'</li>';
					echo '</ul>';
					echo '</li>';
					if (!(file_exists($nouvStockee.'.png'))) { $nouvStockee = $nomLogo;}
					echo '<li>';
					echo '<ul>';
						echo '<li class="li2" style="background-image:url('.$nouvStockee.'.png'.$fraiche.')">'.'<ul>';
						echo '<li class="li3 h29 " id="stocker_une_icone">'.'<a href="javascript:stockerImage();">'.'Stocker une image'.'</a>'.'</li>';
						echo '<li class="li3 h28 " id="voir_les_icones">'.'<a href="javascript:allerA(\'choix_image\',\'gerer_numeros\');">'.'Voir mes images'.'</a>'.'</li>';
						echo '</ul>'.'</li>';
					echo '</ul>';
					echo '</li>';
					
					
					echo '<li>';
					echo '<ul>';
						echo '<li class="li2" style="background-image:url('.'logo'.'.png'.$fraiche.')">'.'<ul>';
						echo '<li class="li3 h57 " id="id_'.'_'.'">'.'<a href="javascript:nouveauContact();">'.'Nouveau contact'.'</a>'.'</li>';
						echo '</ul>'.'</li>';
					echo '</ul>';
					echo '</li>';
					
					echo '<li>';
					echo '<ul>';
					for ($i=0;$i<sizeof($lesPhones);$i++) {
						echo '<li class="li2" style="background-image:url('.$dirPhones.'/'.$lesPhones[$i].'.png'.$fraiche.')">'.'<ul>';
						echo '<li class="li3 h29" id="id_'.$lesPhones[$i].'">'.titreDuXml($lesPhones[$i]).'</li>';
						echo '<li class="li3 h28">';
						echo '<a class="a50 h28" href="javascript:modifierContact(\''.$lesPhones[$i].'\');">'.'Modifier'.'</a>';
						echo '<a class="a50 h28" href="'.$dirPhones.'/'.$lesPhones[$i].'.html'.'" target="_blank" >'.'Lancer'.'</a>';
						echo '</li>';
						echo '</ul>'.'</li>';
					}
					echo '</ul>';
					echo '</li>';
					
					echo '</ul>';
					break;
				case 1: /** stocker une image */
					echo '<form name="configuration" id="configuration" action="'.$_SERVER['PHP_SELF'].'" method="post" enctype="multipart/form-data" >';
						echo '<input type="hidden" id="configurer" name="configurer" value=0 />';
						echo '<input type="hidden" id="paramconfig" name="paramconfig" value=1 />';
						echo '<li>';
							echo '<ul>';
								echo '<li class="li2" style="background-image:url('.$nomPage.'.png'.$fraiche.')">'.'<ul>';
								echo '<li class="li3 h57 " id="id_'.'_'.'">'.'Stocker une image'.'</li>';
								echo '</ul>'.'</li>';
							echo '</ul>';
						echo '</li>';
						echo '<p>';
						echo '<br />'.'<label for="file">Image à stocker ( png, jpg ou gif &lt; '.mo2ko($maxKoImg).'Mo )</label>';
						echo '<br />'.'<input type="hidden" name="MAX_FILE_SIZE" value="'.strval($maxKoImg*1024).'">';
						echo '<br />'.'<input type="file" name="file" id="file" />';
						echo '<br />'.'<input type="button" onclick="annuler();" value="annuler" />';
						echo ' &nbsp; '.'<input type="submit" value="Stocker" />';
						echo '</p>';
					echo '</form>';
					break;
				case 2:
					if ($_POST['param2config']!='') {
						$xml = simplexml_load_file($dirPhones.'/'.$_POST['param2config'].'.xml');
						if ($xml) {
							$titre = strval($xml->titre);
							$i = 0;
							foreach($xml->telephone as $phone) {
								$tph[$i] = array();
								$tph[$i]['nom'] = strval($phone->nom);
								$tph[$i]['numero'] = strval($phone->numero);
								$tph[$i]['image'] = strval($phone->image);
								$tph[$i]['reflet'] = intval($phone->reflet);
								$i++;
							}
					
							$contact_nom = $tph[0]['nom'];
							$contact_nr = $tph[0]['numero'];
							$contact_ico = $tph[0]['image'];
							$contact_rfl = ($tph[0]['reflet']==1) ? "checked" : "" ;
							$nouveauContact = false;
							$contact_ref = $_POST['param2config'];
						}
					}
					echo '<form name="configuration" id="configuration" action="'.$_SERVER['PHP_SELF'].'" method="post">';
						echo '<li>';
							echo '<ul>';
								echo '<li class="li2" style="background-image:url('.$nomPage.'.png'.$fraiche.')">'.'<ul>';
								echo '<li class="li3 h57 " >';
								if ($nouveauContact) { echo 'Nouveau contact';} else { echo 'Modifier ce contact';}
								echo '</li>';
								echo '</ul>'.'</li>';
							echo '</ul>';
						echo '</li>';
						echo '<br />'.'<label for="contact_nom">Nom du contact</label>';
						echo '<br />'.'<input type="text" name="contact_nom" id="contact_nom" value="'.$contact_nom.'"/>';
						echo '<br />';
						echo '<br />'.'<label for="ico_contact">Choisir une icône</label>';
						echo '<br />'.'<img class="ico57 bt57" alt=" Choisir une icône" src="';
						    if ($nouveauContact) { 
								echo $dirImages.'/'.$nomLogo.'.png'.$fraiche;
							}
							else {
								echo $dirPhones.'/'.$contact_ico.'.png'.$fraiche;
							}
							echo '" name="ico_contact" onclick="iconePourNouvContact();" />';
							echo '&nbsp;<input type="checkbox" name="contact_rfl" '.$contact_rfl.'/>';
							echo '<label for="contact_rfl">'.'avec reflet'.'</label>';
						echo '<input type="hidden" id="contact_ico" name="contact_ico" value="';
							if ($nouveauContact) { echo $nomLogo;}
							echo '" />';
						echo '<br />';
						echo '<br />'.'<label for="contact_nr">Numéro téléphonique</label>';
						echo '<br />'.'<input type="tel" name="contact_nr" id="contact_nr" value="'.afficheNrPhone($contact_nr).'" />';
						echo '<input type="hidden" id="configurer" name="configurer" value="0" />';
						echo '<input type="hidden" id="paramconfig" name="paramconfig" value="2" />';
						echo '<input type="hidden" id="param2config" name="param2config" value="'.$contact_ref.'" />';
						echo '<br />';
						echo '<br />'.'<input type="button" onclick="annuler();" value="annuler" />';
						echo ' &nbsp; '.'<input type="submit" value="&nbsp; Valider &nbsp;" />';
						if (!($nouveauContact)) { 
                            echo '<br />';
						    echo '<br />'.'<input type="button" onclick="supprimerContact(\''.$contact_ico.'\',\''.$contact_nom.'\');" value="&#x2717" style="color:#f00;" title="Supprimer ce numéro" />';
						}
						echo '</p>';
					echo '</form>';
					break;
			}
			
			?>
			</div>
			<div id="aide">
			<?php if ($configurer==0): ?>
			<h4> Petite aide et infos</h4>
			<p> Cette &laquo; application &raquo; permet de <span class="nota">créer des icônes d'appel téléphonique sur l'écran d'accueil de l'iPhone</span></p>
			<p> <span class="gras">Mode opératoire</span>
				<br />&nbsp;&bull; Tap sur <span class="motclef">Nouveau numéro</span>
				<br />&nbsp;&bull; Remplir puis valider le formulaire
				<br />&nbsp;&bull; Une ligne montre ce nouveau contact
				<br />&nbsp;&bull; Tap sur <span class="motclef">Lancer</span>
				<br />&nbsp;&bull; Vous arrivez sur la page à enregister
				<br />&nbsp;&bull; Tap sur la flèche qui sort de sa boite (en bas de l'écran)
				<br />&nbsp;&bull; Choisir <span class="motclef">Ajouter à l'écran d'accueil</span>
				<br />&nbsp;&bull; Modifiez le nom proposé, si besoin
				<br />&nbsp;&bull; Tap sur <span class="motclef">Ajouter</span>
				<br />&nbsp;&bull; C'est fait
			</p>
			<?php endif; ?>
			<?php if ($configurer==1): ?>
			<h4>Remarques</h4>
			<p> <span class="gras">Taille de l'image originale</span>
				<br />&nbsp;N'utilisez pas une image trop &laquo; grosse &raquo; (inférieure à 2MO chez Free)
			</p>
			<p> <span class="gras">Image finale</span>
				<br />&nbsp;L'image est transformée en une &laquo; icône &raquo; pour iPhone carrée de 114x114 pixels
			</p>
			<p> <span class="gras">Découpage</span>
				<br />&nbsp;Ne sera retenu que le carré central.
				<br />&nbsp;Exemple : dans une image verticale de 200x300 px.
				<br />&nbsp;on n'utilisera qu'un carré de 200x200 px 
				<br />&nbsp;et on ignorera, en haut et en bas, une bande de 50px de hauteur.  
			</p>
			<p> <span class="gras">Conseil avant d'importer votre image</span>
				<br />&nbsp;Mettez l'image choisie dans votre éditeur d'images préféré.
				<br />&nbsp;1. Sélectionnez-y la partie carrée qui vous intéresse.
				<br />&nbsp;2. Rédimensionnez-la à 500 px de côté.
				<br />&nbsp;Puis sauvegardez cette extraction pour la &laquo; stocker &raquo;
			</p>
			<?php endif; ?>
			</div>
		</div>
		<div id="choix_image">
			<li class="bt_annuler"><a href="javascript:allerA('gerer_numeros','choix_image');">Annuler</a></li>
			<?php 
				for ($i=0;$i<sizeof($lesImages);$i++) {
					echo '<img alt="" class="ico114" src="'.$dirImages.'/'.$lesImages[$i].'.png'.'" onclick="imageChoisie(\''.$lesImages[$i].'\')"/>';
				}
			
			?>
			
		</div>
		
	</div>	
</body>
</html>

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.