Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    New Coder
    Join Date
    May 2012
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Upload status bar not show

    hi friends i try this tutorial step by step sucessfully everthing but after this not show upload status bar after file upload show only success message
    please check it whats wrong
    http://www.phpsugar.com/forum/viewto...=9702&start=15

  • #2
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Location
    Saskatoon, Saskatchewan
    Posts
    16,994
    Thanks
    4
    Thanked 2,662 Times in 2,631 Posts
    Post the code since that link requires registration.
    This is likely a Javascript problem though, not a PHP one.
    PHP Code:
    header('HTTP/1.1 420 Enhance Your Calm'); 
    Been gone for a few months, and haven't programmed in that long of a time. Meh, I'll wing it ;)

  • #3
    New Coder
    Join Date
    May 2012
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts
    i don't know what you say please tell me whats change in code

  • #4
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Location
    Saskatoon, Saskatchewan
    Posts
    16,994
    Thanks
    4
    Thanked 2,662 Times in 2,631 Posts
    Post the code. It is likely a javascript problem not a PHP one.
    PHP Code:
    header('HTTP/1.1 420 Enhance Your Calm'); 
    Been gone for a few months, and haven't programmed in that long of a time. Meh, I'll wing it ;)

  • #5
    Regular Coder Arcticwarrio's Avatar
    Join Date
    May 2012
    Location
    UK
    Posts
    738
    Thanks
    20
    Thanked 85 Times in 85 Posts
    theres no way of us knowing if your code matched the tutorial without you posting it here
    There are 10 types of people on CodingForums,
    Those who understand Binary and those who dont.
    Get Cloud Hosting now from only£59 / month

  • #6
    New Coder
    Join Date
    May 2012
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts

  • #7
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Location
    Saskatoon, Saskatchewan
    Posts
    16,994
    Thanks
    4
    Thanked 2,662 Times in 2,631 Posts
    Read my first post. That thread requires registration so you'll need to post the code that matters here.
    PHP Code:
    header('HTTP/1.1 420 Enhance Your Calm'); 
    Been gone for a few months, and haven't programmed in that long of a time. Meh, I'll wing it ;)

  • #8
    New Coder
    Join Date
    May 2012
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts
    As requested by a few members, I have just added an jQuery upload status bar to the public upload form.

    This has been tested on v1.8, I do not have previous versions to try it on.

    Your PHP installation needs the PECL extension: uploadstatus installed for it to work.

    You can find out if your PHP installation has it installed by creating a file named phpinfo.php and putting this code in the file:

    [code=php]<?php

    phpinfo();

    ?>[/code]

    Save and upload the file to your server and open it in your browser: http://www.yourdomain.com/phpinfo.php

    You should see something like the following if it is installed:



    If you have the extension installed, then you can continue with the code edits, if its not installed then the mod will not work.

    Several code edits

    upload.php

    Find on line 304:
    [code=php]$smarty->assign('form_action', $form_action); [/code]

    Add above:
    [code=php]$uid = md5(uniqid(mt_rand())); [/code]

    Find on line 307:
    [code=php]$smarty->assign('max_file_size', $max_filesize_bytes); [/code]

    Add Below:
    [code=php]$smarty->assign('unique_id', $uid); [/code]

    Save and close upload.php

    Open /templates/default/css/new-style.css

    Find:
    Code:
    /*-----------------------------------------------------------------------------------*/
    /*	1.	Document Setup (body, common classes, structure etc)
    /*-----------------------------------------------------------------------------------*/
    Add Before:
    Code:
    /*---------------------------------------------------------------*/
    /* FILE UPLOAD PROGRESS BAR									        	*/
    /*---------------------------------------------------------------*/
    #progress-bar, #upload-frame {
    display: none;
    width:50%;
    margin-left:auto;
    margin-right:auto;
    }
    /*---------------------------------------------------------------*/
    /* FILE UPLOAD PROGRESS BAR									        	*/
    /*---------------------------------------------------------------*/
    Save And Close

    Open /templates/default/header.tpl

    Find on line 76:
    Code:
    <script type="text/javascript" src="{$smarty.const._URL}/js/swfobject.js"></script>
    Add After:
    Code:
    <script type="text/javascript" src="{$smarty.const._URL}/js/upload-status.js"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/start/jquery-ui.css" rel="stylesheet" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
    Find on line 83:
    Code:
    </head>
    <body>
    Add After:
    [code=php]{literal}
    <script>
    (function ($) {
    // We'll use this to cache the progress bar node
    var pbar;
    // This flag determines if the upload has started
    var started = false;
    $(function () {
    // Start progress tracking when the form is submitted
    $('#upload-video-form').submit(function() {
    // Hide the form
    $('#upload-video-form').hide();
    // Cache the progress bar
    pbar = $('#progress-bar');
    // Show the progress bar
    // Initialize the jQuery UI plugin
    pbar.show().progressbar();
    // We know the upload is complete when the frame loads
    $('#upload-frame').load(function () {
    // This is to prevent infinite loop
    // in case the upload is too fast
    started = true;
    // Do whatever you want when upload is complete
    alert('Upload Completed Successfully!');
    });
    // Start updating progress after a 1 second delay
    setTimeout(function () {
    // We pass the upload identifier to our function
    updateProgress($('#uid').val());
    }, 1000);
    });
    });
    function updateProgress(id) {
    var time = new Date().getTime();
    // Make a GET request to the server
    // Pass our upload identifier as a parameter
    // Also pass current time to prevent caching
    $.get('getprogress.php', { uid: id, t: time }, function (data) {
    // Get the output as an integer
    var progress = parseInt(data, 10);
    if (progress < 100 || !started) {
    // Determine if upload has started
    started = progress < 100;
    // If we aren't done or started, update again
    updateProgress(id);
    }
    // Update the progress bar percentage
    // But only if we have started
    started && pbar.progressbar('value', progress);
    });
    }
    }(jQuery));
    </script>{/literal}[/code]

    Make sure the code above is has the {literal} tag before the <script> tag and that the closing {/literal} follows the closing </script> tag.
    Without the {literal}{/literal} tags, you will get a blank upload.php page due to the template reading the {} in the code.

    Save and close header.tpl

    Open upload.tpl

    Find on line 49:
    Code:
    <form class="form-horizontal" name="upload-video-form" id="upload-video-form" enctype="multipart/form-data" method="post" action="{$form_action}">
    Replace with:
    Code:
    <form class="form-horizontal" name="upload-video-form" id="upload-video-form" enctype="multipart/form-data" method="post" action="{$form_action}" target="upload-frame">
    Find on line 55:
    Code:
    <input type="file" name="mediafile" value="" size="40">
    Add Before:
    Code:
    <input type="hidden" id="uid" name="UPLOAD_IDENTIFIER" value="{$unique_id}">
    Find on line 111:
    Code:
    </fieldset>
    </form>
    Add After:
    Code:
    <div id="progress-bar"></div>
    <iframe id="upload-frame" name="upload-frame"></iframe>
    Save and close upload.tpl

    Upload the above files, backing up your original files first.

    Create the new files.

    Create a new .php file and name it upload-status.php
    Put this code in the file:
    [code=php]<?php

    if(isset($_GET['uid']))
    {
    // Fetch the upload progress data
    $status = uploadprogress_get_info($_GET['uid']);

    if($status)
    {
    // Calculate the current percentage
    echo round($status['bytes_uploaded']/$status['bytes_total']*100);
    }
    else
    {
    // If there is no data, assume it's done
    echo 100;
    }
    }

    ?>[/code]

    Upload that file to the main root (public_html) directory where upload.php is.

    Create a file named upload-status.js
    Put this code into it:
    [code=php](function ($)
    {
    var pbar;
    var started = false;

    $(function ()
    {
    $("#upload-video-form").submit(function()
    {
    pbar = $("#progress-bar");
    pbar.show().progressbar();
    $("#upload-frame").load(function ()
    {
    started = true;
    alert("Upload Complete!");
    });
    setTimeout(function ()
    {
    updateProgress($("#uid").val());
    }, 1000);
    });
    });

    function updateProgress(id)
    {
    var time = new Date().getTime();
    $.get("upload-status.php", { uid: id, t: time }, function (data)
    {
    var progress = parseInt(data, 10);
    if (progress < 100 || !started)
    {
    started = progress < 100;
    updateProgress(id);
    }
    started && pbar.progressbar("value", progress);
    });
    }
    }(jQuery)); [/code]

    Save and upload to the main /js/ folder is (ie /home/username/public_html/js/)

    That's it (I think) make sure you upload the files in binary mode and then visit the upload form and upload a mp3 or video and watch the upload bar in action.

    Do not PM me for support, reply here if you have issues.
    this is full code

  • #9
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Location
    Saskatoon, Saskatchewan
    Posts
    16,994
    Thanks
    4
    Thanked 2,662 Times in 2,631 Posts
    The only PHP code here is this:
    PHP Code:
    <?php

    if(isset($_GET['uid']))
    {
    // Fetch the upload progress data
    $status uploadprogress_get_info($_GET['uid']);

    if(
    $status)
    {
    // Calculate the current percentage
    echo round($status['bytes_uploaded']/$status['bytes_total']*100);
    }
    else
    {
    // If there is no data, assume it's done
    echo 100;
    }
    }

    ?>
    Which looks correct to me. Beyond that there is a couple of configuration changes you need to hook it in.

    As of 5.4, this library is no longer required since you can poll the sessions instead. The only thing you need to really do is verify that that PHP is working as expected. This will not be as easy as it sounds though; since the http is stateless, the only thing direct access can tell you is if the functions exist. Beyond that, you'll need to probably run a socket or curl test in order to test it out.
    Everything else comes down to your javascript code.
    PHP Code:
    header('HTTP/1.1 420 Enhance Your Calm'); 
    Been gone for a few months, and haven't programmed in that long of a time. Meh, I'll wing it ;)

  • #10
    New Coder
    Join Date
    May 2012
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts
    i think post in to java thread

  • #11
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Location
    Saskatoon, Saskatchewan
    Posts
    16,994
    Thanks
    4
    Thanked 2,662 Times in 2,631 Posts
    javascript, not java. Java and javascript are two completely different languages.
    PHP Code:
    header('HTTP/1.1 420 Enhance Your Calm'); 
    Been gone for a few months, and haven't programmed in that long of a time. Meh, I'll wing it ;)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •