nitdoc: migrate github commitbox to jQuery.UI widget

Signed-off-by: Alexandre Terrasa <alexandre@moz-code.org>

diff --git a/share/nitdoc/js/plugins/github/commitbox.js b/share/nitdoc/js/plugins/github/commitbox.js
index 5bb31db..aa03f79 100644 (file)
--- a/share/nitdoc/js/plugins/github/commitbox.js
+++ b/share/nitdoc/js/plugins/github/commitbox.js
@@ -11,79 +11,68 @@
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
    See the License for the specific language governing permissions and\r
    limitations under the License.\r
-\r
-   Documentation generator for the nit language.\r
-   Generate API documentation in HTML format from nit source code.\r
 */\r
 \r
 /*\r
- * Nitdoc.GitHub.CommitBox instance\r
+ * CommitBox allows user to add a message and sign its commit\r
  */\r
 define([\r
        "jquery",\r
-       "plugins/github/ui",\r
-], function($, UI) {\r
-console.log(UI);\r
-       // Init new commit box instance\r
-       var CommitBox = {\r
-               \r
-               // Open commit box instance\r
-               open: function(infos) {\r
-                       $("body").append(\r
-                               $(document.createElement("div"))\r
-                               .attr("id", "nitdoc-github-commitBox-fade")\r
-                               .addClass("nitdoc-github-fade")\r
-                       );\r
-                       $("body").append(\r
-                               $(document.createElement("div"))\r
+       "jQueryUI"\r
+], function($) {\r
+       $.widget("nitdoc.commitbox", {\r
+\r
+               options: {\r
+                       title: "Commit changes"\r
+               },\r
+\r
+               _create: function() {\r
+                       this._fade = this._buildFade();\r
+                       $("body").append(this._fade);\r
+                       this._commitBox = $("<div/>")\r
+                               .hide()\r
                                .attr("id", "nitdoc-github-commitBox")\r
                                .addClass("nitdoc-github-modal")\r
                                .append(\r
-                                       $(document.createElement("a"))\r
+                                       $("<a/>")\r
                                        .addClass("nitdoc-github-close")\r
                                        .attr("title", "Close")\r
                                        .append("x")\r
-                                       .click(function() { CommitBox.close() })\r
+                                       .click($.proxy(this.close, this))\r
                                )\r
-                               .append("<h3>Commit changes</h3>")\r
+                               .append("<h3>" + this.options.title + "</h3>")\r
                                .append(\r
-                                       $(document.createElement("div"))\r
+                                       $("<div/>")\r
                                        .append(\r
-                                               $(document.createElement("label"))\r
+                                               $("<label/>")\r
                                                .attr("for", "nitdoc-github-commit-message")\r
                                        )\r
-                                       .append("<br/>")\r
+                                       .append($("<br/>"))\r
                                        .append(\r
-                                               $(document.createElement("textarea"))\r
+                                               $("<textarea/>")\r
                                                .attr("id", "nitdoc-github-commit-message")\r
-                                               .append("doc: " + (infos.isNew ? "added" : "modified") + " comment for " + infos.namespace)\r
                                        )\r
-                                       .append("<br/>")\r
+                                       .append($("<br/>"))\r
                                        .append(\r
-                                               $(document.createElement("input"))\r
+                                               $("<input/>")\r
                                                .attr({\r
                                                        id: "nitdoc-github-commit-signedoff",\r
-                                                       type: "checkbox",\r
-                                                       value: "Signed-off-by: " + infos.user.signedOff\r
-                                               })\r
-                                               .change(function(e) {\r
-                                                       if ($(this).is(':checked')) {\r
-                                                               $("#nitdoc-github-commit-button").removeAttr("disabled");\r
-                                                       } else {\r
-                                                               $("#nitdoc-github-commit-button").attr("disabled", "disabled");\r
-                                                       }\r
+                                                       type: "checkbox"\r
                                                })\r
+                                               .change($.proxy(this._doSignedChange, this))\r
                                        )\r
                                        .append(\r
-                                               $(document.createElement("label"))\r
-                                               .attr("for", "nitdoc-github-commit-signedoff")\r
-                                               .text("Signed-off-by: " + infos.user.signedOff)\r
+                                               $("<label/>")\r
+                                               .attr({\r
+                                                       "id": "nitdoc-github-commit-signedoff-label",\r
+                                                       "for": "nitdoc-github-commit-signedoff"\r
+                                               })\r
                                        )\r
                                ).append(\r
-                                       $(document.createElement("div"))\r
+                                       $("<div/>")\r
                                        .addClass("nitdoc-github-buttons")\r
                                        .append(\r
-                                               $(document.createElement("button"))\r
+                                               $("<button/>")\r
                                                .attr({\r
                                                        id: "nitdoc-github-commit-button",\r
                                                        disabled: "disabled"\r
@@ -94,33 +83,79 @@ console.log(UI);
                                                        .attr("src", "resources/icons/github-icon.png")\r
                                                )\r
                                                .append("Commit")\r
-                                               .mousedown(function() {\r
-                                                       $(this).text("Commiting...");\r
-                                               })\r
-                                               .mouseup(function() {\r
-                                                       infos.message = $("#nitdoc-github-commit-message").val() + "\n\n" + infos.user.signedOff;\r
-                                                       UI.saveChanges(infos);\r
-                                               })\r
+                                               .click($.proxy(this._doCommitClick, this))\r
                                        )\r
-                               )\r
-                       );\r
+                               );\r
+                       $("body").append(this._commitBox);\r
+               },\r
 \r
-                       $("#nitdoc-github-commitBox")\r
-                       .css({\r
+               open: function(namespace, user, isNew) {\r
+                       var message = "doc: " + (isNew ? "added" : "modified") + " comment for " + namespace;\r
+                       this._setMessage(message);\r
+                       this._setSignedOff(user.signedOff);\r
+                       this._fade.show();\r
+                       this._commitBox.show();\r
+                       this._commitBox.css({\r
                                top: "50%",\r
-                               marginTop: -($("#nitdoc-github-commitBox").outerHeight() / 2) + "px",\r
+                               marginTop: -(this._commitBox.outerHeight() / 2) + "px",\r
                                left: "50%",\r
-                               marginLeft: -($("#nitdoc-github-commitBox").outerWidth() / 2) + "px"\r
+                               marginLeft: -(this._commitBox.outerWidth() / 2) + "px"\r
                        })\r
                        .find("#nitdoc-github-commit-message").focus();\r
                },\r
 \r
-               // Close commit box instance\r
                close: function() {\r
-                       $("#nitdoc-github-commitBox").remove();\r
-                       $("#nitdoc-github-commitBox-fade").remove();\r
-               }\r
-       }\r
+                       this._commitBox.hide();\r
+                       this._fade.hide();\r
+               },\r
+\r
+               /* internals */\r
+\r
+               _buildFade: function() {\r
+                       return $("<div/>")\r
+                               .hide()\r
+                               .attr("id", "nitdoc-github-commitBox-fade")\r
+                               .addClass("nitdoc-github-fade")\r
+               },\r
+\r
+               _getMessage: function() {\r
+                       return $("#nitdoc-github-commit-message").val();\r
+               },\r
+\r
+               _setMessage: function(message) {\r
+                       $("#nitdoc-github-commit-message").val(message);\r
+               },\r
+\r
+               _getSignedOff: function() {\r
+                       return $("#nitdoc-github-commit-message").val();\r
+               },\r
 \r
-       return CommitBox;\r
+               _setSignedOff: function(signedoff) {\r
+                       $("#nitdoc-github-commit-signedoff").val(signedoff);\r
+                       $("#nitdoc-github-commit-signedoff-label").text(signedoff);\r
+               },\r
+\r
+               /* events */\r
+\r
+               _doSignedChange: function(event) {\r
+                       if ($(event.currentTarget).is(':checked')) {\r
+                               $("#nitdoc-github-commit-button").removeAttr("disabled");\r
+                       } else {\r
+                               $("#nitdoc-github-commit-button").attr("disabled", "disabled");\r
+                       }\r
+               },\r
+\r
+               _doCommitClick: function(event) {\r
+                       $(event.target).text("Commiting...");\r
+                       $(event.target).attr("disabled", "disabled");\r
+                       this._trigger("_commit", event, {\r
+                               message: this._getMessage(),\r
+                               signedoff: this._getSignedOff()\r
+                       });\r
+               },\r
+\r
+               _doCancelClick: function(event) {\r
+                       this._trigger("_cancel", event);\r
+               }\r
+       });\r
 });\r

diff --git a/share/nitdoc/js/plugins/github/ui.js b/share/nitdoc/js/plugins/github/ui.js
index edb8035..b185b5f 100644 (file)
--- a/share/nitdoc/js/plugins/github/ui.js
+++ b/share/nitdoc/js/plugins/github/ui.js
@@ -27,8 +27,9 @@ define([
        "plugins/github/utils",\r
        "plugins/github/commentbox",\r
        "plugins/github/modalbox",\r
+       "plugins/github/commitbox",\r
        "base64"\r
-], function($, UI, User, GithubAPI, Utils, CommentBox, ModalBox, Base64) {\r
+], function($, UI, User, GithubAPI, Utils, CommentBox, ModalBox, CommitBox, Base64) {\r
        var UI = {\r
                openedComments: 0,      // currently edited comments count\r
                user: false,            // logged user\r
@@ -90,6 +91,7 @@ define([
 \r
                // Attach edit button on each comment\r
                attachCommentEvents: function() {\r
+                       $("body").commitbox();\r
                        // Blocks without comment\r
                        $("span.noComment").each(function() {\r
                                //FIXME this should be done by nitdoc\r
@@ -136,6 +138,11 @@ define([
                                        }\r
 \r
                                        baseTextarea.commentbox();\r
+                                       baseTextarea.bind("commentbox_commit", function(event, data) {\r
+                                               $("body").commitbox("open", infos.namespace, infos.user, infos.isNew ? true : false)\r
+                                               //infos.message = $("#nitdoc-github-commit-message").val() + "\n\n" + infos.user.signedOff;\r
+                                               //UI.saveChanges(infos);\r
+                                       });\r
                                        baseTextarea.bind("commentbox_preview", function(event, data) {\r
                                                var converter = new Markdown.Converter()\r
                                                var html = converter.makeHtml(data.value);\r