Check if the file is downloading in Chrome with the api

Question

I have planned to develop a Google Chrome extension which act as a download manager ie. when a user downloads any item from the browser the extension must catch it and display its downloading progress at the top.

So I have done with two fles named manifest.json and popup.html .

manifest.json

The main file which comes in action

{
  "manifest_version": 2,
  "name": "One-click Kittens",
 "description": "something",
  "version": "1.0",
  "permissions": [
"<all_urls>",
"downloads"
  ],

 "content_scripts": [
{

  "matches": ["<all_urls>"],
  "js": ["myscript.js"]
}
  ],





 "browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
}
}

popup.html

The file which act as a popup which appears on the sidebar of the Chrome.

  <html>
<head>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/modernizr.js" type="text/javascript"></script>
<script>
    $(document).ready(function() {
        if(!Modernizr.meter){
            alert('Sorry your brower does not support HTML5 progress bar');
        } else {
            var progressbar = $('#progressbar'),
                max = progressbar.attr('max'),
                time = (1000/max)*5,    
                value = progressbar.val();

            var loading = function() {
                value += 1;
                addValue = progressbar.val(value);

                $('.progress-value').html(value + '%');

                if (value == max) {
                    clearInterval(animate);                    
                }
            };

            var animate = setInterval(function() {
                loading();
            }, time);
        };
    });
</script>
</head>
<body>
<div class="demo-wrapper html5-progress-bar">
    <div class="progress-bar-wrapper">
        <progress id="progressbar" value="0" max="100"></progress>
        <span class="progress-value">0%</span>
    </div>
</div>
</body>
</html>

myscript.js

<script>
var c = chrome.downloads.search({query: }, function(results){
            var formattedResults = [];
            for(var i in results) {

                chrome.downloads.download(
                    {
                        method: "POST",
                        filename: results[i]
                    }, function () {
                        if(results[i] == undefined ) {
                            console.log('files arent located');
                        } else {
                            console.log('its downloading');
                        }



)

})

</script>

The problems that I face

When I run the popup.js in the manifest file it doesn't show me the progress (ie. value incrementation) but it works just fine when I run it separately.
I just want to able to detect the file in which the user has downloaded and display its progress on popup.html.

I have tried chrome.downloads but it didn't help. Maybe it's because I am not an expert in Google apis.

Answer 1

Check out Google's example extensions that use the chrome.downloads api . For example, as Graham T suggested, you could probably use the onChanged event which is used by the following example extension: Download and Open Button and Download Manager Button .

chrome.downloads

https://developer.chrome.com/extensions/downloads
Use the chrome.downloads API to programmatically initiate, monitor, manipulate, and search for downloads.

From Download Manager Button:

DownloadItem.prototype.onChanged = function(delta) {
  for (var key in delta) {
    if (key != 'id') {
      this[key] = delta[key].current;
    }
  }
  this.render();
  if (delta.state) {
    setLastOpened();
  }
  if ((this.state == 'in_progress') && !this.paused) {
    DownloadManager.startPollingProgress();
  }
};

I recommend looking at the rest of the sample code as it should be clearer on how to properly use chome.downloads.

Check if the file is downloading in Chrome with the api

Question

manifest.json

popup.html

myscript.js

The problems that I face

1 answers

solution1
3 ACCPTED 2014-10-27 14:29:59

Check if the file is downloading in Chrome with the api

Question

manifest.json

popup.html

myscript.js

The problems that I face

1 answers

solution1 3 ACCPTED 2014-10-27 14:29:59

solution1
3 ACCPTED 2014-10-27 14:29:59