статус upload`a на javascript

Тема в разделе "Веб-дизайн", создана пользователем Albert22, 10 сен 2008.

Статус темы:
Закрыта.
Модераторы: zek24
  1. Albert22

    Albert22

    Регистр.:
    30 мар 2008
    Сообщения:
    270
    Симпатии:
    10
    привет
    помогите сделать следующую примочку для файлобменника:
    нужно чтобы человек, выгружающий на сервер файл, видел статус его загрузки - сколько процентов выполнено, сколько данных передано. вот как здесь: Перейти по ссылке
    Перейти по ссылке
    помогите, пожалуйста!
     
  2. megadude

    megadude

    Регистр.:
    6 сен 2006
    Сообщения:
    184
    Симпатии:
    66
    Вот здесь неплохой скрипт -
    Перейти по ссылке

    Юзает Mootools + Flash
    Что самое красивое в нем - позволяет выбрать одновременно несколько файлов для аплода :)
     
  3. Jameson

    Jameson Читатель

    Заблокирован
    Регистр.:
    25 июн 2007
    Сообщения:
    406
    Симпатии:
    92
    Без привязки к фреймворкам:
    Перейти по ссылке

    Как раз на этом флэшкомпоненте базируются все решения по таким индикаторам и мультизагрузке, в общем-то.
     
  4. Albert22

    Albert22

    Регистр.:
    30 мар 2008
    Сообщения:
    270
    Симпатии:
    10
    SWFUpload как-то по понятнее, но он не пишет проценты, скорость и пр., а именно это и нужно. Да, это имеется в Fancy Upload, но в ней не разобраться... С моими нулевыми знаниями AJAXa максимум что я смог сделать - это вот что:
    HTML:
    
    
    <form action="fancy_upload.php" method="post" enctype="multipart/form-data" id="form-demo">
    
    <script type="text/javascript" src="/fancyupload/mootools.js"></script>
    <script type="text/javascript" src="/fancyupload/Swiff.Uploader.js"></script>
    <script type="text/javascript" src="/fancyupload/Fx.ProgressBar.js"></script>
    <script type="text/javascript" src="/fancyupload/FancyUpload2.js"></script>
    
    	<script type="text/javascript">
    		/* <![CDATA[ */
    
    window.addEvent('load', function() {
    
    	var swiffy = new FancyUpload2($('demo-status'), $('demo-list'), {
    		'url': $('form-demo').action,
    		'fieldName': 'photoupload',
    		'path': '/fancyupload/Swiff.Uploader.swf',
    		'onLoad': function() {
    			$('demo-status').removeClass('hide');
    			/*$('demo-fallback').destroy();*/
    		}
    	});
    
    	/**
    	 * Various interactions
    	 */
    
    	$('demo-browse-all').addEvent('click', function() {
    		swiffy.browse();
    		return false;
    	});
    
    	$('demo-browse-images').addEvent('click', function() {
    		swiffy.browse({'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png'});
    		return false;
    	});
    
    	$('demo-clear').addEvent('click', function() {
    		swiffy.removeFile();
    		return false;
    	});
    
    	$('demo-upload').addEvent('click', function() {
    		swiffy.upload();
    		return false;
    	});
    
    });
    		/* ]]> */
    var progressb=document.getElementById("progressblock");
    	</script>
    
    
    	<div id="demo-status" style="width:60%;" class="hide">
    <a href="#" id="demo-browse-all" class="button">Обзор</a>
    <a href="#" id="demo-browse-images" class="button">Обзор только картинок</a>
    <a href="#"style="color:red !important;" id="demo-clear" class="button">Очистить список</a><br/>
    <input type="submit" name=b onClick="form.b.disabled=true" style=" height:30px !important; font-size:16pt !important;" id="demo-upload" class="button" value="Выгрузить"/><br/>
    <br/>
    		<div>
    			<strong class="overall-title">Overall progress</strong><br />
    			<img src="/fancyupload/bar.gif" class="progress overall-progress" />
    		</div>
    		<div>
    			<strong class="current-title">File Progress</strong><br />
    			<img src="/fancyupload/bar.gif" class="progress current-progress" />
    		</div>
    		<div class="current-text"></div>
    
     
    	<ul id="demo-list"></ul>
     </div>
    </form>
    
    Это был код формы, отправляющей файл. А вот принимающий скрипт fancy_upload.php:
    PHP:
    <?php
    session_start
    ();
    print 
    '_FILES:<br/>';
    foreach (
    $_FILES as $key => $val){
    print 
    '<b>'.$key.' = '.$val.'<br/>';}
    print 
    '<hr/>';
    print 
    '_SESSION:<br/>';
    foreach (
    $_SESSION as $key => $val){
    print 
    '<b>'.$key.' = '.$val.'<br/>';}
    print 
    '<hr/>';
    print 
    '_REQUEST:<br/>';
    foreach (
    $_REQUEST as $key => $val){
    print 
    '<b>'.$key.' = '.$val.'<br/>';}
    print 
    '<hr/>';
    print 
    '_POST:<br/>';
    foreach (
    $_POST as $key => $val){
    print 
    '<b>'.$key.' = '.$val.'<br/>';}
    print 
    '<hr/>';
    ?>
    тестовый вариант, он должен выводить элементы входящих массивов. и выводит, но кроме $_SESSION, а именно в нем передается особо важный идентификатор пользователя. что самое интересное - ошибка в скрипте отпадает - в ИЕ 7 все работает, массив сессии передается. Пожалуйста, помогите разобраться!
    Вот как это работает: Перейти по ссылке
     
  5. gregzem

    gregzem

    Регистр.:
    21 окт 2007
    Сообщения:
    201
    Симпатии:
    66

    Статья в тему:
    Перейти по ссылке
    И вот:
    Перейти по ссылке
    И еще одна:
    Перейти по ссылке

    Несметное кол-во реализаций:
    Перейти по ссылке

    В частности Перейти по ссылке


    Кстати, стоит отметить важные моменты. Есть две реализации прогрессбара для процесса аплоада: один с патчем для PHP (PECL extension), второй - без патча. И не обязательно делать пуллинг статуса на Ajax, можно через hidden IFRAME.
     
  6. Albert22

    Albert22

    Регистр.:
    30 мар 2008
    Сообщения:
    270
    Симпатии:
    10
    Не помогло.
    После всего:
    PHP:
    print '<form action="/script.php?id='.$_SESSION['id'].'" ...
    Вот и "вся любовь" :)
     
Статус темы:
Закрыта.