From d4dc6ab11f346e8dc4a6e4d95a9694341b9c9e19 Mon Sep 17 00:00:00 2001
From: Ananth Venkatesh <dev.quantum9innovation@gmail.com>
Date: Sun, 9 Feb 2025 00:41:36 -0500
Subject: [PATCH] feat: finish landing page

---
 src/Clipboard.elm |  4 ++++
 src/Main.elm      | 54 ++++++++++++++++++++++++++++++++++++++++++++++-
 src/index.html    | 11 +++++++++-
 3 files changed, 67 insertions(+), 2 deletions(-)
 create mode 100644 src/Clipboard.elm

diff --git a/src/Clipboard.elm b/src/Clipboard.elm
new file mode 100644
index 0000000..5097b8c
--- /dev/null
+++ b/src/Clipboard.elm
@@ -0,0 +1,4 @@
+port module Clipboard exposing (copyToClipboard)
+
+
+port copyToClipboard : String -> Cmd msg
diff --git a/src/Main.elm b/src/Main.elm
index 1625ef5..eb46284 100644
--- a/src/Main.elm
+++ b/src/Main.elm
@@ -5,11 +5,14 @@ import Array
 import Browser
 import Browser.Events as Events
 import Camera3d
+import Clipboard exposing (copyToClipboard)
 import Color
 import Direction3d
 import Element exposing (..)
 import Element.Background as Background
+import Element.Border as Border
 import Element.Font as Font
+import Element.Input exposing (button)
 import Html exposing (Html)
 import Http
 import Length
@@ -92,6 +95,7 @@ type Msg
     | GotMesh (Result Http.Error Object3d)
     | GotTexture (Result WebGL.Texture.Error (Material.Texture Color.Color))
     | Rotate Time.Posix
+    | Copy String
 
 
 update : Msg -> Model -> ( Model, Cmd Msg )
@@ -132,6 +136,9 @@ update msg model =
         Rotate time ->
             wrap { model | angle = model.angle + 2 * (2 + sin (toFloat (Time.posixToMillis time) / 1000)) }
 
+        Copy text ->
+            ( model, copyToClipboard text )
+
 
 subscribe : Model -> Sub Msg
 subscribe _ =
@@ -156,6 +163,39 @@ vh model percent =
     Basics.toFloat model.h * percent / 100
 
 
+white : Color
+white =
+    rgb 255 255 255
+
+
+black : Color
+black =
+    rgb 0 0 0
+
+
+btnStyle : List (Attribute msg)
+btnStyle =
+    [ padding 10
+    , Font.color (rgb255 255 255 255)
+    , Font.family [ Font.typeface "Rubik" ]
+    , Font.semiBold
+    , Font.size 20
+    , Border.width 2
+    , Border.color white
+    , mouseOver [ Background.color white, Font.color black ]
+    ]
+
+
+linkBtn : String -> String -> Element msg
+linkBtn disp addr =
+    newTabLink btnStyle { url = addr, label = text (String.toUpper disp) }
+
+
+btn : String -> Msg -> Element Msg
+btn disp act =
+    button btnStyle { onPress = Just act, label = text (String.toUpper disp) }
+
+
 view : Model -> Browser.Document Msg
 view model =
     { title = "MacGregor House"
@@ -199,7 +239,19 @@ view model =
                     , Font.family [ Font.typeface "Imbue" ]
                     , Font.size 96
                     ]
-                    (text "MacGregor House")
+                    (column
+                        [ spacing 20
+                        ]
+                        [ text "MacGregor House"
+                        , row
+                            [ spacing 20
+                            ]
+                            [ linkBtn "Events" "https://calendar.google.com/calendar/embed?src=c_c9fb13003264d5becb74cf9ba42a087d8a4a180d927441994458a07ac146eb88%40group.calendar.google.com&ctz=America%2FNew_York"
+                            , linkBtn "Space" "https://forms.gle/KxFAG65TQuPxdYak8"
+                            , btn "iCal" (Copy "https://calendar.google.com/calendar/ical/c_c9fb13003264d5becb74cf9ba42a087d8a4a180d927441994458a07ac146eb88%40group.calendar.google.com/public/basic.ics")
+                            ]
+                        ]
+                    )
                 , el
                     [ alignRight
                     , alignTop
diff --git a/src/index.html b/src/index.html
index 86fe716..07b678a 100644
--- a/src/index.html
+++ b/src/index.html
@@ -6,7 +6,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Imbue:opsz,wght@10..100,100..900&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Imbue:opsz,wght@10..100,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"
       rel="stylesheet"
     />
   </head>
@@ -18,6 +18,15 @@
         node: document.getElementById("app"),
         flags: [window.innerWidth, window.innerHeight],
       });
+
+      app.ports.copyToClipboard.subscribe((text) => {
+        var textArea = document.createElement("textarea");
+        textArea.value = text;
+        document.body.appendChild(textArea);
+        textArea.select();
+        document.execCommand("copy");
+        document.body.removeChild(textArea);
+      });
     </script>
   </body>
 </html>