ARCHIVO: index.php
Código PHP:
<?php
$status = "";
$carpeta="archivos/";
if (isset($_POST["enviar"])) {
// obtenemos los datos del archivo
$tamano = $_FILES["archivo"]['size'];
$tipo = $_FILES["archivo"]['type'];
$archivo = $_FILES["archivo"]['name'];//nombre fuente
$prefijo = substr(md5(uniqid(rand())),0,6);
$extension = explode(".",$archivo);
$num = count($extension)-1;
$nombre=basename($archivo,".".$extension[$num]);//nombre base del archivo
$imagen=$nombre."_".$prefijo.".".$extension[$num];//nombre real de la imagen
if ($archivo != "") {
$ext=strtolower($extension[$num]);
if($ext=='jpg' or $ext=='gif' or $ext=='png'){//depende de que deseas que suban....
$destino = $carpeta.$imagen;//lugar donde se almacenara
if (copy($_FILES['archivo']['tmp_name'],$destino)){
$status = "Archivo subido: <b>".$imagen."</b>";
} else {
$status = "Error: No se logro subir el archivo";
}
} else {
$status = "Error: Solo se permiten (*.jpg,*.gif,*.png)";
}
} else {
$status = "Error: Archivo no encontrada para subir al Servidor";
}
}
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Servidor Rustica</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
<script language="javascript">
var XMLRequest;
var XMLRequest2;
function getHTTPObject() {
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else if (window.ActiveXObject){
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
function elimina(ar,txt){
XMLRequest2=getHTTPObject();
var url="eliminar.php?ar="+ar;//habre la pagina y elimina el archivo enviado
XMLRequest2.open("GET",url,true);
XMLRequest2.send(null);
self.location = "index.php?";
}
</script>
</head>
<body>
<table width="413" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="413" height="40" class="titulo">Servidor Rustica</td>
</tr>
<tr>
<td class="text">Por favor seleccione el archivo a subir:</td>
</tr>
<tr>
<td class="text">
<form action="index.php" method="post" enctype="multipart/form-data" >
<input name="archivo" type="file" class="casilla" id="archivo" size="35" />
<input name="enviar" type="submit" class="boton" id="enviar" value="Upload File" />
</form>
</td>
</tr>
<tr>
<td class="text" style="color:#990000"><?php echo $status; ?></td>
</tr>
<tr>
<td height="30" class="subtitulo">Listado de Archivos</td>
</tr>
<tr>
<td class="infsub"><br />
<?php
if ($gestor = opendir($carpeta)) {
while (false !== ($arch = readdir($gestor))){
if ($arch != "." && $arch != "..") {
$extension = explode(".",$arch);
$num = count($extension)-1;
$ext=strtolower($extension[$num]);
if($ext=='jpg' or $ext=='gif' or $ext=='png'){ $archivos[]=$arch; }
}
}
closedir($gestor);
// Ordenas tu array:
sort($archivos);
// (y mueves el puntero interno del array al principio ..)
reset($archivos);
$i=0;
echo '<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">';
foreach ($archivos as $arch){
$im=getimagesize($carpeta.$arch);
$an=$im[0]; $al=$im[1];
($i%2==0)?$color="#CCCCCC":$color="#999999";
echo "<tr style='background:$color'><td width='300' align='left'><a href='#' class='linkli' >".$arch."</a></td>";
echo "<td width='40' align='center'><a href='#' onClick='window.open(\""$carpeta.$arch."\",\"Imagen\",\"menubar=0,resizable=0,width=".$an.",height=".$al."\");return false;' class=\"abrir\"><img src='../imagenes/ver.png' width='20' height='20' title='Ver' alt='Ver' border='0'/></a></td>";
echo "<td width='40' align='center'><a href='index.php' onClick='elimina(\"".$arch."\",\"".$txt."\");' class=\"abrir\"><img src='../imagenes/eliminar.png' width='20' height='20' title='Eliminar' alt='Eliminar' border='0'/></a></td><td width='20'></td></tr>";
$i++;
}
echo "</table>";
}
?>
</td>
</tr>
</table>
</body>
</html>
archivo: eliminar.php
Código PHP:
<?php
$ar=$_REQUEST[ar];
if(isset($ar)){
unlink("imagenes/".$ar);
}
?>
archivo: estilo.css
Código PHP:
body{
overflow:scroll;
margin:0px;
background:#F3F3F3;
}
.titulo {
font-family: "Trebuchet MS", Verdana;
font-size: 18px;
font-weight: bolder;
color: #990000;
text-decoration: none;
border-top-width: 1px;
border-bottom-width: 2px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #D4D0C8;
border-bottom-color: #D4D0C8;
text-align: left;
padding-left: 30px;
}
.casilla {
font-family: "Trebuchet MS", Verdana;
font-size: 11px;
font-weight: normal;
color: #999999;
text-decoration: none;
border: 1px solid #D4D0C8;
}
.boton {
border: 1px solid #D4D0C8;
font-family: "Trebuchet MS", Verdana;
font-size: 10px;
font-weight: bold;
color: #990000;
text-decoration: none;
background-color: #D4D0C8;
vertical-align: middle;
}
.subtitulo {
font-family: "Trebuchet MS", Verdana;
font-size: 16px;
font-weight: bolder;
color: #999999;
text-decoration: none;
text-align: left;
padding-left: 30px;
}
.subtitulo:hover {
font-family: "Trebuchet MS", Verdana;
font-size: 16px;
font-weight: bolder;
color: #999999;
text-decoration: underline;
text-align: center;
}
.subtext {
font-family: "Trebuchet MS", Verdana;
font-size: 12px;
font-weight: normal;
color: #999999;
text-decoration: none;
text-align: left;
padding-left: 30px;
background-color: #EFEFEF;
}
.infsub {
font-family: "Trebuchet MS", Verdana;
text-decoration: none;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #D4D0C8;
}
.text {
font-family: "Trebuchet MS", Verdana;
font-size: 12px;
font-weight: normal;
color: #999999;
text-decoration: none;
text-align: left;
padding-left: 30px;
padding-top: 10px;
}
.abrir {
font-family: "Trebuchet MS", Verdana;
font-size: 12px;
color: #CC0000;
text-decoration: none;
text-align: center;
}
a.abrir:hover {
font-family: "Trebuchet MS", Verdana;
font-size: 12px;
color: #CC0000;
text-decoration: underline;
text-align: center;
}
.link{
font-family: "Trebuchet MS", Verdana;
font-size: 12px;
font-weight: bold;
color: #990000;
text-decoration: none;
text-align: center;
}
a.link:hover {
font-family: "Trebuchet MS", Verdana;
font-size: 12px;
font-weight: bold;
color: #990000;
text-decoration: underline;
text-align: center;
}
li {
list-style-type: circle;
font-size: 16px;
text-decoration: none;
}
a.linkli {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #333333;
text-decoration: none;
padding-left: 30px;
}
a.linkli:hover {
font-weight: bold;
color: #000000;
text-decoration: underline;
}
y nada mas.... suerte.