release-new page ui

3 files changed, 141 insertions, 0 deletions

diff --git a/public/css/gogs.css b/public/css/gogs.css
index a6d6b4cce7..da2a7fd1a2 100755
--- a/public/css/gogs.css
+++ b/public/css/gogs.css
@@ -1304,4 +1304,74 @@ html, body {
 
 #release .release-item .info .avatar {
     vertical-align: middle;
+}
+
+#release-new-form {
+    margin-top: 24px;
+}
+
+#release-new-form .target-at {
+    margin: 0 1em;
+}
+
+#release-new-form .target-text {
+    color: #888;
+}
+
+#release-new-target-branch-list {
+    padding-top: 0;
+    padding-bottom: 0;
+    min-width: 200px;
+}
+
+#release-new-target-branch-list ul {
+    margin-bottom: 0;
+}
+
+#release-new-target-branch-list li {
+    padding: 8px 20px;
+}
+
+#release-new-target-branch-list li a {
+    margin-left: 0;
+    background-color: transparent;
+    padding: 0;
+}
+
+#release-new-target-branch-list li a:hover {
+    background-image: none;
+}
+
+#release-new-target-branch-list li:hover {
+    background-color: #0093c4;
+}
+
+#release-new-target-branch-list li:hover a {
+    color: #FFF;
+}
+
+#release-new-title {
+    width: 50%;
+}
+
+#release-new-content-div {
+    margin-top: 16px;
+    padding-left: 0;
+}
+
+#release-new-content-div .md-help {
+    margin-top: 6px;
+}
+
+#release-textarea .form-group {
+    display: block;
+}
+
+#release-new-content {
+    width: 100%;
+    margin: 16px 0;
+}
+
+#release-preview{
+    margin: 6px 0;
 }
\ No newline at end of file
diff --git a/public/js/app.js b/public/js/app.js
index 0ba0675f20..93e01abd28 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -520,6 +520,23 @@ function initIssue() {
 
 }
 
+function initRelease() {
+// release new ajax preview
+    (function () {
+        $('[data-ajax-name=release-preview]').on("click", function () {
+            var $this = $(this);
+            $this.toggleAjax(function (json) {
+                if (json.ok) {
+                    $($this.data("preview")).html(json.content);
+                }
+            })
+        });
+        $('.release-write a[data-toggle]').on("click", function () {
+            $('.release-preview-content').html("loading...");
+        });
+    }())
+}
+
 (function ($) {
     $(function () {
         initCore();
@@ -539,5 +556,8 @@ function initIssue() {
         if ($('#issue').length) {
             initIssue();
         }
+        if ($('#release').length) {
+            initRelease();
+        }
     });
 })(jQuery);
diff --git a/templates/release/new.tmpl b/templates/release/new.tmpl
index a7dc905a0e..fe5aa179c9 100644
--- a/templates/release/new.tmpl
+++ b/templates/release/new.tmpl
@@ -8,6 +8,57 @@
         <form id="release-new-form" action="" class="form form-inline">
             <div class="form-group">
                 <input id="release-tag-name" type="text" class="form-control" placeholder="tag name"/>
+                <span class="target-at">@</span>
+                <div class="btn-group" id="release-new-target-select">
+                    <button type="button" class="btn btn-default"><i class="fa fa-code-fork fa-lg fa-m"></i>
+                        <span class="target-text">Target : </span>
+                        <strong id="release-new-target-name"> master</strong>
+                    </button>
+                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                        <span class="caret"></span>
+                    </button>
+                    <div class="dropdown-menu clone-group-btn" id="release-new-target-branch-list">
+                        <ul class="list-group">
+                            <li class="list-group-item">
+                                <a href="#" rel="master"><i class="fa fa-code-fork"></i>master</a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+                <p class="help-block">Choose an existing tag without release notes</p>
+            </div>
+            <div class="form-group" style="display: block">
+                <input class="form-control input-lg" id="release-new-title" name="title" type="text" placeholder="release title"/>
+            </div>
+            <div class="form-group col-md-8" style="display: block" id="release-new-content-div">
+                <div class="md-help pull-right">
+                    Content with <a href="https://help.github.com/articles/markdown-basics">Markdown</a>
+                </div>
+                <ul class="nav nav-tabs" data-init="tabs">
+                    <li class="release-write active"><a href="#release-textarea" data-toggle="tab">Write</a></li>
+                    <li class="release-preview"><a href="#release-preview" data-toggle="tab" data-ajax="/api/v1/markdown?repo=repo_id&amp;release=new" data-ajax-name="release-preview" data-ajax-method="post" data-preview="#release-preview">Preview</a></li>
+                </ul>
+                <div class="tab-content">
+                    <div class="tab-pane active" id="release-textarea">
+                        <div class="form-group">
+                            <textarea class="form-control" name="content" id="release-new-content" rows="10" placeholder="Write some content" data-ajax-rel="release-preview" data-ajax-val="val" data-ajax-field="content"></textarea>
+                        </div>
+                    </div>
+                    <div class="tab-pane release-preview-content" id="release-preview">loading...</div>
+                </div>
+            </div>
+            <div class="text-right form-group col-md-8" style="display: block">
+                <hr/>
+                <label for="release-new-pre-release">
+                    <input id="release-new-pre-release" type="checkbox" name="is-pre-release" value="true"/>
+                    <strong>This is a pre-release</strong>
+                </label>
+                <p class="help-block">We’ll point out that this release is identified as non-production ready.</p>
+            </div>
+            <div class="text-right form-group col-md-8" style="display: block">
+                <input type="hidden" value="id" name="repo-id">
+                <button class="btn-success btn">Publish release</button>
+                <input class="btn btn-default" type="submit" name="is-draft" value="Save Draft"/>
             </div>
         </form>
     </div>