• 10-09-2012, 12:39:42
    #1
    Merhaba uzun zamandır arıyordum flash vs.. kullanmadan javascript ve php ile progress yapını phpacademy videoları izleyerek yaptım kodlarıda sizlerle paylaşıyorum.

    inputun multiple özelligi sayesinde tek seferde birden fazla dosya secebilirsiniz. Her tarayıcı bunu desteklemeyebilir örnek ie7



    upload.php
    <?php
            
      if(!empty($_FILES['file'])){
          foreach ($_FILES['file']['name'] as $key=>$name){
              $isim = rand(0,999999);
              $isim2 = rand(0,99999);
              $uzanti = substr($_FILES["file"]["name"][$key],-4,4);
              $dizin = "files/".$isim2.'-'.$isim.$uzanti;
              if($_FILES['file']['error'][$key]==0 && move_uploaded_file($_FILES['file']['tmp_name'][$key],$dizin)){
                  
                  $uploaded[] = $dizin;
              }
          }
          
          if(!empty($_POST['ajax'])){
               die(json_encode($uploaded));
          }else{
             
          }
      }  
            
      ?>
    <!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" xml:lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
        <title>Dosya Upload</title>
        <script type="text/javascript" src="upload.js"></script>
        <style type="text/css">
            #upload_progress{
                display: none;
            }
            
        </style>
    </head>
    <body>
        <div id="uploaded">
            <?php
            
            if(!empty($uploaded)){
               
                foreach ($uploaded as  $name){
                    echo '<div><a href="'.$name.'">'.$name.'</a></div>';
                }
                
            }
            
            ?>
            
        </div>
        
        <div id="upload_progress">
            
        </div>
        
        <div>
            <form action="" method="POST" enctype="multipart/form-data">
                <input type="file" id="file" name="file[]" multiple="multiple" />
                <input type="submit" value="Upload" id="submit" />
            </form>
            
        </div>
        
    </body>
    </html>

    upload.js

    var handleUpload = function(event){
      event.preventDefault();
      event.stopPropagation();
      
      var fileInput = document.getElementById('file');
      var data = new FormData();
      data.append('ajax',true);
      for(var i=0; i<fileInput.files.length; i++){
          data.append('file[]',fileInput.files[i]);
      }
      
      var request = new  XMLHttpRequest();
      request.upload.addEventListener('progress', function(event){
          if(event.lengthComputable){
              var percent = event.loaded/event.total;
              var progress = document.getElementById('upload_progress');
              
              while(progress.hasChildNodes()){
                  progress.removeChild(progress.firstChild);
              }
              progress.appendChild(document.createTextNode(Math.round(percent *100)+' %'));
              
          }
      });
      request.upload.addEventListener('load', function(event){
          document.getElementById('upload_progress').style.display='none';
      });
      request.upload.addEventListener('error', function(event){
          alert("Dosya Yüklenemedi...");
      });
      
      request.open('POST', 'upload.php');
      request.setRequestHeader('Cache-Control', 'no-cache');
        document.getElementById('upload_progress').style.display='block';
      request.send(data);
    }
    
    window.addEventListener('load', function(event){
        var submit =  document.getElementById('submit');
        submit.addEventListener('click', handleUpload);
    });
    files diye bir klasör oluşturun.

    Not: Her türlü dosya türünü kabul eder şuanda filtreleme yapılmadı.
  • 10-09-2012, 12:46:38
    #2
    Güzel paylaşım emimin bir çok kişinin işine yaracaktır
  • 10-09-2012, 12:54:20
    #3
    Kimlik doğrulama veya yönetimden onay bekliyor.
    alex candır can ( php academy kurucusu )
  • 10-09-2012, 12:58:46
    #4
    Üyeliği durduruldu
    paylaşımınız için 1 teşekkürü borç bilirim sayın enc0der
  • 10-09-2012, 13:05:14
    #5
    Kimlik doğrulama veya yönetimden onay bekliyor.
    Dosya isimleri sayısal değerlerle random olarak belirleniyor sanırım.. Buna müdahale şansımız var mı ?

    (Türkçe karakter kısıtlaması getirerek) örnek bir yapı ile; "Test Amaçlı Başlık" yerine "test_amacli_baslik" şeklinde bir yapı mümkün müdür?
  • 10-09-2012, 13:14:16
    #6
    xcLuSive adlı üyeden alıntı: mesajı görüntüle
    Dosya isimleri sayısal değerlerle random olarak belirleniyor sanırım.. Buna müdahale şansımız var mı ?

    (Türkçe karakter kısıtlaması getirerek) örnek bir yapı ile; "Test Amaçlı Başlık" yerine "test_amacli_baslik" şeklinde bir yapı mümkün müdür?
    evet var.
    yanlız bu verecegim fonksiyon çok işlevsel degil
    function replace_tr($text) {
    $text = trim($text);
    $search = array('Ç','ç','Ğ','ğ','ı','İ','Ö','ö','Ş','ş','Ü','ü',' ', "'", '"', '^', '&', '.', ',', '+', ':', '-', '?', '!');
    $replace = array('C','c','G','g','i','I','O','o','S','s','U','u','_', '', '', '',  '', '_', '_', '_', '_', '_', '_', '_');
    $new_text = str_replace($search,$replace,$text);
    return $new_text;
    }
    şu satırda
    if($_FILES['file']['error'][$key]==0 && move_uploaded_file($_FILES['file']['tmp_name'][$key],'files/'.replace_tr($name))){
    şeklinde kullanırsın
    $uploaded[] = $dizin;
    nide
    $uploaded[] = $name;
    ile değiştir
  • 10-09-2012, 13:15:53
    #7
    alex benzeri var mı bildiğiniz, takip ettiğiniz.
  • 10-09-2012, 13:24:13
    #8
    enc0der adlı üyeden alıntı: mesajı görüntüle
    evet var.
    yanlız bu verecegim fonksiyon çok işlevsel degil...
    ..
    .
    Teşekkürler, müdahale istediğim ölçüde sağlıklı bir sonuç verdi.

    İşlevsellik açısından ne gibi bir sıkıntı yaratma durumu söz konusu ?
  • 11-09-2012, 09:43:18
    #9
    Güzel paylaşım çdk işime yarayacak. Saolasın Encoder