5

I am trying to add to my website a download link to the latest github release of a project. For example the link https://github.com/mongodb/mongo/archive/r3.0.0-rc7.zip does link to the latest release (as of today), but I do not want to hard-code the version number on the web site.

I found several questions about this issue, answers using curl, ajax or php.

I tried the solution using ajax which uses the github release API:

<!DOCTYPE html>

<HTML> <BODY>

<script language="javascript" type="text/javascript">   
    $(document).ready(function () { 
        GetLatestReleaseInfo();   
    });   

    function GetLatestReleaseInfo() {
      $.getJSON("https://github.com/mongodb/mongo/releases").done(function (json) {
         var release = json[0];
         var asset = release.assets[0];
         var downloadURL = "https://github.com/mongodb/mongo/releases" + release.tag_name + "/" + asset.name;
         $(".mongodb-download").attr("href", downloadURL);   
      });    
    } 
</script>

<a href="GetLatestReleaseInfo();">Link</a> 
<a href="" onclick="location.href=this.href+downloadURL;return false;">Link2</a> 
<a href="" onclick="location.href=this.href+mongodb-download;return false;">Link3</a>

</BODY>
</HTML>

but I do not manage to call the javascript function correctly, as it seems in my tries above (Link, Link2 and Link3). I'm not very familiar with javascript or ajax, so I'd appreciate any help; maybe there is a simpler way without Ajax?

Community
  • 1
  • 1
user1981275
  • 13,002
  • 8
  • 72
  • 101

3 Answers3

10

You're loading an html page instead of their REST API.The correct url to get the tags is https://api.github.com/repos/mongodb/mongo/tags

You may want to read more about github api over here - https://developer.github.com/v3/repos/

Your html could look like this :

<!DOCTYPE html>

<HTML> <BODY>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script language="javascript" type="text/javascript">  

$(document).ready(function () {
     GetLatestReleaseInfo();  
});  


function GetLatestReleaseInfo() {
   $.getJSON("https://api.github.com/repos/mongodb/mongo/tags").done(function (json) {
        var release = json[0];
        var downloadURL = release.zipball_url;
        $("#mongodb-download").attr("href", downloadURL);  
   });    
}  
</script>

<a id='mongodb-download' href="">Download latest mongo</a>

</BODY>
</HTML>
Gal Sisso
  • 1,939
  • 19
  • 20
  • I cannot get this to work; I use your function and link, then click on the link and get redirected to the same site. When I right-click and then "save link address", it saves me the address of my web site. – user1981275 Feb 02 '15 at 11:52
  • use `console.log()` in the function to detect the downloadURL also check console and make sure there arent any errors there. – Gal Sisso Feb 02 '15 at 11:54
  • not quite sure how... If I type `mongodb-download` into the console, it returns the tag with that ID. If I type `GetLatestReleaseInfo()` I get `ReferenceError: $ is not defined`. In which part of my html file do I have to call `GetLatestReleaseInfo()`? – user1981275 Feb 02 '15 at 12:06
  • If your getting `$ is not defined` that means your not loading your jquery library or loading it after `GetLatestReleaseInfo()` – Gal Sisso Feb 02 '15 at 12:08
  • Now I am attempting to load jquery library with ``. Typing `GetLatestReleaseInfo()` into the console gives me an uncaught error and a type error `undefined is not a function` – user1981275 Feb 02 '15 at 12:20
  • well I cant really tell what your doing but you probably declare `GetLatestReleaseInfo()` after calling it . anyhow I made a simple demo on paste bin to show you an example how it should look like - http://pastebin.com/bxhpw7W2 – Gal Sisso Feb 02 '15 at 12:26
  • Works fine with the example you gave me, thanks! I edited the answer and added the full code. – user1981275 Feb 02 '15 at 13:28
  • One thing I noticed: When I put a second link to the same location, only the first one works. Example: putting `Download latest mongo 2` just after the first link, won't do anything on click. Why is that? – user1981275 Feb 02 '15 at 15:08
  • You can only declare 1 id in an html document,id's are unique if you want to change multiple elements use class for that and then using `.each` function in jquery to manipulate all elements href attribute. – Gal Sisso Feb 02 '15 at 15:14
2

For me, this worked well:

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script>
            $(document).ready (function () {
                $.getJSON("https://api.github.com/repos/mongodb/mongo/tags").done(function (data) {
                    $ ('#mongodb-download').attr ('href', data[0].zipball_url); 
                })
            });
        </script>
    </head>
    <body>
        <a id="mongodb-download">Download the latest version of MongoDB</a>
    </body>
</html>

If you are getting problems with undefined, just change the $ into jQuery and it should all work!

Xesau
  • 161
  • 1
  • 9
1
<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script>
            jQuery(document).ready (function () {
                jQuery.getJSON("https://api.github.com/repos/mongodb/mongo/tags").done(function (data) {
                    jQuery('#mongodb-download').attr ('href', data[0].zipball_url); 
                })
            });
        </script>
    </head>
    <body>
        <a id="mongodb-download">Download the latest version of MongoDB</a>
    </body>
</html>

This works for me, hope it helps!