playground
/
gogs
mirror of https://github.com/gogits/gogs.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

diff page ui

pull/35/head
FuXiaoHei 11 years ago
parent
137538e54b
commit
5e22f1437a
5 changed files with 599 additions and 33 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 131
      public/css/gogs.css
  2. 73
      public/js/app.js
  3. 6
      routers/repo/commit.go
  4. 418
      templates/repo/diff.tmpl
  5. 4
      web.go

131
public/css/gogs.css
Unescape View File

@ -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 {

73
public/js/app.js
Unescape View File

@ -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('<div id="' + name + '" class="anchor-wrap" ></div>');
node.append('<a class="anchor" href="#' + name + '"><span class="octicon octicon-link"></span></a>');
});
}
};
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 ($) {

6
routers/repo/commit.go
Unescape View File

@ -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")
}

418
templates/repo/diff.tmpl
Unescape View File

@ -0,0 +1,418 @@
{{template "base/head" .}}
{{template "base/navbar" .}}
{{template "repo/nav" .}}
{{template "repo/toolbar" .}}
<div id="gogs-body" class="container" data-page="repo">
<div id="gogs-source">
<div class="panel panel-info diff-box diff-head-box">
<div class="panel-heading">
<a class="pull-right btn btn-primary btn-sm" href="#commit-source">Browse Source</a>
<h4>bsongen: support for custom tags</h4>
</div>
<div class="panel-body">
<span class="pull-right">
commit <span class="label label-default sha">commit-sha</span>
</span>
<p class="author">
<img class="avatar" src="#" alt=""/>
<a class="name" href="#"><strong>author-name</strong></a>
<span class="time">times-ago</span>
</p>
</div>
</div>
<div class="diff-detail-box diff-box">
<a class="pull-right btn btn-default" data-toggle="collapse" data-target="#diff-files">Show Diff Files</a>
<p class="showing">
<i class="fa fa-retweet"></i>
<strong> 5 changed files</strong> with <strong>25 additions</strong> and <strong>9 deletions</strong>.
</p>
<ol class="detail-files collapse" id="diff-files">
<li>
<div class="diff-counter count pull-right">
<span class="add" data-line="2">2</span>
<span class="bar">
<span class="pull-left add"></span>
<span class="pull-left del"></span>
</span>
<span class="del" data-line="4">4</span>
</div>
<!-- todo finish all file status, now modify, add, delete and rename -->
<span class="status modify" data-toggle="tooltip" data-placement="right" title="modify">&nbsp;</span>
<a class="file" href="#diff-1">gopmweb.go</a>
</li>
<li>
<div class="diff-counter count pull-right">
<span class="add" data-line="666">666</span>
<span class="bar">
<span class="pull-left add"></span>
<span class="pull-left del"></span>
</span>
<span class="del" data-line="44">44</span>
</div>
<span class="status add" data-toggle="tooltip" data-placement="right" title="add">&nbsp;</span>
<a class="file" href="#diff-2">static/img/favicon.png</a>
</li>
<li>
<span class="status del" data-toggle="tooltip" data-placement="right" title="delete">&nbsp;</span>
<a class="file" href="#diff-2">static/img/favicon.png</a>
</li>
<li>
<span class="status rename" data-toggle="tooltip" data-placement="right" title="rename">&nbsp;</span>
<a class="file" href="#diff-2">static/img/favicon.png</a>
</li>
</ol>
</div>
<div class="panel panel-default diff-file-box diff-box file-content" id="diff-1">
<div class="panel-heading">
<div class="diff-counter count pull-left">
<span class="add" data-line="1">BIN</span>
<span class="bar">
<span class="pull-left add"></span>
<span class="pull-left del"></span>
</span>
<span class="del" data-line="0"></span>
</div>
<a class="btn btn-default btn-sm pull-right" href="#">View File</a>
<span class="file">data/test/bson_test/simple_type.png</span>
</div>
<div class="panel-body file-body file-code code-view code-bin">
<table>
<tbody>
<tr class="text-center"><td><img src="http://1.gravatar.com/avatar/f72f7454ce9d710baa506394f68f4132?s=200" alt=""/></td></tr>
</tbody>
</table>
</div>
</div>
<div class="panel panel-default diff-file-box diff-box file-content" id="diff-2">
<div class="panel-heading">
<div class="diff-counter count pull-left">
<span class="add" data-line="30">+ 30</span>
<span class="bar">
<span class="pull-left add"></span>
<span class="pull-left del"></span>
</span>
<span class="del" data-line="4">- 4</span>
</div>
<a class="btn btn-default btn-sm pull-right" href="#">View File</a>
<span class="file">data/test/bson_test/simple_type.go</span>
</div>
<div class="panel-body file-body file-code code-view code-diff">
<table>
<tbody>
<tr class="same-code nl-1 ol-1">
<td class="lines-num lines-num-old">
<span rel="L1">1</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">1</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-2 ol-2">
<td class="lines-num lines-num-old">
<span rel="L1">2</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">2</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-3 ol-3">
<td class="lines-num lines-num-old">
<span rel="L3">3</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L3">3</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="add-code nl-4 ol-0">
<td class="lines-num lines-num-old">
<span rel="add">+</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L4">4</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="add-code nl-5 ol-0">
<td class="lines-num lines-num-old">
<span rel="add">+</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L5">5</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-4">
<td class="lines-num lines-num-old">
<span rel="L4">4</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-5">
<td class="lines-num lines-num-old">
<span rel="L5">5</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-6">
<td class="lines-num lines-num-old">
<span rel="L6">6</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-7">
<td class="lines-num lines-num-old">
<span rel="L7">7</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-6 ol-8">
<td class="lines-num lines-num-old">
<span rel="L8">8</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L6">6</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-7 ol-9">
<td class="lines-num lines-num-old">
<span rel="L1">9</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">7</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-8 ol-10">
<td class="lines-num lines-num-old">
<span rel="L1">10</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">8</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="panel panel-default diff-file-box diff-box file-content">
<div class="panel-heading">
<div class="diff-counter count pull-left">
<span class="add" data-line="2">+ 2</span>
<span class="bar">
<span class="pull-left add"></span>
<span class="pull-left del"></span>
</span>
<span class="del" data-line="4">- 4</span>
</div>
<a class="btn btn-default btn-sm pull-right" href="#">View File</a>
<span class="file">data/test/bson_test/simple_type.go</span>
</div>
<div class="panel-body file-body file-code code-view code-diff">
<table>
<tbody>
<tr class="same-code nl-1 ol-1">
<td class="lines-num lines-num-old">
<span rel="L1">1</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">1</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-2 ol-2">
<td class="lines-num lines-num-old">
<span rel="L1">2</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">2</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-3 ol-3">
<td class="lines-num lines-num-old">
<span rel="L3">3</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L3">3</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="add-code nl-4 ol-0">
<td class="lines-num lines-num-old">
<span rel="add">+</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L4">4</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="add-code nl-5 ol-0">
<td class="lines-num lines-num-old">
<span rel="add">+</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L5">5</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-4">
<td class="lines-num lines-num-old">
<span rel="L4">4</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-5">
<td class="lines-num lines-num-old">
<span rel="L5">5</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-6">
<td class="lines-num lines-num-old">
<span rel="L6">6</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="del-code nl-0 ol-7">
<td class="lines-num lines-num-old">
<span rel="L7">7</span>
</td>
<td class="lines-num lines-num-new">
<span rel="del">-</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-6 ol-8">
<td class="lines-num lines-num-old">
<span rel="L8">8</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L6">6</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-7 ol-9">
<td class="lines-num lines-num-old">
<span rel="L1">9</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">7</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
<tr class="same-code nl-8 ol-10">
<td class="lines-num lines-num-old">
<span rel="L1">10</span>
</td>
<td class="lines-num lines-num-new">
<span rel="L1">8</span>
</td>
<td class="lines-code">
<pre> "github.com/youtube/vitess/go/bson"</pre>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="panel panel-default diff-file-box diff-box file-content">
<div class="panel-heading">
<div class="diff-counter count pull-left">
<span class="add" data-line="0">BIN</span>
<span class="bar">
<span class="pull-left add"></span>
<span class="pull-left del"></span>
</span>
<span class="del" data-line="1"></span>
</div>
<a class="btn btn-default btn-sm pull-right" href="#">View File</a>
<span class="file">data/test/bson_test/simple_type.png</span>
</div>
<div class="panel-body file-body file-code code-view code-bin">
<table>
<tbody>
<tr class="text-center"><td><img src="http://1.gravatar.com/avatar/f72f7454ce9d710baa506394f68f4132?s=200" alt=""/></td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
{{template "base/footer" .}}

4
web.go
Unescape View File

@ -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)

Write Preview
Loading…
Cancel
Save