ni_nitdoc: github login box is now generated by JS

Also corrected:
  * cropped btn display
  * login box display out of screen on splited windows

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

diff --git a/share/nitdoc/scripts/github.js b/share/nitdoc/scripts/github.js
index 35b51de..54ed212 100644 (file)
--- a/share/nitdoc/scripts/github.js
+++ b/share/nitdoc/scripts/github.js
@@ -56,13 +56,13 @@ window.onbeforeunload = function() {
 };\r
 \r
 $(document).ready(function() {\r
-\r
+       createLoginBox();\r
        // Hide edit tags\r
        $('textarea').hide();\r
        $('a[id=commitBtn]').hide();\r
        $('a[id=cancelBtn]').hide();\r
        // Display Login modal\r
-       $("#logGitHub").click(function(){ displayLogginModal(); }); \r
+       $("#logGitHub").click(function(){ toggleLoginBox(); });\r
        // Update display\r
        updateDisplaying();\r
        // If cookie existing the session is opened\r
@@ -102,7 +102,7 @@ $(document).ready(function() {
                        del_cookie("logginNitdoc");\r
                        closeAllCommentInEdtiting();\r
                }       \r
-               displayLogginModal();\r
+               toggleLoginBox();\r
        });\r
 \r
        // Activate edit mode\r
@@ -159,7 +159,7 @@ $(document).ready(function() {
                else{\r
                        if(!sessionStarted){\r
                                displayMessage("You need to be loggued before commit something", 45, 40);\r
-                               displayLogginModal();\r
+                               toggleLoginBox();\r
                                return;\r
                        }\r
                        \r
@@ -260,7 +260,7 @@ $(document).ready(function() {
                                        $('#loginGit').val("");\r
                                        $('#passwordGit').val("");\r
                                        loginProcess = false;          \r
-                                       displayLogginModal();\r
+                                       toggleLoginBox();\r
                        }\r
                        else{\r
                                        if ($.trim(updateComment) == ''){ this.value = (this.defaultValue ? this.defaultValue : ''); }\r
@@ -353,15 +353,6 @@ function startCommitProcess()
        }\r
 }\r
 \r
-function displayLogginModal(){\r
-       if ($('.popover').is(':hidden')) { \r
-               if(sessionStarted){ getListBranches(); }\r
-               $('.popover').show(); \r
-       }\r
-       else { $('.popover').hide(); }  \r
-       updateDisplaying();\r
-}\r
-\r
 function updateDisplaying(){\r
        if (checkCookie())\r
        {\r
@@ -993,3 +984,58 @@ function showComment(element){
        textarea.height(textarea.prop("scrollHeight"));\r
        resizeTextarea(textarea);\r
 }\r
+\r
+/* GitHub login box management */\r
+\r
+function createLoginBox() {\r
+       $("nav.main ul").append(\r
+               "<li id='liGitHub'>" +\r
+               "  <a class='btn' id='logGitHub'>" +\r
+               "    <img id='imgGitHub' src='resources/icons/github-icon.png' alt='GitHub'/>" +\r
+               "  </a>" +\r
+               "  <div class='popover bottom' style='display: none;'>" +\r
+               "    <div class='arrow'>&nbsp;</div>" +\r
+               "      <div class='githubTitle'>" +\r
+               "        <h3>Github Sign In</h3>" +\r
+               "      </div>" +\r
+               "      <div>" +\r
+               "        <label id='lbloginGit'>Username</label>" +\r
+               "        <input id='loginGit' name='login' type='text'/>" +\r
+               "        <label id='logginMessage'>Hello " +\r
+               "          <a id='githubAccount'><strong id='nickName'></strong></a>" +\r
+               "        </label>" +\r
+               "      </div>" +\r
+               "      <div>" +\r
+               "        <label id='lbpasswordGit'>Password</label>" +\r
+               "        <input id='passwordGit' name='password' type='password'/>" +\r
+               "        <div id='listBranches'>" +\r
+               "          <label id='lbBranches'>Branch</label>" +\r
+               "          <select class='dropdown' id='dropBranches' name='dropBranches' tabindex='1'></select>" +\r
+               "        </div>" +\r
+               "      </div>" +\r
+               "      <div>" +\r
+               "        <label id='lbrepositoryGit'>Repository</label>" +\r
+               "        <input id='repositoryGit' name='repository' type='text'/>" +\r
+               "      </div>" +\r
+               "      <div>" +\r
+               "        <label id='lbbranchGit'>Branch</label>" +\r
+               "        <input id='branchGit' name='branch' type='text'/>" +\r
+               "      </div>" +\r
+               "      <div>" +\r
+               "        <a id='signIn'>Sign In</a>" +\r
+               "      </div>" +\r
+               "    </div>" +\r
+               "  </div>" +\r
+               "</li>"\r
+       );\r
+}\r
+\r
+function toggleLoginBox(){\r
+       if ($('.popover').is(':hidden')) {\r
+               if(sessionStarted){ getListBranches(); }\r
+               $('.popover').show();\r
+       } else {\r
+               $('.popover').hide();\r
+       }\r
+       updateDisplaying();\r
+}\r

diff --git a/share/nitdoc/styles/main.css b/share/nitdoc/styles/main.css
index 746ad35..1de2f0d 100644 (file)
--- a/share/nitdoc/styles/main.css
+++ b/share/nitdoc/styles/main.css
@@ -677,7 +677,7 @@ fieldset {
        position: absolute;\r
        width : 220px;\r
        height:280px;\r
-       margin-left: -102px;\r
+       margin-left: -185px;\r
        z-index: 1010;\r
        display: block;\r
        max-width: 276px;\r
@@ -745,7 +745,7 @@ fieldset {
 .popover.bottom .arrow {\r
        top: -11px;\r
        left: 50%;\r
-       margin-left: -11px;\r
+       margin-left: 72px;\r
        border-bottom-color: #999;\r
        border-bottom-color: rgba(0, 0, 0, 0.25);\r
        border-top-width: 0;\r
@@ -798,7 +798,7 @@ fieldset {
 #signIn{\r
        display: block;\r
        cursor: pointer;\r
-       margin: 10px 10px 5px 10px;    \r
+       margin: 2px 10px 5px 10px;\r
        background-color: #92C929;\r
        background-image: -webkit-gradient(linear, left top, left bottom, from(#92C929), to(#1d7900)); /* Saf4+, Chrome */\r
        background-image: -webkit-linear-gradient(top, #92C929, #1d7900); /* Chrome 10+, Saf5.1+ */\r

diff --git a/src/ni_nitdoc.nit b/src/ni_nitdoc.nit
index e4826af..ea7575d 100644 (file)
--- a/src/ni_nitdoc.nit
+++ b/src/ni_nitdoc.nit
@@ -204,9 +204,9 @@ abstract class NitdocPage
                append("<meta charset='utf-8'/>")
                append("<script type='text/javascript' src='scripts/jquery-1.7.1.min.js'></script>")
                append("<script type='text/javascript' src='quicksearch-list.js'></script>")
-               append("<script type='text/javascript' src='scripts/js-facilities.js'></script>")
                append("<script type='text/javascript' src='scripts/base64.js'></script>")
                append("<script type='text/javascript' src='scripts/github.js'></script>")
+               append("<script type='text/javascript' src='scripts/js-facilities.js'></script>")
                append("<link rel='stylesheet' href='styles/main.css' type='text/css' media='screen'/>")
                var title = ""
                if ctx.opt_custom_title.value != null then
@@ -228,43 +228,6 @@ abstract class NitdocPage
                append("<nav class='main'>")
                append("<ul>")
                menu
-               append("<li id='liGitHub'>")
-               append("<a class='btn' id='logGitHub'>")
-               append("<img id='imgGitHub' src='resources/icons/github-icon.png' alt='GitHub'/>")
-               append("</a>")
-               append("<div class='popover bottom' style='display: none;'>")
-               append("<div class='arrow'>&nbsp;</div>")
-               append("<div class='githubTitle'>")
-               append("<h3>Github Sign In</h3>")
-               append("</div>")
-               append("<div>")
-               append("<label id='lbloginGit'>Username</label>")
-               append("<input id='loginGit' name='login' type='text'/>")
-               append("<label id='logginMessage'>Hello ")
-               append("<a id='githubAccount'><strong id='nickName'></strong></a>")
-               append("</label>")
-               append("</div>")
-               append("<div>")
-               append("<label id='lbpasswordGit'>Password</label>")
-               append("<input id='passwordGit' name='password' type='password'/>")
-               append("<div id='listBranches'>")
-               append("<label id='lbBranches'>Branch</label>")
-               append("<select class='dropdown' id='dropBranches' name='dropBranches' tabindex='1'></select>")
-               append("</div>")
-               append("</div>")
-               append("<div>")
-               append("<label id='lbrepositoryGit'>Repository</label>")
-               append("<input id='repositoryGit' name='repository' type='text'/>")
-               append("</div>")
-               append("<div>")
-               append("<label id='lbbranchGit'>Branch</label>")
-               append("<input id='branchGit' name='branch' type='text'/>")
-               append("</div>")
-               append("<div>")
-               append("<a id='signIn'>Sign In</a>")
-               append("</div>")
-               append("</div>")
-               append("</li>")
                append("</ul>")
                append("</nav>")
                append("</header>")