From 5e22f1437ac2466d599c242fd5e256180fa7b68e Mon Sep 17 00:00:00 2001 From: FuXiaoHei Date: Mon, 24 Mar 2014 21:27:19 +0800 Subject: [PATCH] diff page ui --- public/css/gogs.css | 131 +++++++++++- public/js/app.js | 73 ++++--- routers/repo/commit.go | 6 + templates/repo/diff.tmpl | 418 +++++++++++++++++++++++++++++++++++++++ web.go | 4 +- 5 files changed, 599 insertions(+), 33 deletions(-) create mode 100644 templates/repo/diff.tmpl diff --git a/public/css/gogs.css b/public/css/gogs.css index 65a6c03d71..ec37721fd6 100755 --- a/public/css/gogs.css +++ b/public/css/gogs.css @@ -798,7 +798,7 @@ html, body { margin-left: .5em; } -.commit-box .avatar { +.commit-box .avatar, .diff-head-box .avatar { width: 20px; height: 20px; margin-right: 8px; @@ -831,10 +831,137 @@ html, body { background-color: #FFF; } -.guide-box { +.guide-box, .diff-head-box { margin-top: 20px; } +.diff-head-box h4 { + margin-top: 0; + margin-bottom: 0; + line-height: 26px; +} + +.diff-head-box p { + margin-bottom: 0; +} + +.diff-head-box .sha { + margin-left: 8px; +} + +.diff-head-box a.name { + color: #444; + margin-right: 8px; +} + +.diff-head-box span.time { + color: #888; +} + +.diff-detail-box { + margin-bottom: 16px; + line-height: 30px; +} + +.diff-detail-box span.status { + display: inline-block; + width: 12px; + height: 12px; + margin-right: 8px; + vertical-align: middle; +} + +.diff-detail-box ol { + padding-left: 0; + margin-bottom: 28px; +} + +.diff-detail-box li { + list-style: none; + padding-bottom: 4px; + margin-bottom: 4px; + border-bottom: 1px dashed #DDD; + padding-left: 6px; +} + +.diff-detail-box span.status.modify { + background-color: #f0db88; +} + +.diff-detail-box span.status.add { + background-color: #b4e2b4; +} + +.diff-detail-box span.status.del { + background-color: #e9aeae; +} + +.diff-detail-box span.status.rename{ + background-color: #dad8ff; +} + +.diff-file-box .panel-heading { + padding: 10px 20px; + line-height: 26px; +} + +.diff-box .count { + margin-right: 12px; +} + +.diff-box .count .bar { + width: 40px; + display: inline-block; + margin: 2px 4px 0 4px; + vertical-align: text-top; +} + +.diff-box .file { + color: #888; +} + +#gogs-source .file-content.diff-file-box { + margin-bottom: 20px; +} + +.diff-box .count .bar .add { + background-color: #77c64a; + height: 12px; +} + +.diff-box .count .bar .del, .diff-box .count .bar { + background-color: #e75316; + height: 12px; +} + +.diff-file-box .file-body.file-code .lines-code > pre { + margin: 0; + padding: 3px; +} + +.diff-file-box .file-body.file-code .lines-num-old { + border-right: 1px solid #DDD; +} + +.diff-file-box .code-bin td { + padding: 20px; +} + +.diff-file-box .code-diff tbody tr.add-code td, .diff-file-box .code-diff tbody tr.add-code pre { + background-color: #d1ffd6 !important; + border-color: #b4e2b4 !important; +} + +.diff-file-box .code-diff tbody tr.del-code td, .diff-file-box .code-diff tbody tr.del-code pre { + background-color: #ffe2dd !important; + border-color: #e9aeae !important; +} + +.diff-file-box .code-diff tbody tr:hover td, .diff-file-box .code-diff tbody tr:hover pre { + background-color: #fff8d2 !important; + border-color: #f0db88 !important; +} + /* wrapper and footer */ #wrapper { diff --git a/public/js/app.js b/public/js/app.js index 4bf4b29e5f..9a58a6f2f2 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -2,11 +2,11 @@ var Gogits = { "PageIsSignup": false }; -(function($){ +(function ($) { // extend jQuery ajax, set csrf token value var ajax = $.ajax; $.extend({ - ajax: function(url, options) { + ajax: function (url, options) { if (typeof url === 'object') { options = url; url = undefined; @@ -17,24 +17,24 @@ var Gogits = { var headers = options.headers || {}; var domain = document.domain.replace(/\./ig, '\\.'); if (!/^(http:|https:).*/.test(url) || eval('/^(http:|https:)\\/\\/(.+\\.)*' + domain + '.*/').test(url)) { - headers = $.extend(headers, {'X-Csrf-Token':csrftoken}); + headers = $.extend(headers, {'X-Csrf-Token': csrftoken}); } options.headers = headers; var callback = options.success; - options.success = function(data){ - if(data.once){ + options.success = function (data) { + if (data.once) { // change all _once value if ajax data.once exist $('[name=_once]').val(data.once); } - if(callback){ + if (callback) { callback.apply(this, arguments); } }; return ajax(url, options); }, - changeHash: function(hash) { - if(history.pushState) { + changeHash: function (hash) { + if (history.pushState) { history.pushState(null, null, hash); } else { @@ -42,8 +42,8 @@ var Gogits = { } }, - deSelect: function() { - if(window.getSelection) { + deSelect: function () { + if (window.getSelection) { window.getSelection().removeAllRanges(); } else { document.selection.empty(); @@ -114,8 +114,8 @@ var Gogits = { $tabs.find("li:eq(0) a").tab("show"); }; // fix dropdown inside click - Gogits.initDropDown = function(){ - $('.dropdown-menu.no-propagation').on('click',function(e){ + Gogits.initDropDown = function () { + $('.dropdown-menu.no-propagation').on('click', function (e) { e.stopPropagation(); }); }; @@ -144,24 +144,24 @@ var Gogits = { node = node.wrap('
'); node.append(''); }); - } + }; Gogits.renderCodeView = function () { - function selectRange($list, $select, $from){ + function selectRange($list, $select, $from) { $list.removeClass('active'); - if($from){ + if ($from) { var a = parseInt($select.attr('rel').substr(1)); var b = parseInt($from.attr('rel').substr(1)); var c; - if(a != b){ - if(a > b){ + if (a != b) { + if (a > b) { c = a; a = b; b = c; } var classes = []; - for(i = a; i <= b; i++) { - classes.push('.L'+i); + for (i = a; i <= b; i++) { + classes.push('.L' + i); } $list.filter(classes.join(',')).addClass('active'); $.changeHash('#L' + a + '-' + 'L' + b); @@ -175,11 +175,11 @@ var Gogits = { $(document).on('click', '.lines-num span', function (e) { var $select = $(this); var $list = $select.parent().siblings('.lines-code').find('ol.linenums > li'); - selectRange($list, $list.filter('[rel='+$select.attr('rel')+']'), (e.shiftKey?$list.filter('.active').eq(0):null)); + selectRange($list, $list.filter('[rel=' + $select.attr('rel') + ']'), (e.shiftKey ? $list.filter('.active').eq(0) : null)); $.deSelect(); }); - $('.code-view .lines-code > pre').each(function(){ + $('.code-view .lines-code > pre').each(function () { var $pre = $(this); var $lineCode = $pre.parent(); var $lineNums = $lineCode.siblings('.lines-num'); @@ -191,20 +191,20 @@ var Gogits = { } }); - $(window).on('hashchange', function(e) { + $(window).on('hashchange',function (e) { var m = window.location.hash.match(/^#(L\d+)\-(L\d+)$/); var $list = $('.code-view ol.linenums > li'); - if(m){ - var $first = $list.filter('.'+m[1]); - selectRange($list, $first, $list.filter('.'+m[2])); - $("html, body").scrollTop($first.offset().top-200); + if (m) { + var $first = $list.filter('.' + m[1]); + selectRange($list, $first, $list.filter('.' + m[2])); + $("html, body").scrollTop($first.offset().top - 200); return; } m = window.location.hash.match(/^#(L\d+)$/); - if(m){ - var $first = $list.filter('.'+m[1]); + if (m) { + var $first = $list.filter('.' + m[1]); selectRange($list, $first); - $("html, body").scrollTop($first.offset().top-200); + $("html, body").scrollTop($first.offset().top - 200); } }).trigger('hashchange'); }; @@ -334,6 +334,21 @@ function initRepository() { return false; }); })(); + + // repo diff counter + (function () { + var $counter = $('.diff-counter'); + if ($counter.length < 1) { + return; + } + $counter.each(function (i, item) { + var $item = $(item); + var addLine = $item.find('span[data-line].add').data("line"); + var delLine = $item.find('span[data-line].del').data("line"); + var addPercent = parseFloat(addLine) / (parseFloat(addLine) + parseFloat(delLine)) * 100; + $item.find(".bar .add").css("width", addPercent + "%"); + }); + }()); } (function ($) { diff --git a/routers/repo/commit.go b/routers/repo/commit.go index 60ee2177f3..e038998f94 100644 --- a/routers/repo/commit.go +++ b/routers/repo/commit.go @@ -33,3 +33,9 @@ func Commits(ctx *middleware.Context, params martini.Params) { ctx.Data["Commits"] = commits ctx.HTML(200, "repo/commits") } + +func Diff(ctx *middleware.Context,params martini.Params){ + ctx.Data["Title"] = "commit-sha" + ctx.Data["IsRepoToolbarCommits"] = true + ctx.HTML(200,"repo/diff") +} diff --git a/templates/repo/diff.tmpl b/templates/repo/diff.tmpl new file mode 100644 index 0000000000..0c6f4febcd --- /dev/null +++ b/templates/repo/diff.tmpl @@ -0,0 +1,418 @@ +{{template "base/head" .}} +{{template "base/navbar" .}} +{{template "repo/nav" .}} +{{template "repo/toolbar" .}} +
+
+
+
+ Browse Source +

bsongen: support for custom tags

+
+
+ + commit commit-sha + +

+ + author-name + times-ago +

+
+
+ +
+ Show Diff Files +

+ + 5 changed files with 25 additions and 9 deletions. +

+
    +
  1. +
    + 2 + + + + + 4 +
    + +   + gopmweb.go +
    2. +
  2. +
    + 666 + + + + + 44 +
    +   + static/img/favicon.png +
    3. +
  3. +   + static/img/favicon.png +
    4. +
  4. +   + static/img/favicon.png +
    5. +
+
+ +
+
+
+ BIN + + + + + +
+ View File + data/test/bson_test/simple_type.png +
+
+ + + + +
+
+
+ +
+
+
+ + 30 + + + + + - 4 +
+ View File + data/test/bson_test/simple_type.go +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ 1 + + 1 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 2 + + 2 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 3 + + 3 + + 
	"github.com/youtube/vitess/go/bson"
+
+ + + + 4 + + 
	"github.com/youtube/vitess/go/bson"
+
+ + + + 5 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 4 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 5 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 6 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 7 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 8 + + 6 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 9 + + 7 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 10 + + 8 + + 
	"github.com/youtube/vitess/go/bson"
+
+
+
+ +
+
+
+ + 2 + + + + + - 4 +
+ View File + data/test/bson_test/simple_type.go +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ 1 + + 1 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 2 + + 2 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 3 + + 3 + + 
	"github.com/youtube/vitess/go/bson"
+
+ + + + 4 + + 
	"github.com/youtube/vitess/go/bson"
+
+ + + + 5 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 4 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 5 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 6 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 7 + + - + + 
	"github.com/youtube/vitess/go/bson"
+
+ 8 + + 6 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 9 + + 7 + + 
	"github.com/youtube/vitess/go/bson"
+
+ 10 + + 8 + + 
	"github.com/youtube/vitess/go/bson"
+
+
+
+ +
+
+
+ BIN + + + + + +
+ View File + data/test/bson_test/simple_type.png +
+
+ + + + +
+
+
+
+
+{{template "base/footer" .}} \ No newline at end of file diff --git a/web.go b/web.go index 9a613dceb6..be9378f18c 100644 --- a/web.go +++ b/web.go @@ -156,8 +156,8 @@ func runWeb(*cli.Context) { }, ignSignIn, middleware.RepoAssignment(true)) // TODO: implement single commit page - // m.Get("/:username/:reponame/commit/:commitid/**", ignSignIn, middleware.RepoAssignment(true), repo.Single) - // m.Get("/:username/:reponame/commit/:commitid", ignSignIn, middleware.RepoAssignment(true), repo.Single) + m.Get("/:username/:reponame/commit/:commitid/**", ignSignIn, middleware.RepoAssignment(true), repo.Diff) + m.Get("/:username/:reponame/commit/:commitid", ignSignIn, middleware.RepoAssignment(true), repo.Diff) m.Group("/:username", func(r martini.Router) { r.Get("/:reponame", middleware.RepoAssignment(true), repo.Single)