improve

Author: wxiaoguang

modules/timeutil/since.go

@@ -114,14 +114,31 @@ func timeSincePro(then, now time.Time, lang translation.Locale) string {
 	return strings.TrimPrefix(timeStr, ", ")
 }
 
-// TimeSince renders relative time HTML given a time.Time
-func TimeSince(then time.Time, lang translation.Locale, relativeTimeOptions ...string) template.HTML {
-	timestamp := then.UTC().Format(time.RFC3339)
+func timeSinceUnix(then, now time.Time, lang translation.Locale) template.HTML {
+	friendlyText := then.Format("2006-01-02 15:04:05 +07:00")
+
+	// document: https://github.com/github/relative-time-element
+	attrs := `tense="past"`
+	isFuture := now.Before(then)
+	if isFuture {
+		attrs = `format="duration" tense="future"`
+	}
+
 	// declare data-tooltip-content attribute to switch from "title" tooltip to "tippy" tooltip
-	return template.HTML(fmt.Sprintf(`<relative-time class="time-since" %s prefix="%s" datetime="%s" data-tooltip-content data-tooltip-interactive="true">%s</relative-time>`, strings.Join(relativeTimeOptions, " "), lang.Tr("on_date"), timestamp, timestamp))
+	htm := fmt.Sprintf(`<relative-time class="time-since" prefix="" %s datetime="%s" data-tooltip-content data-tooltip-interactive="true">%s</relative-time>`,
+		attrs, then.Format(time.RFC3339), friendlyText)
+	if isFuture {
+		return template.HTML(lang.Tr("tool.from_now", htm))
+	}
+	return template.HTML(htm)
+}
+
+// TimeSince renders relative time HTML given a time.Time
+func TimeSince(then time.Time, lang translation.Locale) template.HTML {
+	return timeSinceUnix(then, time.Now(), lang)
 }
 
 // TimeSinceUnix renders relative time HTML given a TimeStamp
-func TimeSinceUnix(then TimeStamp, lang translation.Locale, relativeTimeOptions ...string) template.HTML {
-	return TimeSince(then.AsLocalTime(), lang, relativeTimeOptions...)
+func TimeSinceUnix(then TimeStamp, lang translation.Locale) template.HTML {
+	return TimeSince(then.AsLocalTime(), lang)
 }

routers/web/devtest/devtest.go

@@ -7,6 +7,7 @@ import (
 	"net/http"
 	"path"
 	"strings"
+	"time"
 
 	"code.gitea.io/gitea/modules/base"
 	"code.gitea.io/gitea/modules/context"
@@ -32,5 +33,15 @@ func List(ctx *context.Context) {
 }
 
 func Tmpl(ctx *context.Context) {
+
+	now := time.Now()
+	ctx.Data["TimeNow"] = now
+	ctx.Data["TimePast5s"] = now.Add(-5 * time.Second)
+	ctx.Data["TimeFuture5s"] = now.Add(5 * time.Second)
+	ctx.Data["TimePast2m"] = now.Add(-2 * time.Minute)
+	ctx.Data["TimeFuture2m"] = now.Add(2 * time.Minute)
+	ctx.Data["TimePast1y"] = now.Add(-1 * 366 * 86400 * time.Second)
+	ctx.Data["TimeFuture1y"] = now.Add(1 * 366 * 86400 * time.Second)
+
 	ctx.HTML(http.StatusOK, base.TplName("devtest"+path.Clean("/"+ctx.Params("sub"))))
 }

templates/devtest/gitea-ui.tmpl

@@ -1,12 +1,51 @@
 {{template "base/head" .}}
-<div class="page-content devtest">
+<div class="page-content devtest ui container">
+
 	<div>
-		<gitea-origin-url data-url="test/url"></gitea-origin-url>
-		<gitea-origin-url data-url="/test/url"></gitea-origin-url>
+		<h1>Tooltip</h1>
+		<div><span data-tooltip-content="test tooltip">text with tooltip</span></div>
+		<div><span data-tooltip-content="test tooltip" data-tooltip-interactive="true">text with interactive tooltip</span></div>
 	</div>
+
 	<div>
-		<span data-tooltip-content="test tooltip">text with tooltip</span>
+		<h1>GiteaOriginUrl</h1>
+		<div><gitea-origin-url data-url="test/url"></gitea-origin-url></div>
+		<div><gitea-origin-url data-url="/test/url"></gitea-origin-url></div>
 	</div>
-	{{template "shared/combomarkdowneditor" .}}
+
+	<div>
+		<h1>LocaleNumber</h1>
+		<div>{{LocaleNumber 1}}</div>
+		<div>{{LocaleNumber 12}}</div>
+		<div>{{LocaleNumber 123}}</div>
+		<div>{{LocaleNumber 1234}}</div>
+		<div>{{LocaleNumber 12345}}</div>
+		<div>{{LocaleNumber 123456}}</div>
+		<div>{{LocaleNumber 1234567}}</div>
+	</div>
+
+	<div>
+		<h1>TimeSince</h1>
+		<div>Now: {{TimeSince .TimeNow $.locale}}</div>
+		<div>5s past: {{TimeSince .TimePast5s $.locale}}</div>
+		<div>5s future: {{TimeSince .TimeFuture5s $.locale}}</div>
+		<div>2m past: {{TimeSince .TimePast2m $.locale}}</div>
+		<div>2m future: {{TimeSince .TimeFuture2m $.locale}}</div>
+		<div>1y past: {{TimeSince .TimePast1y $.locale}}</div>
+		<div>1y future: {{TimeSince .TimeFuture1y $.locale}}</div>
+	</div>
+
+	<div>
+		<h1>ComboMarkdownEditor</h1>
+		<div>ps: no JS code attached, so just a layout</div>
+		{{template "shared/combomarkdowneditor" .}}
+	</div>
+
+	<style>
+		h1 {
+			margin: 0;
+			padding: 10px 0;
+		}
+	</style>
 </div>
 {{template "base/footer" .}}

templates/repo/view_list.tmpl

@@ -34,7 +34,7 @@
 					</span>
 				{{end}}
 			</th>
-			<th class="text grey right age">{{if .LatestCommit}}{{if .LatestCommit.Committer}}{{TimeSince .LatestCommit.Committer.When $.locale "tense=past"}}{{end}}{{end}}</th>
+			<th class="text grey right age">{{if .LatestCommit}}{{if .LatestCommit.Committer}}{{TimeSince .LatestCommit.Committer.When $.locale}}{{end}}{{end}}</th>
 		</tr>
 	</thead>
 	<tbody>
@@ -87,7 +87,7 @@
 						{{end}}
 					</span>
 				</td>
-				<td class="text right age three wide">{{if $commit}}{{TimeSince $commit.Committer.When $.locale "tense=past"}}{{end}}</td>
+				<td class="text right age three wide">{{if $commit}}{{TimeSince $commit.Committer.When $.locale}}{{end}}</td>
 			</tr>
 		{{end}}
 	</tbody>