appdev-projects · Ritumka · Sep 11, 2024 · Sep 11, 2024 · Sep 11, 2024 · Sep 11, 2024
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -54,5 +54,8 @@
   },
   "files.associations": {
     "*.html.erb": "erb"
-  }
+  },
+  "githubPullRequests.ignoredPullRequestBranches": [
+    "main"
+  ]
 }
diff --git a/Gemfile b/Gemfile
@@ -5,6 +5,7 @@ ruby "3.2.1"
 
 gem "sinatra"
 gem "sinatra-contrib"
+gem "http"
 
 # Use Puma as the app server
 gem "puma", "~> 5.0"

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -15,6 +15,7 @@ GEM
       public_suffix (>= 2.0.2, < 6.0)
     appdev_support (0.2.1)
       tabulo
+    base64 (0.2.0)
     better_errors (2.9.1)
       coderay (>= 1.0.0)
       erubi (>= 1.0.0)
@@ -39,6 +40,7 @@ GEM
       rexml
     debug_inspector (1.1.0)
     diff-lcs (1.5.0)
+    domain_name (0.6.20240107)
     draft_matchers (0.0.2)
       capybara
       color_namer
@@ -50,6 +52,11 @@ GEM
     faraday-net_http (3.1.1)
       net-http
     faraday-retry (1.0.3)
+    ffi (1.17.0-x86_64-darwin)
+    ffi (1.17.0-x86_64-linux-gnu)
+    ffi-compiler (1.3.2)
+      ffi (>= 1.15.5)
+      rake
     grade_runner (0.0.12)
       activesupport (>= 2.3.5)
       faraday-retry (~> 1.0.3)
@@ -58,8 +65,20 @@ GEM
       rake (~> 13)
       zip
     hashdiff (1.0.1)
+    http (5.2.0)
+      addressable (~> 2.8)
+      base64 (~> 0.1)
+      http-cookie (~> 1.0)
+      http-form_data (~> 2.2)
+      llhttp-ffi (~> 0.5.0)
+    http-cookie (1.0.7)
+      domain_name (~> 0.5)
+    http-form_data (2.3.0)
     i18n (1.12.0)
       concurrent-ruby (~> 1.0)
+    llhttp-ffi (0.5.0)
+      ffi-compiler (~> 1.0)
+      rake (~> 13.0)
     logger (1.6.0)
     matrix (0.4.2)
     method_source (1.0.0)
@@ -169,6 +188,7 @@ DEPENDENCIES
   capybara
   draft_matchers
   grade_runner
+  http
   i18n
   pry
   puma (~> 5.0)

diff --git a/README.md b/README.md
@@ -1,18 +1,3 @@
-# sinatra-template
+# Random Chuck Norris jokes
 
-Use this repository to create new Sinatra apps. 
-
-Optionally, to use `ActiveRecord` for database operations, add to the `app.rb`:
-
-```ruby
-require "sinatra/activerecord"
-```
-
-And in the `config/environment.rb` file add this code block:
-
-```ruby
-configure do
-  # setup a database connection
-  set(:database, { adapter: "sqlite3", database: "db/development.sqlite3" })
-end
-```
+A simple web application that displays random Chuck Norris jokes.
diff --git a/app.rb b/app.rb
@@ -1,9 +1,14 @@
 require "sinatra"
-require "sinatra/reloader"
+require "http"
+require "json"
 
 get("/") do
-  "
-  <h1>Welcome to your Sinatra App!</h1>
-  <p>Define some routes in app.rb</p>
-  "
+  redirect("/joke")
+end
+
+get("/joke") do
+  raw_response = HTTP.get("https://api.chucknorris.io/jokes/random")
+  joke_data = JSON.parse(raw_response)
+  @joke = joke_data.fetch("value")
+  erb :joke
 end
diff --git a/render.yaml b/render.yaml
@@ -1,6 +1,6 @@
 services:
   - type: web
-    name: MYAPPNAME # the name of this service, eg hello-world
+    name: Chuck-Norris-Jokes # the name of this service, eg hello-world
     env: ruby # this app is written in ruby
     plan: free # make sure to set this to free or you'll get billed $$$
     buildCommand: "./bin/render-build.sh" # # we already created these two files for you

diff --git a/thumbnails/chuck.jpg b/thumbnails/chuck.jpg
diff --git a/views/joke.erb b/views/joke.erb
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Random Chuck Norris Joke</title>
+  <link rel="stylesheet" type="text/css" href="/styles.css">
+</head>
+<body>
+  <div class="banner">
+    <img id="chuck-norris-image" src="https://www.giantbomb.com/a/uploads/scale_medium/46/462814/3221502-8667199912-d2d02.jpg" alt="Chuck Norris" class="banner-image">
+  </div>
+
+  <div class="container">
+    <h1>Do you know that..</h1>
+    <p><%= @joke %></p>
+  </div>
+
+<div class="link">
+  <a href="/joke">Another joke!</a>
+</div>
+</body>
+</html>
diff --git a/views/layout.erb b/views/layout.erb
@@ -1,9 +1,80 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>Sinatra Template</title>
+    <title>Random Chuck Norris Joke</title>
     <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <meta name="author" content="Margarita Potylitsyna">
+    <link href="https://fonts.googleapis.com/css?family=Sintony|Source+Sans+Pro:900" rel="stylesheet">
+
+    <style>
+   body {
+    background-color: #001f3f;
+    background-image: url('https://www.transparenttextures.com/patterns/45-degree-fabric-light.png');
+    background-repeat: repeat;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    min-height: 100vh;
+    text-align: center;
+   }
+
+h1 {
+  font-family: 'Source Sans Pro', sans-serif;
+  color: white;
+  font-size: 2em;
+}
+
+p {
+  font-family: 'Sintony', sans-serif;
+  font-size: 1.1em;
+  color: white;
+  margin-top: 20px;
+  max-width: 600px;
+}
+
+.banner {
+   display: flex;
+   justify-content: center;
+}
+
+.banner-image {
+   width: 300px;
+   height: 300px;
+   object-fit: cover;
+   border-radius: 300px;
+   margin: 20px;
+}
+
+.container {
+  padding: 30px;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+.link {
+        background-color: white;
+        display: flex;
+        align-items: center;
+        padding: 30px;
+        -webkit-box-shadow: 6px 6px 0px 0px rgba(8,13,26,0.5);
+        -moz-box-shadow: 6px 6px 0px 0px rgba(8,13,26,0.5);
+        box-shadow: 6px 6px 0px 0px rgba(8,13,26,0.5);
+        margin: 20px;
+      }
+
+      .link a {
+        font-family: 'Sintony', sans-serif;
+        font-size: 1.2em;
+        color: black;
+        text-decoration: none;
+        text-align: center;
+        flex-grow: 1;
+
+      }
+
+    </style>
   </head>
 
   <body>