dmitri.shuralyov.com/app/changes/...

Work on better display of review event+comment.
dmitshur committed 6 years ago commit df42c9cf05f88830fff5a974b1932504de589b7f
Collapse all
_data/change.html.tmpl
@@ -19,9 +19,11 @@
{{end}}

{{define "timeline-item"}}
	{{if eq .TemplateName "comment"}}
		{{template "comment" .TimelineItem}}
	{{else if eq .TemplateName "review"}}
		{{template "review" .TimelineItem}}
	{{else if eq .TemplateName "event"}}
		{{render (event .TimelineItem)}}
	{{end}}
{{end}}
_data/comment.html.tmpl
@@ -1,6 +1,6 @@
{{/* Dot is an changes.Comment. */}}
{{/* Dot is a changes.Comment. */}}
{{define "comment"}}
<div>
	<div>
		<div style="float: left; margin-right: 10px;">{{render (avatar .User)}}</div>
		<div id="comment-{{.ID}}" style="display: flex;" class="list-entry">
@@ -29,5 +29,74 @@
	{{if (not state.DisableReactions)}}
		{{render (reactionsBar .Reactions (reactableID .ID))}}
	{{end}}
</div>
{{end}}

{{/* Dot is a changes.Review. */}}
{{define "review"}}
<div>
	<div>
		<div style="float: left; margin-right: 10px;">{{render (avatar .User)}}</div>
		<div id="comment-{{.ID}}" style="display: flex;" class="list-entry">
			<div class="list-entry-container list-entry-border">
				<header class="list-entry-header" style="display: flex;{{if eq .State +1}} background-color: #d4ffd4; padding: 4px;{{end}}{{if and .State (not .Body)}} border: none;{{end}}">
					<span class="content"{{if .State}} style="line-height: 28px;"{{end}}>{{template "review-icon" .State}}{{render (user .User)}} {{template "review-action" .State}} <a class="black" href="#comment-{{.ID}}" onclick="AnchorScroll(this, event);">{{render (time .CreatedAt)}}</a>
						{{with .Edited}} ยท <span style="cursor: default;" title="{{.By.Login}} edited this comment {{reltime .At}}.">edited{{if not (equalUsers $.User .By)}} by {{.By.Login}}{{end}}</span>{{end}}
					</span>
					{{if (not state.DisableReactions)}}
						<span class="right-icon">{{render (newReaction (reactableID .ID))}}</span>
					{{end}}
					{{if .Editable}}<span class="right-icon"><a href="javascript:" title="Edit" onclick="EditComment({{`edit` | json}}, this);">{{octicon "pencil"}}</a></span>{{end}}
				</header>
				{{if or .Body (not .State)}}
				<div class="list-entry-body">
					<div class="markdown-body">
						{{with .Body}}
							{{. | gfm}}
						{{else}}
							<i class="gray">No description.</i>
						{{end}}
					</div>
				</div>
				{{end}}
			</div>
		</div>
	</div>
	{{if (not state.DisableReactions)}}
		{{render (reactionsBar .Reactions (reactableID .ID))}}
	{{end}}
</div>
{{end}}

{{/* Dot is changes.ReviewState. */}}
{{define "review-icon" }}
	{{if eq . +1}}
		<span class="event-icon" style="color: #fff; background-color: #6cc644;">{{octicon "check"}}</span>
	{{else if eq . -1}}
		TODO
	{{end}}
{{end}}

{{/* Dot is changes.ReviewState. */}}
{{define "review-action" }}
	{{if eq . 0}}
		commented
	{{else if eq . +1}}
		approved this change
	{{else if eq . -1}}
		requested changes
	{{end}}
{{end}}

{{define "review-mock"}}
<html>
	<head>
		{{template "head" .}}
	</head>
	<body>
		{{template "body-pre" .}}
		{{.BodyTop}}
		{{template "review" .Review}}
	</body>
</html>
{{end}}
_data/style.css
@@ -164,19 +164,19 @@ textarea.comment-editor:focus {

.event {
	margin-left: 58px;
}
.event-header {
	padding-top: 6px;
	padding-bottom: 6px;
	padding-top: 4px;
	padding-bottom: 4px;
	line-height: 20px;
}
.event-icon {
	float: left;
	margin-right: 10px;
	width: 32px;
	height: 32px;
	width: 28px;
	height: 28px;
	display: flex; justify-content: center; align-items: center;
	border-radius: 50%;
}

header.list-entry-header nav a {
display.go
@@ -27,10 +27,12 @@ type timelineItem struct {

func (i timelineItem) TemplateName() string {
	switch i.TimelineItem.(type) {
	case changes.Comment:
		return "comment"
	case changes.Review:
		return "review"
	case changes.TimelineItem:
		return "event"
	default:
		panic(fmt.Errorf("unknown item type %T", i.TimelineItem))
	}
@@ -38,10 +40,12 @@ func (i timelineItem) TemplateName() string {

func (i timelineItem) CreatedAt() time.Time {
	switch i := i.TimelineItem.(type) {
	case changes.Comment:
		return i.CreatedAt
	case changes.Review:
		return i.CreatedAt
	case changes.TimelineItem:
		return i.CreatedAt
	default:
		panic(fmt.Errorf("unknown item type %T", i))
	}
@@ -49,10 +53,12 @@ func (i timelineItem) CreatedAt() time.Time {

func (i timelineItem) ID() uint64 {
	switch i := i.TimelineItem.(type) {
	case changes.Comment:
		return i.ID
	case changes.Review:
		return i.ID
	case changes.TimelineItem:
		return i.ID
	default:
		panic(fmt.Errorf("unknown item type %T", i))
	}