diff --git a/public/timemachine/dither-gradient.afphoto b/public/timemachine/dither-gradient.afphoto new file mode 100644 index 00000000..9ba58fb1 Binary files /dev/null and b/public/timemachine/dither-gradient.afphoto differ diff --git a/public/timemachine/ipodtouch-dither.gif b/public/timemachine/ipodtouch-dither.gif new file mode 100644 index 00000000..be2050f1 Binary files /dev/null and b/public/timemachine/ipodtouch-dither.gif differ diff --git a/public/timemachine/ipodtouch.png b/public/timemachine/ipodtouch.png new file mode 100644 index 00000000..20fbfb44 Binary files /dev/null and b/public/timemachine/ipodtouch.png differ diff --git a/public/timemachine/splash.afphoto b/public/timemachine/splash.afphoto new file mode 100644 index 00000000..e6705fde Binary files /dev/null and b/public/timemachine/splash.afphoto differ diff --git a/public/timemachine/splash.gif b/public/timemachine/splash.gif new file mode 100644 index 00000000..5aeb0c22 Binary files /dev/null and b/public/timemachine/splash.gif differ diff --git a/src/templates/svg/appleinc.svg b/src/templates/img/appleinc.svg similarity index 100% rename from src/templates/svg/appleinc.svg rename to src/templates/img/appleinc.svg diff --git a/src/templates/svg/chevron-down-thick.svg b/src/templates/img/chevron-down-thick.svg similarity index 100% rename from src/templates/svg/chevron-down-thick.svg rename to src/templates/img/chevron-down-thick.svg diff --git a/src/templates/svg/chevron-down.svg b/src/templates/img/chevron-down.svg similarity index 100% rename from src/templates/svg/chevron-down.svg rename to src/templates/img/chevron-down.svg diff --git a/src/templates/svg/chevron-left.svg b/src/templates/img/chevron-left.svg similarity index 100% rename from src/templates/svg/chevron-left.svg rename to src/templates/img/chevron-left.svg diff --git a/src/templates/svg/chevron-right.svg b/src/templates/img/chevron-right.svg similarity index 100% rename from src/templates/svg/chevron-right.svg rename to src/templates/img/chevron-right.svg diff --git a/src/templates/svg/close.svg b/src/templates/img/close.svg similarity index 100% rename from src/templates/svg/close.svg rename to src/templates/img/close.svg diff --git a/src/templates/svg/discord.svg b/src/templates/img/discord.svg similarity index 100% rename from src/templates/svg/discord.svg rename to src/templates/img/discord.svg diff --git a/src/templates/svg/google.svg b/src/templates/img/google.svg similarity index 100% rename from src/templates/svg/google.svg rename to src/templates/img/google.svg diff --git a/src/templates/svg/hmn_circuit.svg b/src/templates/img/hmn_circuit.svg similarity index 100% rename from src/templates/svg/hmn_circuit.svg rename to src/templates/img/hmn_circuit.svg diff --git a/src/templates/svg/spotify.svg b/src/templates/img/spotify.svg similarity index 100% rename from src/templates/svg/spotify.svg rename to src/templates/img/spotify.svg diff --git a/src/templates/img/timemachine/win95-border-inset.gif b/src/templates/img/timemachine/win95-border-inset.gif new file mode 100644 index 00000000..f9a49adb Binary files /dev/null and b/src/templates/img/timemachine/win95-border-inset.gif differ diff --git a/src/templates/img/timemachine/win95-border.gif b/src/templates/img/timemachine/win95-border.gif new file mode 100644 index 00000000..620d4dba Binary files /dev/null and b/src/templates/img/timemachine/win95-border.gif differ diff --git a/src/templates/img/timemachine/win95-close.gif b/src/templates/img/timemachine/win95-close.gif new file mode 100644 index 00000000..ef7389bc Binary files /dev/null and b/src/templates/img/timemachine/win95-close.gif differ diff --git a/src/templates/svg/twitter.svg b/src/templates/img/twitter.svg similarity index 100% rename from src/templates/svg/twitter.svg rename to src/templates/img/twitter.svg diff --git a/src/templates/src/layouts/timemachine_base.html b/src/templates/src/layouts/timemachine_base.html new file mode 100644 index 00000000..68a0cacd --- /dev/null +++ b/src/templates/src/layouts/timemachine_base.html @@ -0,0 +1,54 @@ +{{/* + This is a copy-paste from base.html because we want to preserve the unique + style of landing pages if we change base.html in the future. +*/}} + + + + + + + + + + {{ if .CanonicalLink }}{{ end }} + {{ range .OpenGraphItems }} + {{ if .Property }} + + {{ else }} + + {{ end }} + {{ end }} + {{ if .Title }} + {{ .Title }} | Handmade Network + {{ else }} + Handmade Network + {{ end }} + + + + + + + + + + + + +
+
+ {{ template "header.html" . }} +
+ +
+ {{ block "content" . }}{{ end }} +
+ +
+ {{ template "footer.html" . }} +
+
+ + + diff --git a/src/templates/src/time-machine.html b/src/templates/src/time-machine.html index 493bf6e3..fbe81430 100644 --- a/src/templates/src/time-machine.html +++ b/src/templates/src/time-machine.html @@ -1,5 +1,13 @@ -{{ template "landing_page.html" . }} {{ define "content" }} +{{ template "timemachine_base.html" . }} +{{ define "frame title" }} +
+ {{ . }} + +
+{{ end }} + +{{ define "content" }} -
-
-

Time Machine

+
+
+
+ Time Machine +
-
Overview
-
+ {{ template "frame title" "Overview" }} +

- This summer, we’re digging out old devices and seeing what they were + This summer, we're digging out old devices and seeing what they were actually like to use.

- Our phones today are far more powerful than our desktop computers from - decades ago. But those old computers worked just fine! The Time - Machine project is a chance to revisit those old devices and see what - they were actually like to use. + Our phones today are far more powerful than our desktop computers from decades ago. But those old computers worked just fine! The Time Machine project is a chance to revisit those old devices and see what they were actually like to use.

- As our hardware has improved, how has the user experience changed? - Which parts have stayed the same? Which parts have gotten worse? - There’s only one way to find out. + As our hardware has improved, how has the user experience changed? Which parts have stayed the same? Which parts have gotten worse? There's only one way to find out.

How To Participate
-
+

  1. - Take video of yourself using an older device. Any - personal device from any time period is great. We’re particularly - interested in the history of day-to-day devices like personal - computers, and mobile phones. + Take video of yourself using an older device. Any personal device from any time period is great. We're particularly interested in the history of day-to-day devices like personal computers, and mobile phones.

  2. - Upload the video somewhere. Upload to Google - Drive, Dropbox, or even YouTube - anywhere we can download it - from. + Upload the video somewhere. Upload to Google Drive, Dropbox, or even YouTube - anywhere we can download it from.

  3. - Send us the video link + extra info. Tell us - about this device, when you got it, what specs it has, and - anything else you think is interesting. We’ll get the video posted - here on the website for everyone to see. + Send us the video link + extra info. Tell us about this device, when you got it, what specs it has, and anything else you think is interesting. We'll get the video posted here on the website for everyone to see.

- At the end of the summer, we’ll compile all the submissions into a - final report. + At the end of the summer, we'll compile all the submissions into a final report.

Example Submission
-
+
diff --git a/src/templates/templates.go b/src/templates/templates.go index c6adfaaf..763c038b 100644 --- a/src/templates/templates.go +++ b/src/templates/templates.go @@ -2,9 +2,12 @@ package templates import ( "embed" + "encoding/base64" "fmt" "html/template" + "io" "io/fs" + "net/http" "regexp" "strings" "time" @@ -105,8 +108,24 @@ func names(ts []*template.Template) []string { return result } -//go:embed svg/* -var SVGs embed.FS +//go:embed img/* +var Imgs embed.FS + +func GetImg(filepath string) []byte { + var imgs fs.FS + if config.Config.DevConfig.LiveTemplates { + imgs = utils.DirFS("src/templates/img") + } else { + imgs = Imgs + } + + img, err := imgs.Open(filepath) + if err != nil { + panic(err) + } + + return utils.Must1(io.ReadAll(img)) +} var controlCharRegex = regexp.MustCompile(`\p{Cc}`) @@ -200,7 +219,7 @@ var HMNTemplateFuncs = template.FuncMap{ } }, "svg": func(name string) template.HTML { - contents, err := SVGs.ReadFile(fmt.Sprintf("svg/%s.svg", name)) + contents, err := Imgs.ReadFile(fmt.Sprintf("img/%s.svg", name)) if err != nil { panic("SVG not found: " + name) } @@ -218,6 +237,12 @@ var HMNTemplateFuncs = template.FuncMap{ "staticthemenobust": func(theme string, filepath string) string { return hmnurl.BuildTheme(filepath, theme, false) }, + "dataimg": func(filepath string) template.URL { + contents := GetImg(filepath) + mime := http.DetectContentType(contents) + contentsBase64 := base64.StdEncoding.EncodeToString(contents) + return template.URL(fmt.Sprintf("data:%s;base64,%s", mime, contentsBase64)) + }, "string2uuid": func(s string) string { return uuid.NewSHA1(uuid.NameSpaceURL, []byte(s)).URN() },