about summary refs log tree commit diff
path: root/src/frontend/mod.rs
blob: 029c5dc6e5964a0db69cf11b30f575b646cc9bd7 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
use crate::database::Storage;
use crate::ApplicationState;
use log::{error, info};
use serde::{Deserialize, Serialize};
use tide::{Next, Request, Response, Result, StatusCode};

static POSTS_PER_PAGE: usize = 20;

mod templates {
    use super::IndiewebEndpoints;
    use ellipse::Ellipse;
    use http_types::StatusCode;
    use log::error;

    /// Return a pretty location specifier from a geo: URI.
    fn decode_geo_uri(uri: &str) -> String {
        if let Some(part) = uri.split(':').collect::<Vec<_>>().get(1) {
            if let Some(part) = part.split(';').next() {
                let mut parts = part.split(',');
                let lat = parts.next().unwrap();
                let lon = parts.next().unwrap();
                // TODO - format them as proper latitude and longitude
                return format!("{}, {}", lat, lon);
            } else {
                uri.to_string()
            }
        } else {
            uri.to_string()
        }
    }

    markup::define! {
        Template<'a>(title: &'a str, blog_name: &'a str, endpoints: IndiewebEndpoints, content: String) {
            @markup::doctype()
            html {
                head {
                    title { @title }
                    link[rel="preconnect", href="https://fonts.gstatic.com"];
                    link[rel="stylesheet", href="/static/style.css"];
                    meta[name="viewport", content="initial-scale=1, width=device-width"];
                    // TODO: link rel= for common IndieWeb APIs: webmention, microsub
                    link[rel="micropub", href="/micropub"]; // Static, because it's built into the server itself
                    link[rel="authorization_endpoint", href=&endpoints.authorization_endpoint];
                    link[rel="token_endpoint", href=&endpoints.token_endpoint];
                }
                body {
                    nav#headerbar {
                        // TODO: Find a way to store the website name somewhere in the database
                        // Maybe in the settings?
                        ul {
                            li { a#homepage[href="/"] { @blog_name } }
                            li.shiftright { a#login[href="/login"] { "Login" } }
                        }
                    }
                    main {
                        @markup::raw(content)
                    }
                }
            }
        }
        OnboardingPage {
            h1[style="text-align: center"] {
                "Welcome to Kittybox"
            }
            script[type="module", src="/static/onboarding.js"] {}
            link[rel="stylesheet", href="/static/onboarding.css"];
            form.onboarding[action="/", method="POST"] {
                noscript {
                    p {
                        "Ok, let's be honest. Most of this software doesn't require JS to be enabled "
                        "to view pages (and in some cases, even edit them if logged in)."
                    }
                    p { "This page is a little bit different. It uses JavaScript to provide interactive features, such as:" }
                    ul {
                        li { "Multiple-input questions" }
                        li { "Answers spanning multiple fields" }
                        li { "Preview of files being uploaded" }
                        li { "Pretty pagination so you won't feel overwhelmed" }
                    }
                    p {
                        "Sadly, it's very hard or even impossible to recreate this without any JavaScript. "
                        "Good news though - the code is " b { "open-source AND free software" }
                        " (under MIT (X11) or Apache-2.0 license - your choice) "
                        "and I promise to not obfuscate it or minify it. "
                        a[href="/static/onboarding.js"] { "Here" }
                        "'s the link - you can try reading it so you'll be 200% sure "
                        "it won't steal your cookies or turn your kitty into a soulless monster."
                        @markup::raw("<!-- do cats even have souls? I'm not sure. But this code won't steal their souls anyway. -->")
                    }
                    hr;
                    p { "In other words: " b { "please enable JavaScript for this page to work properly." } small { "sorry T__T" } }
                }
                ul#progressbar[style="display: none"] {
                    li#intro { "Introduction" }
                    li#hcard { "Your profile" }
                    li#settings { "Your website" }
                    li#firstpost { "Your first post" }
                }
                fieldset#intro[style="display: none"] {
                    legend { "Introduction" }
                    p {
                        "Kittybox is a CMS that can act as a member of the IndieWeb. "
                        "IndieWeb is a global distributed social network built on top of open Web standards "
                        "and composed of blogs around the Internet supporting these standards."
                    }
                    p { "There is no registration or centralized database of any sort - everyone owns their data and is responsible for it." }
                    p { "If you're seeing this page, it looks like your configuration is correct and we can proceed with the setup." }

                    div.switch_card_buttons {
                        button.switch_card.next_card[type="button", "data-card"="hcard"] { "Next" }
                    }
                }

                fieldset#hcard[style="display: none"] {
                    legend { "Your profile" }
                    p { "An h-card is an IndieWeb social profile, and we're gonna make you one!" }
                    p { "Thanks to some clever markup, it will be readable by both humans and machines looking at your homepage."}
                    p {
                        "If you make a mistake, don't worry, you're gonna be able to edit this later."
                        "The only mandatory field is your name."
                    }

                    div.form_group {
                        label[for="hcard_name"] { "Your name" }
                        input#hcard_name[name="hcard_name", placeholder="Your name"];
                        small {
                            "No need to write the name as in your passport, this is not a legal document "
                            "- just write how you want to be called on the network. This name will be also "
                            "shown whenever you leave a comment on someone else's post using your website."
                        }
                    }

                    div.form_group {
                        label[for="pronouns"] { "Your pronouns" }
                        div.multi_input#pronouns {
                            template {
                                input#hcard_pronouns[name="hcard_pronouns", placeholder="they/them?"];
                            }
                            button.add_more[type="button", "aria-label"="Add more"] { "[+] Add more" }
                        }
                        small {
                            "Write which pronouns you use for yourself. It's a free-form field "
                            "so don't feel constrained - but keep it compact, as it'll be shown in a lot of places."
                        }
                    }

                    div.form_group {
                        label[for="urls"] { "Links to other pages of you" }
                        div.multi_input#urls {
                            template {
                                input#hcard_url[name="hcard_url", placeholder="https://example.com/"];
                            }
                            button.add_more[type="button", "aria-label"="Add more"] { "[+] Add more" }
                        }
                        small {
                            "These URLs will help your readers find you elsewhere and will help you that whoever owns these pages owns your website too"
                            " in case the links are mutual. So make sure to put a link to your site in your other social profiles!"
                        }
                    }

                    div.form_group {
                        label[for="hcard_note"] { "A little about yourself" }
                        textarea#hcard_note[name="hcard_note", placeholder="Loves cooking, plants, cats, dogs and racoons."] {}
                        small { "A little bit of introduction. Just one paragraph, and note, you can't use HTML here (yet)." }
                        // TODO: HTML e-note instead of p-note
                    }

                    // TODO: u-photo upload - needs media endpoint cooperation

                    div.switch_card_buttons {
                        button.switch_card.prev_card[type="button", "data-card"="intro"] { "Previous" }
                        button.switch_card.next_card[type="button", "data-card"="settings"] { "Next" }
                    }
                }

                fieldset#settings[style="display: none"] {
                    legend { "Your website" }
                    p { "Ok, it's nice to know you more. Tell me about what you'll be writing and how you want to name your blog." }
                    // TODO: site-name, saved to settings

                    div.form_group {
                        label[for="blog_name"] { "Your website's name"}
                        input#blog_name[name="blog_name", placeholder="Kitty Box!"];
                        small { "It'll get shown in the title of your blog, in the upper left corner!" }
                    }

                    div.form_group {
                        label[for="custom_feeds"] { "Custom feeds" }
                        small {
                            p {
                                "You can set up custom feeds to post your stuff to. "
                                "This is a nice way to organize stuff into huge folders, like all your trips or your quantified-self data."
                            }
                            p {
                                "Feeds can be followed individually, which makes it easy for users who are interested in certain types "
                                "of content you produce to follow your adventures in certain areas of your life without cluttering their "
                                "readers."
                            }
                            p {
                                "We will automatically create some feeds for you aside from these so you won't have to - including a main feed, "
                                "address book (for venues you go to and people you talk about), a cookbook for your recipes and some more."
                                // TODO: Put a link to documentation explaining feeds in more detail.
                            }
                        }
                        div.multi_input#custom_feeds {
                            template {
                                fieldset.feed {
                                    div.form_group {
                                        label[for="feed_name"] { "Name" }
                                        input#feed_name[name="feed_name", placeholder="My cool feed"];
                                        small { "This is a name that will identify this feed to the user. Make it short and descriptive!" }
                                    }
                                    div.form_group {
                                        label[for="feed_slug"] { "Slug" }
                                        input#feed_slug[name="feed_slug", placeholder="my-cool-feed"];
                                        small { "This will form a pretty URL for the feed. For example: https://example.com/feeds/my-cool-feed" }
                                    }
                                }
                            }
                            button.add_more[type="button", "aria-label"="Add more"] { "[+] Add More" }
                        }
                    }

                    div.switch_card_buttons {
                        button.switch_card.prev_card[type="button", "data-card"="hcard"] { "Previous" }
                        button.switch_card.next_card[type="button", "data-card"="firstpost"] { "Next" }
                    }
                }

                fieldset#firstpost[style="display: none"] {
                    legend { "Your first post" }
                    p { "Maybe you should start writing your first posts now. How about a short note?" }
                    p { "A note is a short-form post (not unlike a tweet - but without the actual character limit) that doesn't bear a title." }
                    p {
                        "Consider telling more about yourself, your skills and interests in this note "
                        @markup::raw("&mdash;")
                        " though you're free to write anything you want. (By the way, you can use Markdown here to spice up your note!)"
                    }

                    textarea#first_post_content[style="width: 100%; height: 8em", placeholder="Hello! I am really excited about #IndieWeb"] {}

                    div.switch_card_buttons {
                        button.switch_card.prev_card[type="button", "data-card"="settings"] { "Previous" }
                        button[type="submit"] { "Finish" }
                    }
                }
            }
        }
        Entry<'a>(post: &'a serde_json::Value) {
            article."h-entry" {
                header.metadata {
                    @if post["properties"]["name"][0].is_string() {
                        h1."p-name" {
                            @post["properties"]["name"][0].as_str().unwrap()
                        }
                    }
                    div {
                        span {
                            a."u-url"."u-uid"[href=post["properties"]["uid"][0].as_str().unwrap()] {
                                time."dt-published"[datetime=post["properties"]["published"][0].as_str().unwrap()] {
                                    @chrono::DateTime::parse_from_rfc3339(post["properties"]["published"][0].as_str().unwrap())
                                        .map(|dt| dt.format("%a %b %e %T %Y").to_string())
                                        .unwrap_or("ERROR: Couldn't parse the datetime".to_string())
                                }
                            }
                        }
                        @if post["properties"]["category"].is_array() {
                            span {
                                ul.categories {
                                    "Tagged: "
                                    @for cat in post["properties"]["category"].as_array().unwrap() {
                                        li."p-category" { @cat.as_str().unwrap() }
                                    }
                                }
                            }
                        }
                        @if post["properties"]["in-reply-to"].is_array() {
                            // TODO: Rich reply contexts - blocked on MF2 parser
                            span {
                                "In reply to: "
                                ul.replyctx {
                                    @for ctx in post["properties"]["in-reply-to"].as_array().unwrap() {
                                        li { a."u-in-reply-to"[href=ctx.as_str().unwrap()] {
                                            @ctx.as_str().unwrap().truncate_ellipse(24).as_ref()
                                        } }
                                    }
                                }
                            }
                        }
                    }
                    @if post["properties"]["location"].is_array() || post["properties"]["checkin"].is_array() {
                        div {
                            @if post["properties"]["checkin"].is_array() {
                                span {
                                    "Check-in to: "
                                    @if post["properties"]["checkin"][0].is_string() {
                                        // It's a URL
                                        a."u-checkin"[href=post["properties"]["checkin"][0].as_str().unwrap()] {
                                            @post["properties"]["checkin"][0].as_str().unwrap().truncate_ellipse(24).as_ref()
                                        }
                                    } else {
                                        a."u-checkin"[href=post["properties"]["checkin"][0]["properties"]["uid"][0].as_str().unwrap()] {
                                            @post["properties"]["checkin"][0]["properties"]["name"][0].as_str().unwrap()
                                        }
                                    }
                                }
                            }
                            @if post["properties"]["location"].is_array() {
                                span {
                                    "Location: "
                                    @if post["properties"]["location"][0].is_string() {
                                        // It's a geo: URL
                                        // We need to decode it
                                        a."u-location"[href=post["properties"]["location"][0].as_str().unwrap()] {
                                            @decode_geo_uri(post["properties"]["location"][0].as_str().unwrap())
                                        }
                                    } else {
                                        // It's an inner h-geo object
                                        a."u-location"[href=post["properties"]["location"][0]["value"].as_str().map(|x| x.to_string()).unwrap_or(format!("geo:{},{}", post["properties"]["location"][0]["properties"]["latitude"][0].as_str().unwrap(), post["properties"]["location"][0]["properties"]["longitude"][0].as_str().unwrap()))] {
                                            // I'm a lazy bitch
                                            @decode_geo_uri(&post["properties"]["location"][0]["value"].as_str().map(|x| x.to_string()).unwrap_or(format!("geo:{},{}", post["properties"]["location"][0]["properties"]["latitude"][0].as_str().unwrap(), post["properties"]["location"][0]["properties"]["longitude"][0].as_str().unwrap())))
                                        }
                                    }
                                }
                            }
                        }
                    }
                    @if post["properties"]["ate"].is_array() || post["properties"]["drank"].is_array() {
                        div {
                            @if post["properties"]["ate"].is_array() {
                                span { ul {
                                    "Ate:"
                                    @for food in post["properties"]["ate"].as_array().unwrap() {
                                        li {
                                            @if food.is_string() {
                                                // If this is a string, it's a URL.
                                                a."u-ate"[href=food.as_str().unwrap()] {
                                                    @food.as_str().unwrap().truncate_ellipse(24).as_ref()
                                                }
                                            } else {
                                                // This is a rich food object (mm, sounds tasty! I wanna eat something tasty)
                                                a."u-ate"[href=food["properties"]["uid"][0].as_str().unwrap()] {
                                                    @food["properties"]["name"][0].as_str()
                                                        .unwrap_or(food["properties"]["uid"][0].as_str().unwrap().truncate_ellipse(24).as_ref())
                                                }
                                            }
                                        }
                                    }
                                } }
                            }
                            @if post["properties"]["drank"].is_array() {
                                span { ul {
                                    "Drank:"
                                    @for food in post["properties"]["drank"].as_array().unwrap() {
                                        li {
                                            @if food.is_string() {
                                                // If this is a string, it's a URL.
                                                a."u-drank"[href=food.as_str().unwrap()] {
                                                    @food.as_str().unwrap().truncate_ellipse(24).as_ref()
                                                }
                                            } else {
                                                // This is a rich food object (mm, sounds tasty! I wanna eat something tasty)
                                                a."u-drank"[href=food["properties"]["uid"][0].as_str().unwrap()] {
                                                    @food["properties"]["name"][0].as_str()
                                                        .unwrap_or(food["properties"]["uid"][0].as_str().unwrap().truncate_ellipse(24).as_ref())
                                                }
                                            }
                                        }
                                    }
                                } }
                            }
                        }
                    }
                }
                @PhotoGallery { photos: post["properties"]["photo"].as_array() }
                @if post["properties"]["content"][0]["html"].is_string() {
                    main."e-content" {
                        @markup::raw(post["properties"]["content"][0]["html"].as_str().unwrap().trim())
                    }
                }
                @WebInteractions { post }
            }
        }
        PhotoGallery<'a>(photos: Option<&'a Vec<serde_json::Value>>) {
            @if photos.is_some() {
                @for photo in photos.unwrap() {
                    @if photo.is_string() {
                        img."u-photo"[src=photo.as_str().unwrap(), loading="lazy"];
                    } else if photo.is_array() {
                        img."u-photo"[src=photo["value"].as_str().unwrap(), loading="lazy", alt=photo["alt"].as_str().unwrap_or("")];
                    }
                }
            }
        }
        WebInteractions<'a>(post: &'a serde_json::Value) {
            footer.webinteractions {
                ul.counters {
                    li {
                        span.icon { "❤️" }
                        span.counter { @post["properties"]["like"].as_array().map(|a| a.len()).unwrap_or(0) }
                    }
                    li {
                        span.icon { "💬" }
                        span.counter { @post["properties"]["comment"].as_array().map(|a| a.len()).unwrap_or(0) }
                    }
                    li {
                        span.icon { "🔄" }
                        span.counter { @post["properties"]["repost"].as_array().map(|a| a.len()).unwrap_or(0) }
                    }
                    li {
                        span.icon { "🔖" }
                        span.counter { @post["properties"]["bookmark"].as_array().map(|a| a.len()).unwrap_or(0) }
                    }
                }
                // Needs rich webmention support which may or may not depend on an MF2 parser
                // Might circumvent with an external parser with CORS support
                // why write this stuff in rust then tho
                /*details {
                    summary { "Show comments and reactions" }
                    @if post["properties"]["like"].as_array().map(|a| a.len()).unwrap_or(0) > 0 {
                        // Show a facepile of likes for a post
                    }
                    @if post["properties"]["bookmark"].as_array().map(|a| a.len()).unwrap_or(0) > 0 {
                        // Show a facepile of bookmarks for a post
                    }
                    @if post["properties"]["repost"].as_array().map(|a| a.len()).unwrap_or(0) > 0 {
                        // Show a facepile of reposts for a post
                    }
                    @if post["properties"]["comment"].as_array().map(|a| a.len()).unwrap_or(0) > 0 {
                        // Show all the comments recursively (so we could do Salmention with them)
                    }
                }*/
            }
        }
        VCard<'a>(card: &'a serde_json::Value) {
            article."h-card" {
                @if card["properties"]["photo"][0].is_string() {
                    img."u-photo"[src=card["properties"]["photo"][0].as_str().unwrap()];
                }
                h1 {
                    a."u-url"."u-uid"."p-name"[href=card["properties"]["uid"][0].as_str().unwrap()] {
                        @card["properties"]["name"][0].as_str().unwrap()
                    }
                }
                @if card["properties"]["pronoun"].is_array() {
                    span {
                        "("
                        @for (i, pronoun) in card["properties"]["pronoun"].as_array().unwrap().iter().filter_map(|v| v.as_str()).enumerate() {
                            span."p-pronoun" {
                                @pronoun
                            }
                            // Insert commas between multiple sets of pronouns
                            @if i < (card["properties"]["pronoun"].as_array().unwrap().len() - 1) {", "}
                        }
                        ")"
                    }
                }
                p."p-note" {
                    @card["properties"]["note"][0]["value"].as_str().unwrap_or_else(|| card["properties"]["note"][0].as_str().unwrap())
                }
            }
        }
        Food<'a>(food: &'a serde_json::Value) {
            article."h-food" {
                header.metadata {
                    h1 {
                        a."p-name"."u-url"[href=food["properties"]["url"][0].as_str().unwrap()] {
                            @food["properties"]["name"][0].as_str().unwrap()
                        }
                    }
                }
                @PhotoGallery { photos: food["properties"]["photo"].as_array() }
            }
        }
        Feed<'a>(feed: &'a serde_json::Value) {
            div."h-feed" {
                div.metadata {
                    @if feed["properties"]["name"][0].is_string() {
                        h1."p-name".titanic {
                            a[href=feed["properties"]["uid"][0].as_str().unwrap(), rel="feed"] {
                                @feed["properties"]["name"][0].as_str().unwrap()
                            }
                        }
                    }
                }
                @if feed["children"].is_array() {
                    @for child in feed["children"].as_array().unwrap() {
                        @match child["type"][0].as_str().unwrap() {
                            "h-entry" => { @Entry { post: child } }
                            "h-feed" => { @Feed { feed: child } }
                            "h-event" => {
                                @{error!("Templating error: h-events aren't implemented yet");}
                            }
                            "h-card" => { @VCard { card: child }}
                            something_else => {
                                @{error!("Templating error: found a {} object that couldn't be parsed", something_else);}
                            }
                        }
                    }
                }
                @if feed["children"].as_array().map(|a| a.len()).unwrap_or(0) == 0 {
                    p {
                        "Looks like you reached the end. Wanna jump back to the "
                        a[href=feed["properties"]["uid"][0].as_str().unwrap()] {
                            "beginning"
                        } "?"
                    }
                }
                @if feed["children"].as_array().map(|a| a.len()).unwrap_or(0) == super::POSTS_PER_PAGE {
                    a[rel="prev", href=feed["properties"]["uid"][0].as_str().unwrap().to_string()
                        + "?after=" + feed["children"][super::POSTS_PER_PAGE - 1]["properties"]["uid"][0].as_str().unwrap()] {
                        "Older posts"
                    }
                }
            }
        }
        MainPage<'a>(feed: &'a serde_json::Value, card: &'a serde_json::Value) {
            .sidebyside {
                @VCard { card }
                #dynamicstuff {
                    p { "This section will provide interesting statistics or tidbits about my life in this exact moment (with maybe a small delay)." }
                    p { "It will probably require JavaScript to self-update, but I promise to keep this widget lightweight and open-source!" }
                    p { small {
                        "JavaScript isn't a menace, stop fearing it or I will switch to WebAssembly "
                        "and knock your nico-nico-kneecaps so fast with its speed you won't even notice that... "
                        small { "omae ha mou shindeiru" }
                        // NANI?!!!
                    } }
                }
            }
            @Feed { feed }
        }
        ErrorPage(code: StatusCode) {
            h1 { @format!("HTTP {} {}", code, code.canonical_reason()) }
            @match code {
                StatusCode::Unauthorized => {
                    p { "Looks like you need to authenticate yourself before seeing this page. Try logging in with IndieAuth using the Login button above!" }
                }
                StatusCode::Forbidden => {
                    p { "Looks like you're forbidden from viewing this page." }
                    p {
                        "This might've been caused by being banned from viewing my website"
                        "or simply by trying to see what you're not supposed to see, "
                        "like a private post that's not intended for you. It's ok, it happens."
                    }
                }
                StatusCode::Gone => {
                    p { "Looks like the page you're trying to find is gone and is never coming back." }
                }
                StatusCode::UnavailableForLegalReasons => {
                p { "The page is there, but I can't legally provide it to you because the censorship said so." }
                }
                StatusCode::NotFound => {
                    p { "Looks like there's no such page. Maybe you or someone else mistyped a URL or my database experienced data loss." }
                }
                StatusCode::ImATeapot => {
                    p { "Wait, do you seriously expect my website to brew you coffee? It's not a coffee machine!" }

                    p {
                        small { "I could brew you some coffee tho if we meet one day... "
                        small { i { "i-it's nothing personal, I just like brewing coffee, b-baka!!!~ >.<!" } } }
                    }
                }
                _ => { p { "It seems like you have found an error. Not to worry, it has already been logged." } }
            }
            P { "For now, may I suggest to visit " a[href="/"] {"the main page"} " of this website?" }

        }
    }
}

use templates::{ErrorPage, MainPage, OnboardingPage, Template};

#[derive(Clone, Serialize, Deserialize)]
pub struct IndiewebEndpoints {
    authorization_endpoint: String,
    token_endpoint: String,
    webmention: Option<String>,
    microsub: Option<String>,
}

#[derive(Deserialize)]
struct QueryParams {
    after: Option<String>,
}

#[derive(Debug)]
struct FrontendError {
    msg: String,
    source: Option<Box<dyn std::error::Error + Send + Sync + 'static>>,
    code: StatusCode,
}
impl FrontendError {
    pub fn with_code(code: StatusCode, msg: &str) -> Self {
        Self {
            msg: msg.to_string(),
            source: None,
            code,
        }
    }
    pub fn msg(&self) -> &str {
        &self.msg
    }
    pub fn code(&self) -> StatusCode {
        self.code
    }
}
impl From<crate::database::StorageError> for FrontendError {
    fn from(err: crate::database::StorageError) -> Self {
        Self {
            msg: "Database error".to_string(),
            source: Some(Box::new(err)),
            code: StatusCode::InternalServerError,
        }
    }
}
impl std::error::Error for FrontendError {
    fn source(&self) -> Option<&(dyn std::error::Error + 'static)> {
        self.source
            .as_ref()
            .map(|e| e.as_ref() as &(dyn std::error::Error + 'static))
    }
}
impl std::fmt::Display for FrontendError {
    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
        write!(f, "{}", self.msg)
    }
}

async fn get_post_from_database<S: Storage>(
    db: &S,
    url: &str,
    after: Option<String>,
    user: &Option<String>,
) -> std::result::Result<serde_json::Value, FrontendError> {
    match db
        .read_feed_with_limit(url, &after, POSTS_PER_PAGE, user)
        .await
    {
        Ok(result) => match result {
            Some(post) => Ok(post),
            None => Err(FrontendError::with_code(
                StatusCode::NotFound,
                "Post not found in the database",
            )),
        },
        Err(err) => match err.kind() {
            crate::database::ErrorKind::PermissionDenied => {
                // TODO: Authentication
                if user.is_some() {
                    Err(FrontendError::with_code(
                        StatusCode::Forbidden,
                        "User authenticated AND forbidden to access this resource",
                    ))
                } else {
                    Err(FrontendError::with_code(
                        StatusCode::Unauthorized,
                        "User needs to authenticate themselves",
                    ))
                }
            }
            _ => Err(err.into()),
        },
    }
}

#[derive(Deserialize)]
struct OnboardingFeed {
    slug: String,
    name: String,
}

#[derive(Deserialize)]
struct OnboardingData {
    user: serde_json::Value,
    first_post: serde_json::Value,
    blog_name: String,
    feeds: Vec<OnboardingFeed>,
}

pub async fn onboarding_receiver<S: Storage>(mut req: Request<ApplicationState<S>>) -> Result {
    use serde_json::json;

    let body = req.body_json::<OnboardingData>().await?;
    let backend = &req.state().storage;
    #[cfg(any(not(debug_assertions), test))]
    let me = req.url();
    #[cfg(all(debug_assertions, not(test)))]
    let me = url::Url::parse("http://localhost:8080/").unwrap();

    if get_post_from_database(backend, me.as_str(), None, &None).await.is_ok() {
        return Err(FrontendError::with_code(
            StatusCode::Forbidden,
            "Onboarding is over. Are you trying to take over somebody's website?!",
        ).into())
    }
    info!("Onboarding new user: {}", me);

    let user = crate::indieauth::User::new(me.as_str(), "https://kittybox.fireburn.ru/", "create");

    backend
        .set_setting("site_name", user.me.as_str(), &body.blog_name)
        .await?;

    if body.user["type"][0] != "h-card" || body.first_post["type"][0] != "h-entry" {
        return Err(FrontendError::with_code(
            StatusCode::BadRequest,
            "user and first_post should be h-card and h-entry",
        ).into())
    }
    info!("Validated body.user and body.first_post as microformats2");

    let mut hcard = body.user;
    let hentry = body.first_post;

    // Ensure the h-card's UID is set to the main page, so it will be fetchable.
    hcard["properties"]["uid"] = json!([me.as_str()]);
    // Normalize the h-card - note that it should preserve the UID we set here.
    let (_, hcard) = crate::micropub::normalize_mf2(hcard, &user);
    // The h-card is written directly - all the stuff in the Micropub's
    // post function is just to ensure that the posts will be syndicated
    // and inserted into proper feeds. Here, we don't have a need for this,
    // since the h-card is DIRECTLY accessible via its own URL.
    backend.put_post(&hcard).await?;

    for feed in body.feeds {
        let (_, feed) = crate::micropub::normalize_mf2(
            json!({
                "type": ["h-feed"],
                "properties": {"name": [feed.name], "mp-slug": [feed.slug]}
            }),
            &user,
        );

        backend.put_post(&feed).await?;
    }

    // This basically puts the h-entry post through the normal creation process.
    // We need to insert it into feeds and optionally send a notification to everywhere.
    req.set_ext(user);
    crate::micropub::post::new_post(req, hentry).await?;

    return Ok(Response::builder(201).header("Location", "/").build());
}

pub async fn coffee<S: Storage>(_: Request<ApplicationState<S>>) -> Result {
    Err(FrontendError::with_code(
        StatusCode::ImATeapot,
        "Someone asked this website to brew them some coffee...",
    ).into())
}

pub async fn mainpage<S: Storage>(req: Request<ApplicationState<S>>) -> Result {
    let backend = &req.state().storage;
    let query = req.query::<QueryParams>()?;
    let authorization_endpoint = req.state().authorization_endpoint.to_string();
    let token_endpoint = req.state().token_endpoint.to_string();
    let user: Option<String> = None;

    #[cfg(any(not(debug_assertions), test))]
    let url = req.url();
    #[cfg(all(debug_assertions, not(test)))]
    let url = url::Url::parse("http://localhost:8080/").unwrap();

    info!("Request at {}", url);
    let hcard_url = url.as_str();
    let feed_url = url.join("feeds/main").unwrap().to_string();

    let card = get_post_from_database(backend, hcard_url, None, &user).await;
    let feed = get_post_from_database(backend, &feed_url, query.after, &user).await;

    if card.is_err() && feed.is_err() {
        // Uh-oh! No main feed and no h-card? Need to do onboarding.
        // We can do it from inside the app without ever requesting an auth token.
        let card_err = card.unwrap_err();
        let feed_err = feed.unwrap_err();
        if card_err.code == 404 {
            // Yes, we definitely need some onboarding here.
            Ok(Response::builder(200)
                .content_type("text/html; charset=utf-8")
                .body(
                    Template {
                        title: "Kittybox - Onboarding",
                        blog_name: "Kitty Box!",
                        endpoints: IndiewebEndpoints {
                            authorization_endpoint,
                            token_endpoint,
                            webmention: None,
                            microsub: None,
                        },
                        content: OnboardingPage {}.to_string(),
                    }
                    .to_string(),
                )
                .build())
        } else {
            return Err(feed_err.into())
        }
    } else {
        Ok(Response::builder(200)
            .content_type("text/html; charset=utf-8")
            .body(
                Template {
                    title: &format!("{} - Main page", url.host().unwrap().to_string()),
                    blog_name: &backend
                        .get_setting("site_name", &url.host().unwrap().to_string())
                        .await
                        .unwrap_or_else(|_| "Kitty Box!".to_string()),
                    endpoints: IndiewebEndpoints {
                        authorization_endpoint,
                        token_endpoint,
                        webmention: None,
                        microsub: None,
                    },
                    content: MainPage {
                        feed: &feed?,
                        card: &card?,
                    }
                    .to_string(),
                }
                .to_string(),
            )
            .build())
    }
}

pub async fn render_post<S: Storage>(req: Request<ApplicationState<S>>) -> Result {
    let query = req.query::<QueryParams>()?;
    let authorization_endpoint = req.state().authorization_endpoint.to_string();
    let token_endpoint = req.state().token_endpoint.to_string();
    let user: Option<String> = None;

    #[cfg(any(not(debug_assertions), test))]
    let url = req.url();
    #[cfg(all(debug_assertions, not(test)))]
    let url = url::Url::parse("http://localhost:8080/")
        .unwrap()
        .join(req.url().path())
        .unwrap();

    let post =
        get_post_from_database(&req.state().storage, url.as_str(), query.after, &user).await?;

    let template: String = match post["type"][0]
        .as_str()
        .expect("Empty type array or invalid type")
    {
        "h-entry" => templates::Entry { post: &post }.to_string(),
        "h-card" => templates::VCard { card: &post }.to_string(),
        "h-feed" => templates::Feed { feed: &post }.to_string(),
        _ => return Err(FrontendError::with_code(
            StatusCode::InternalServerError,
            "Couldn't render an unknown type",
        ).into()),
    };

    Ok(Response::builder(200)
        .content_type("text/html; charset=utf-8")
        .body(
            Template {
                title: post["properties"]["name"][0]
                    .as_str()
                    .unwrap_or(&format!("Note at {}", url.host().unwrap().to_string())),
                blog_name: &req
                    .state()
                    .storage
                    .get_setting("site_name", &url.host().unwrap().to_string())
                    .await
                    .unwrap_or_else(|_| "Kitty Box!".to_string()),
                endpoints: IndiewebEndpoints {
                    authorization_endpoint,
                    token_endpoint,
                    webmention: None,
                    microsub: None,
                },
                content: template,
            }
            .to_string(),
        )
        .build())
}

pub struct ErrorHandlerMiddleware {}

#[async_trait::async_trait]
impl<S> tide::Middleware<ApplicationState<S>> for ErrorHandlerMiddleware
where
    S: crate::database::Storage,
{
    async fn handle(
        &self,
        request: Request<ApplicationState<S>>,
        next: Next<'_, ApplicationState<S>>,
    ) -> Result {
        let authorization_endpoint = request.state().authorization_endpoint.to_string();
        let token_endpoint = request.state().token_endpoint.to_string();
        let site_name = &request
            .state()
            .storage
            .get_setting("site_name", &request.url().host().unwrap().to_string())
            .await
            .unwrap_or_else(|_| "Kitty Box!".to_string());
        let mut res = next.run(request).await;
        let mut code: Option<StatusCode> = None;
        if let Some(err) = res.downcast_error::<FrontendError>() {
            code = Some(err.code());
            error!("Error caught while processing request: {}", err.msg());
            let mut err: &dyn std::error::Error = err;
            while let Some(e) = err.source() {
                error!("Caused by: {}", e);
                err = e;
            }
        }
        if let Some(code) = code {
            res.set_status(code);
            res.set_content_type("text/html; charset=utf-8");
            res.set_body(
                Template {
                    title: "Error",
                    blog_name: site_name,
                    endpoints: IndiewebEndpoints {
                        authorization_endpoint,
                        token_endpoint,
                        webmention: None,
                        microsub: None,
                    },
                    content: ErrorPage { code }.to_string(),
                }
                .to_string(),
            );
        }
        Ok(res)
    }
}

static STYLE_CSS: &[u8] = include_bytes!("./style.css");
static ONBOARDING_JS: &[u8] = include_bytes!("./onboarding.js");
static ONBOARDING_CSS: &[u8] = include_bytes!("./onboarding.css");

pub async fn handle_static<S: Storage>(req: Request<ApplicationState<S>>) -> Result {
    Ok(match req.param("path") {
        Ok("style.css") => Ok(Response::builder(200)
            .content_type("text/css; charset=utf-8")
            .body(STYLE_CSS)
            .build()),
        Ok("onboarding.js") => Ok(Response::builder(200)
            .content_type("text/javascript; charset=utf-8")
            .body(ONBOARDING_JS)
            .build()),
        Ok("onboarding.css") => Ok(Response::builder(200)
            .content_type("text/css; charset=utf-8")
            .body(ONBOARDING_CSS)
            .build()),
        Ok(_) => Err(FrontendError::with_code(
            StatusCode::NotFound,
            "Static file not found",
        )),
        Err(_) => panic!("Invalid usage of the frontend::handle_static() function"),
    }?)
}