Contributors List on the About Dialog

src/brackets.config.json

@@ -13,6 +13,7 @@
         "report_issue_url"  : "https://github.com/adobe/brackets/wiki/How-to-Report-an-Issue",
         "twitter_url"       : "https://twitter.com/brackets",
         "troubleshoot_url"  : "https://github.com/adobe/brackets/wiki/Troubleshooting#wiki-livedev",
-        "twitter_name"      : "@brackets"
+        "twitter_name"      : "@brackets",
+        "contributors_url"  : "https://api.github.com/repos/adobe/brackets/contributors"
     }
 }

src/config.json

@@ -12,7 +12,8 @@
         "report_issue_url": "https://github.com/adobe/brackets/wiki/How-to-Report-an-Issue",
         "twitter_url": "https://twitter.com/brackets",
         "troubleshoot_url": "https://github.com/adobe/brackets/wiki/Troubleshooting#wiki-livedev",
-        "twitter_name": "@brackets"
+        "twitter_name": "@brackets",
+        "contributors_url": "https://api.github.com/repos/adobe/brackets/contributors"
     },
     "name": "Brackets",
     "version": "0.21.0-0",

src/help/HelpCommandHandlers.js

@@ -23,7 +23,7 @@
 
 
 /*jslint vars: true, plusplus: true, devel: true, nomen: true, indent: 4, maxerr: 50 */
-/*global define, $, brackets, window, Mustache */
+/*global define, $, brackets, window, PathUtils, Mustache */
 
 define(function (require, exports, module) {
     "use strict";
@@ -38,11 +38,73 @@ define(function (require, exports, module) {
         UpdateNotification      = require("utils/UpdateNotification"),
         FileUtils               = require("file/FileUtils"),
         NativeApp               = require("utils/NativeApp"),
+        PreferencesManager      = require("preferences/PreferencesManager"),
         StringUtils             = require("utils/StringUtils"),
-        AboutDialogTemplate     = require("text!htmlContent/about-dialog.html");
+        AboutDialogTemplate     = require("text!htmlContent/about-dialog.html"),
+        ContributorsTemplate    = require("text!htmlContent/contributors-list.html");
 
     var buildInfo;
-
+
+    // PreferenceStorage
+    var _prefs = PreferencesManager.getPreferenceStorage(module.id);
+
+    // Last time the contributorsInfo was fetched
+    var _lastContributorsFetchTime = _prefs.getValue("lastContributorsFetchTime");
+
+
+    /**
+     * @private
+     * Gets a data structure that has the information for all the contributors of Brackets.
+     * The information is fetched from brackets.config.contributors_url using the github API.
+     * If more than 2 weeks have passed since the last fetch, or if cached data can't be found, 
+     * the data is fetched again.
+     * @return {$.Promise} jQuery Promise object that is resolved or rejected after the information is fetched.
+     */
+    function _getContributorsInformation() {
+        var result = new $.Deferred();
+        var fetchData = false;
+        var data;
+
+        // If we don't have data saved in prefs, fetch
+        data = _prefs.getValue("contributorsInfo");
+        if (!data) {
+            fetchData = true;
+        }
+
+        // If more than 2 weeks have passed since our last fetch, fetch again
+        if ((new Date()).getTime() > _lastContributorsFetchTime + (14 * 24 * 60 * 60 * 24)) {
+            fetchData = true;
+        }
+
+        if (fetchData) {
+            $.getJSON(brackets.config.contributors_url + "?callback=?", function (contributorsInfo) {
+                data = [];
+
+                // Save only the required data for the template
+                $.each(contributorsInfo.data, function (index, element) {
+                    data.push({
+                        GITHUB_URL : element.html_url,
+                        AVATAR_URL : element.avatar_url,
+                        NAME       : element.login
+                    });
+                });
+                _lastContributorsFetchTime = (new Date()).getTime();
+                _prefs.setValue("lastContributorsFetchTime", _lastContributorsFetchTime);
+                _prefs.setValue("contributorsInfo", data);
+
+                result.resolve(data);
+
+            }).error(function () {
+                result.reject();
+            });
+        } else {
+            result.resolve(data);
+        }
+
+        return result.promise();
+    }
+
+
     function _handleCheckForUpdates() {
         UpdateNotification.checkForUpdate(true);
     }
@@ -69,7 +131,39 @@ define(function (require, exports, module) {
             APP_NAME_ABOUT_BOX  : brackets.config.app_name_about,
             BUILD_INFO          : buildInfo || ""
         }, Strings);
+
         Dialogs.showModalDialogUsingTemplate(Mustache.render(AboutDialogTemplate, templateVars));
+
+        // Get all the project contributors and add them to the dialog
+        _getContributorsInformation().done(function (contributorsInfo) {
+
+            // Populate the contributors data
+            var $dlg = $(".about-dialog.instance");
+            var $contributors = $dlg.find(".about-contributors");
+
+            templateVars = $.extend({CONTRIBUTORS: contributorsInfo}, Strings);
+            $contributors.html(Mustache.render(ContributorsTemplate, templateVars));
+
+            // This is used to create an opacity transition when each image is loaded
+            $dlg.find("img").one("load", function () {
+                $(this).css("opacity", 1);
+            }).each(function () {
+                if (this.complete) {
+                    $(this).load();
+                }
+            });
+
+            $dlg.on("click", "img", function (e) {
+                var url = $(e.target).data("url");
+
+                if (url) {
+                    // Make sure the URL has a domain that we know about
+                    if (/(github\.com)$/i.test(PathUtils.parseUrl(url).hostname)) {
+                        NativeApp.openURLInDefaultBrowser(url);
+                    }
+                }
+            });
+        });
     }
 
     // Read "build number" SHAs off disk immediately at APP_READY, instead

src/htmlContent/about-dialog.html

@@ -6,10 +6,15 @@ <h1 class="dialog-title">{{ABOUT}}</h1>
         <img class="about-icon" src="{{ABOUT_ICON}}">
         <div class="about-text">
             <h2>{{APP_NAME_ABOUT_BOX}}</h2>
-            <p class="dialog-message">{{ABOUT_TEXT_LINE1}} <span id="about-build-number">{{BUILD_INFO}}</span></p>
-            <p class="dialog-message"><!-- $NON-NLS$ -->Copyright 2012 - 2013 Adobe Systems Incorporated and its licensors. All rights reserved.</p>
-            <p class="dialog-message">{{{ABOUT_TEXT_LINE3}}}</p>
-            <p class="dialog-message">{{{ABOUT_TEXT_LINE4}}}</p>
+            <div class="about-info">
+                <p class="dialog-message">{{ABOUT_TEXT_LINE1}} <span id="about-build-number">{{BUILD_INFO}}</span></p>
+                <p class="dialog-message"><!-- $NON-NLS$ -->Copyright 2012 - 2013 Adobe Systems Incorporated and its licensors. All rights reserved.</p>
+                <p class="dialog-message">{{{ABOUT_TEXT_LINE3}}}</p>
+                <p class="dialog-message">{{{ABOUT_TEXT_LINE4}}}</p>
+                <p class="dialog-message">{{ABOUT_TEXT_LINE5}}</p>
+                <div class="about-contributors">
+                </div>
+            </div>
         </div>
     </div>
     <div class="modal-footer">

src/htmlContent/contributors-list.html

@@ -0,0 +1,3 @@
+{{#CONTRIBUTORS}}
+<img class="clickable-link" data-url="{{GITHUB_URL}}" src="{{AVATAR_URL}}" title="{{NAME}}" alt="{{NAME}}" width="30" height="30" /> 
+{{/CONTRIBUTORS}}

src/nls/root/strings.js

@@ -278,6 +278,7 @@ define({
     "ABOUT_TEXT_LINE1"                     : "sprint {VERSION_MINOR} {BUILD_TYPE} {VERSION}",
     "ABOUT_TEXT_LINE3"                     : "Notices, terms and conditions pertaining to third party software are located at <a class=\"clickable-link\" data-href=\"http://www.adobe.com/go/thirdparty/\">http://www.adobe.com/go/thirdparty/</a> and incorporated by reference herein.",
     "ABOUT_TEXT_LINE4"                     : "Documentation and source at <a class=\"clickable-link\" data-href=\"https://github.com/adobe/brackets/\">https://github.com/adobe/brackets/</a>",
+    "ABOUT_TEXT_LINE5"                     : "Made with \u2764 and JavaScript by:",
     "UPDATE_NOTIFICATION_TOOLTIP"          : "There's a new build of {APP_NAME} available! Click here for details.",
     "UPDATE_AVAILABLE_TITLE"               : "Update Available",
     "UPDATE_MESSAGE"                       : "Hey, there's a new build of {APP_NAME} available. Here are some of the new features:",

src/styles/brackets_patterns_override.less

@@ -442,6 +442,22 @@
         #about-build-number {
             color: #b0b0b0;
         }
+        .about-info {
+            max-height: 300px;
+            overflow: auto;
+        }
+        .about-contributors {
+            min-width: 395px;
+            min-height: 100px;
+            background-color: whiteSmoke;
+        }
+        .about-contributors img {
+            opacity: 0;
+            -webkit-transition: opacity 1s;
+            -moz-transition: opacity 1s;
+            -o-transition: opacity 1s;
+            transition: opacity 1s;
+        }
     }
 
     h2 {