From 4ee6cd1f1348a60a2dc7b5e62c7997c3f4205eca Mon Sep 17 00:00:00 2001
From: Kamil Samigullin <kamil@samigullin.info>
Date: Sun, 4 Feb 2018 21:45:09 +0300
Subject: [PATCH] remove go 1.7.x and 1.8.x from travis config, change redirect
 url logic, add pixel middleware for future, fix #66: complete docs

---
 .travis.yml                      |   4 -
 docs/index.html                  |  70 +++++-------
 docs/script.js                   |   8 ++
 docs/style.css                   | 187 +++++++++----------------------
 env/rest.http                    |   4 -
 server/middleware/pixel.go       |  23 ++++
 server/middleware/pixel_test.go  |  40 +++++++
 server/router/chi/router.go      |   2 -
 server/router/chi/router_test.go |   5 -
 server/server.go                 |   2 +-
 10 files changed, 152 insertions(+), 193 deletions(-)
 create mode 100644 server/middleware/pixel.go
 create mode 100644 server/middleware/pixel_test.go

diff --git a/.travis.yml b/.travis.yml
index 8424972..870d8a0 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,15 +1,11 @@
 language: go
 
 go:
-- 1.7.x
-- 1.8.x
 - 1.9.x
 - master
 
 matrix:
   allow_failures:
-  - go: 1.7.x # problems with go generate
-  - go: 1.8.x # problems with go generate
   - go: master
   fast_finish: true
 
diff --git a/docs/index.html b/docs/index.html
index d284d46..f47b2ba 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -13,11 +13,11 @@
     <link rel="icon" type="image/png" sizes="16x16" href="https://www.octolab.org/img/icon/favicon-16x16.png">
     <link rel="mask-icon" href="https://www.octolab.org/img/icon/safari-pinned-tab.svg" color="#5bbad5">
     <link rel="shortcut icon" href="https://www.octolab.org/img/icon/favicon.ico">
-
     <meta name="msapplication-TileColor" content="#00a300">
-    <meta name="msapplication-TileImage" content="/img/icon/mstile-144x144.png">
-    <meta name="msapplication-config" content="/img/icon/browserconfig.xml">
+    <meta name="msapplication-TileImage" content="https://www.octolab.org/img/icon/mstile-144x144.png">
+    <meta name="msapplication-config" content="https://www.octolab.org/img/icon/browserconfig.xml">
     <meta name="theme-color" content="#ffffff">
+
     <script async src="https://www.googletagmanager.com/gtag/js?id=UA-109817251-15"></script>
     <script>
         window.dataLayer = window.dataLayer || [];
@@ -91,7 +91,7 @@ <h1>Motivation</h1>
                 <div class="col-md-4">
                     <h2><i class="fas fa-code-branch"></i></h2>
                     <h3>Open Source</h3>
-                    <p>We found some services like <strong>Wufoo</strong> and <strong>Paperclip</strong> are useful.
+                    <p>We found some services like <strong>Wufoo</strong> and <strong>Pageclip</strong> are useful.
                         However, they are proprietary, closed and paid. Also, we want to have full control of our data.
                         With love for open source, we start to create something similar from scratch and share it with
                         our community.</p>
@@ -199,7 +199,7 @@ <h1>Live examples</h1>
                     </div>
                     <div class="clipboard"><button class="btn-alert" title="Show alerts">Alert</button></div>
                     <div class="highlight highlight-source-xml">
-                        <pre><code class="language-xml" data-lang="xml" data-target="demo-form-en">&lt;form lang=&quot;en&quot; title=&quot;GitHub demo page&quot;
+                        <pre data-target="demo-form-en"><code class="language-xml" data-lang="xml">&lt;form lang=&quot;en&quot; title=&quot;GitHub demo page&quot;
       action=&quot;https://kamilsk.github.io/form-api/&quot;
       method=&quot;post&quot; enctype=&quot;application/x-www-form-urlencoded&quot;&gt;
     &lt;input name=&quot;name&quot; type=&quot;text&quot; title=&quot;Name&quot;
@@ -207,7 +207,7 @@ <h1>Live examples</h1>
     &lt;input name=&quot;feedback&quot; type=&quot;text&quot; title=&quot;Feedback&quot;
            placeholder=&quot;Your feedback...&quot; maxlength=&quot;255&quot; required=&quot;1&quot;/&gt;
 &lt;/form&gt;</code></pre>
-                        <pre class="d-none"><code class="language-xml" data-lang="xml" data-target="demo-form-ru">&lt;form lang=&quot;en&quot; title=&quot;GitHub демо&quot;
+                        <pre class="d-none" data-target="demo-form-ru"><code class="language-xml" data-lang="xml">&lt;form lang=&quot;ru&quot; title=&quot;GitHub демо&quot;
       action=&quot;https://kamilsk.github.io/form-api/&quot;
       method=&quot;post&quot; enctype=&quot;application/x-www-form-urlencoded&quot;&gt;
     &lt;input name=&quot;name&quot; type=&quot;text&quot; title=&quot;Имя&quot;
@@ -367,7 +367,7 @@ <h6>Images</h6>
                         <li><a href="https://hub.docker.com/r/kamilsk/form-api/">kamilsk/form-api:latest</a></li>
                         <li>
                             <a href="https://hub.docker.com/r/kamilsk/nginx/">kamilsk/nginx:alpine</a> - optional,
-                            if you want HTTPS via <a href="https://letsencrypt.org/">Let's Encrypt</a>
+                            if you want to use HTTPS via <a href="https://letsencrypt.org/">Let's Encrypt</a>
                         </li>
                     </ul>
                 </div>
@@ -404,80 +404,62 @@ <h3 class="text-center">and now you are ready to taste it</h3>
             </div>
         </div>
     </div>
-
-
-
     <div class="row">
         <div class="col p-4">
             <h1 class="text-center">Roadmap<br><i class="fas fa-road"></i></h1>
-
-
-
-            <section id="cd-timeline">
-                <div class="cd-timeline-block">
-                    <div class="cd-timeline-img complete">
+            <section id="timeline">
+                <div class="block">
+                    <div class="icon complete">
                         <i class="far fa-calendar-check"></i>
                     </div>
-                    <div class="cd-timeline-content">
+                    <div class="content">
                         <h2>MVP, v1.0</h2>
                     </div>
                 </div>
-
-                <div class="cd-timeline-block">
-                    <div class="cd-timeline-img">
+                <div class="block">
+                    <div class="icon">
                         <i class="far fa-calendar-alt"></i>
                     </div>
-                    <div class="cd-timeline-content">
+                    <div class="content">
                         <h2>CRUD, v2.0</h2>
                     </div>
                 </div>
-
-                <div class="cd-timeline-block">
-                    <div class="cd-timeline-img">
+                <div class="block">
+                    <div class="icon">
                         <i class="far fa-calendar-alt"></i>
                     </div>
-                    <div class="cd-timeline-content">
+                    <div class="content">
                         <h2>GUI, v3.0</h2>
                     </div>
                 </div>
-
-                <div class="cd-timeline-block">
-                    <div class="cd-timeline-img">
+                <div class="block">
+                    <div class="icon">
                         <i class="far fa-calendar-alt"></i>
                     </div>
-                    <div class="cd-timeline-content">
+                    <div class="content">
                         <h2>API v2, v4.0</h2>
                     </div>
                 </div>
-
-                <div class="cd-timeline-block">
-                    <div class="cd-timeline-img">
+                <div class="block">
+                    <div class="icon">
                         <i class="far fa-calendar-alt"></i>
                     </div>
-                    <div class="cd-timeline-content">
+                    <div class="content">
                         <h2>Extensibility, v5.0</h2>
                     </div>
                 </div>
-
-                <div class="cd-timeline-block">
-                    <div class="cd-timeline-img">
+                <div class="block">
+                    <div class="icon">
                         <i class="fas fa-flag-checkered"></i>
                     </div>
-                    <div class="cd-timeline-content">
+                    <div class="content">
                         <h2>FormA, SaaS</h2>
                     </div>
                 </div>
             </section>
-
-
-
         </div>
     </div>
 </main>
-
-
-
-
 <footer>
     <p>Feel free to support us at</p>
     <a href="https://www.patreon.com/octolab"><img height="50" src="img/patreon.svg" alt="Patreon"></a>
diff --git a/docs/script.js b/docs/script.js
index d9d7c48..1e7d104 100644
--- a/docs/script.js
+++ b/docs/script.js
@@ -52,4 +52,12 @@
         });
         showMessages();
     });
+
+    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
+        const target = $(e.target).attr('href').substr(1);
+        $('pre[data-target="' + target + '"').each(function (i, node) {
+            $(node).removeClass('d-none');
+            $(node).siblings('pre').addClass('d-none');
+        });
+    });
 }(window.jQuery));
diff --git a/docs/style.css b/docs/style.css
index 9556d75..d54a21b 100644
--- a/docs/style.css
+++ b/docs/style.css
@@ -53,108 +53,61 @@ img { max-width: 100%; }
 
 #messages { position: fixed; bottom: 1rem; right: 1rem; z-index: 10; width: 40%; max-width: 512px; }
 
-
-
-
-
-
-
-#cd-timeline {
+#timeline {
     position: relative;
-    padding: 2em 0;
-    margin-top: 2em;
-    margin-bottom: 2em;
-}
-#cd-timeline::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 18px;
-    height: 100%;
-    width: 4px;
+    margin: 2em 0; padding: 2em 0;
+}
+#timeline::before {
+    content: "";
+    position: absolute; top: 0; left: 18px;
+    width: 4px; height: 100%;
     background: #d7e4ed;
 }
-.cd-timeline-block {
+#timeline .block {
     position: relative;
     margin: 2em 0;
 }
-.cd-timeline-block:after {
+#timeline .block:after {
     content: "";
-    display: table;
-    clear: both;
-}
-.cd-timeline-block:first-child {
-    margin-top: 0;
-}
-.cd-timeline-block:last-child {
-    margin-bottom: 0;
-}
-.cd-timeline-img {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 40px;
-    height: 40px;
-    border-radius: 50%;
+    display: table; clear: both;
+}
+#timeline .block:first-child    { margin-top: 0; }
+#timeline .block:last-child     { margin-bottom: 0; }
+#timeline .icon {
+    position: absolute; top: 0; left: 0;
+    width: 40px; height: 40px;
+    background: #f0ca45; border-radius: 50%;
     box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
-    background: #f0ca45;
 }
-.cd-timeline-img i,
-.cd-timeline-img svg {
+#timeline .icon.complete    { background: #75ce66; }
+#timeline .icon.overdue     { background: #c03b44; }
+#timeline .icon i,
+#timeline .icon svg {
     display: block;
-    width: 24px !important; height: 24px !important;
     position: relative; left: 50%; top: 50%;
-    margin: -12px 0 0 -12px;
-}
-.cd-timeline-img.complete {
-    background: #75ce66;
+    width: 24px !important; height: 24px !important; margin: -12px 0 0 -12px;
 }
-.cd-timeline-img.overdue {
-    background: #c03b44;
-}
-.cd-timeline-content {
+#timeline .content {
     position: relative;
-    margin-left: 60px;
-    background: #f7f7f9;
-    border-radius: 0.25em;
-    padding: 1em;
-    box-shadow: 0 3px 0 #d7e4ed;
-}
-.cd-timeline-content:after {
-    content: '';
-    display: table;
-    clear: both;
+    margin-left: 60px; padding: 1em;
+    background: #f7f7f9; border-radius: 0.25em; box-shadow: 0 3px 0 #d7e4ed;
 }
-.cd-timeline-content h2 {
-    color: #303e49;
-}
-.cd-timeline-content p, .cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
-    font-size: 0.8125rem;
+#timeline .content::before {
+    content: "";
+    position: absolute; top: 16px; right: 100%;
+    width: 0; height: 0;
+    border: 7px solid transparent; border-right: 7px solid #f7f7f9;
 }
-.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
-    display: inline-block;
+#timeline .content:after {
+    content: "";
+    display: table; clear: both;
 }
-.cd-timeline-content p {
+#timeline .content h2 { color: #303e49; }
+#timeline .content p {
     margin: 1em 0;
-    line-height: 1.6;
-}
-.cd-timeline-content::before {
-    content: '';
-    position: absolute;
-    top: 16px;
-    right: 100%;
-    height: 0;
-    width: 0;
-    border: 7px solid transparent;
-    border-right: 7px solid #f7f7f9;
+    font-size: 0.8125rem; line-height: 1.6;
 }
 
-
-
-
-
-
-
 @media only screen and (min-width: 576px) {
     .example {
         padding: 1.5rem;
@@ -162,64 +115,32 @@ img { max-width: 100%; }
     }
 }
 @media only screen and (min-width: 768px) {
-    .clipboard { display: block; }
-
-
-
-
-
-
+    .clipboard              { display: block; }
 
-    .cd-timeline-content h2 {
-        font-size: 1.25rem;
-    }
-    .cd-timeline-content p {
-        font-size: 1rem;
-    }
+    #timeline .content h2   { font-size: 1.25rem; }
+    #timeline .content p    { font-size: 1rem; }
 }
 @media only screen and (min-width: 1170px) {
-    #cd-timeline {
-        margin-top: 3em;
-        margin-bottom: 3em;
-    }
-    #cd-timeline::before {
+    #timeline { margin: 3em 0; }
+    #timeline::before {
         left: 50%;
         margin-left: -2px;
     }
-    .cd-timeline-block {
-        margin: 4em 0;
-    }
-    .cd-timeline-block:first-child {
-        margin-top: 0;
-    }
-    .cd-timeline-block:last-child {
-        margin-bottom: 0;
-    }
-    .cd-timeline-img {
-        width: 60px;
-        height: 60px;
+    #timeline .block                { margin: 4em 0; }
+    #timeline .block:first-child    { margin-top: 0; }
+    #timeline .block:last-child     { margin-bottom: 0; }
+    #timeline .icon {
         left: 50%;
-        margin-left: -30px;
-    }
-    .cd-timeline-content {
-        margin-left: 0;
-        padding: 1.6em;
-        width: 45%;
-    }
-    .cd-timeline-content::before {
-        top: 24px;
-        left: 100%;
-        border-color: transparent;
-        border-left-color: #f7f7f9;
+        width: 60px; height: 60px; margin-left: -30px;
     }
-    .cd-timeline-block:nth-child(even) .cd-timeline-content {
-        float: right;
+    #timeline .content { width: 45%; margin-left: 0; padding: 1.6em; }
+    #timeline .content::before {
+        top: 24px; left: 100%;
+        border-color: transparent; border-left-color: #f7f7f9;
     }
-    .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
-        top: 24px;
-        left: auto;
-        right: 100%;
-        border-color: transparent;
-        border-right-color: #f7f7f9;
+    #timeline .block:nth-child(even) .content { float: right; }
+    #timeline .block:nth-child(even) .content::before {
+        top: 24px; left: auto; right: 100%;
+        border-color: transparent; border-right-color: #f7f7f9;
     }
 }
diff --git a/env/rest.http b/env/rest.http
index ce90073..53f2ebf 100644
--- a/env/rest.http
+++ b/env/rest.http
@@ -34,10 +34,6 @@ Content-Type: application/x-www-form-urlencoded
 
 email=test@my.email
 
-###
-
-GET http://localhost:8080/api/v1/41ca5e09-3ce2-4094-b108-3ecc257c6fa4/heartbeat
-
 ### API v2
 
 POST http://admin:admin@localhost:8080/api/v2/schema
diff --git a/server/middleware/pixel.go b/server/middleware/pixel.go
new file mode 100644
index 0000000..266465c
--- /dev/null
+++ b/server/middleware/pixel.go
@@ -0,0 +1,23 @@
+package middleware
+
+import "net/http"
+
+// 1x1 transparent GIF
+var pixel = [...]byte{
+	0x47, 0x49, 0x46, 0x38, 0x39, 0x61, 0x1, 0x0, 0x1, 0x0, 0x80, 0x0, 0x0, 0x0, 0x0, 0x0, 0xff, 0xff, 0xff, 0x21,
+	0xf9, 0x4, 0x1, 0x0, 0x0, 0x0, 0x0, 0x2c, 0x0, 0x0, 0x0, 0x0, 0x1, 0x0, 0x1, 0x0, 0x0, 0x2, 0x1, 0x44, 0x0, 0x3b,
+}
+
+// Pixel writes transparent 1x1 GIF if it found pixel key in query params.
+func Pixel(next http.HandlerFunc) http.HandlerFunc {
+	return func(rw http.ResponseWriter, req *http.Request) {
+		query := req.URL.Query()
+		if _, found := query["pixel"]; found {
+			rw.Header().Set("Content-Type", "image/gif")
+			rw.WriteHeader(http.StatusOK)
+			rw.Write(pixel[:])
+			return
+		}
+		next.ServeHTTP(rw, req)
+	}
+}
diff --git a/server/middleware/pixel_test.go b/server/middleware/pixel_test.go
new file mode 100644
index 0000000..93114bb
--- /dev/null
+++ b/server/middleware/pixel_test.go
@@ -0,0 +1,40 @@
+package middleware_test
+
+import (
+	"net/http"
+	"net/http/httptest"
+	"testing"
+
+	"github.com/kamilsk/form-api/server/middleware"
+	"github.com/stretchr/testify/assert"
+)
+
+func TestPixel(t *testing.T) {
+	tests := []struct {
+		name    string
+		query   string
+		next    http.HandlerFunc
+		isPixel bool
+	}{
+		{"get pixel", "some.url?pixel", func(rw http.ResponseWriter, req *http.Request) {
+			rw.Header().Set("Content-Type", "text/plain")
+			rw.WriteHeader(http.StatusOK)
+		}, true},
+		{"get text", "some.url", func(rw http.ResponseWriter, req *http.Request) {
+			rw.Header().Set("Content-Type", "text/plain")
+			rw.WriteHeader(http.StatusOK)
+		}, false},
+	}
+
+	for _, test := range tests {
+		tc := test
+		t.Run(test.name, func(t *testing.T) {
+			rw, req := httptest.NewRecorder(), func() *http.Request {
+				req, _ := http.NewRequest(http.MethodGet, tc.query, nil)
+				return req
+			}()
+			middleware.Pixel(tc.next)(rw, req)
+			assert.Equal(t, tc.isPixel, "image/gif" == rw.Header().Get("Content-Type"))
+		})
+	}
+}
diff --git a/server/router/chi/router.go b/server/router/chi/router.go
index ab0ca83..edb9203 100644
--- a/server/router/chi/router.go
+++ b/server/router/chi/router.go
@@ -36,8 +36,6 @@ func NewRouter(api router.Server, withProfiler bool) http.Handler {
 			r.Delete("/", notImplemented)
 
 			r.Post("/", api.PostV1)
-
-			r.Get("/heartbeat", notImplemented)
 		})
 	})
 
diff --git a/server/router/chi/router_test.go b/server/router/chi/router_test.go
index 74fdda8..b01076f 100644
--- a/server/router/chi/router_test.go
+++ b/server/router/chi/router_test.go
@@ -66,11 +66,6 @@ func TestChiRouter(t *testing.T) {
 				Do(func(rw http.ResponseWriter, _ *http.Request) { rw.WriteHeader(http.StatusFound) })
 			return request
 		}, http.StatusFound},
-		{"GET /api/v1/{UUID}/heartbeat", func() *http.Request {
-			return &http.Request{Method: http.MethodGet, URL: &url.URL{
-				Scheme: "http", Host: "dev", Path: "/api/v1/" + UUID.String() + "/heartbeat",
-			}}
-		}, http.StatusNotImplemented},
 
 		{"POST /api/v2/schema", func() *http.Request {
 			return &http.Request{Method: http.MethodPost, URL: &url.URL{
diff --git a/server/server.go b/server/server.go
index 477f21f..7012e41 100644
--- a/server/server.go
+++ b/server/server.go
@@ -94,7 +94,7 @@ func (s *Server) PostV1(rw http.ResponseWriter, req *http.Request) {
 	)
 	request := v1.PostRequest{UUID: uuid, Data: req.PostForm}
 	response := s.service.HandlePostV1(request)
-	redirect := fallback(req.Referer(), req.PostFormValue(RedirectKey), response.Schema.Action)
+	redirect := fallback(req.PostFormValue(RedirectKey), req.Referer(), response.Schema.Action)
 	if response.Error != nil {
 		if err, is := response.Error.(errors.ApplicationError); is {
 			if clientErr, is := err.IsClientError(); is {