na

Gemfile.lock

@@ -88,7 +88,7 @@ GEM
       msgpack (~> 1.2)
     builder (3.3.0)
     concurrent-ruby (1.3.5)
-    connection_pool (2.5.2)
+    connection_pool (2.5.3)
     crass (1.0.6)
     css_parser (1.21.1)
       addressable

app/assets/stylesheets/application.css

@@ -76,12 +76,15 @@
   --clr-dark-yellow: #F0B902;
   --clr-medium-yellow: #FFDE52;
   --clr-light-yellow: #FFF3AE;
-  
+  --clr-text-highlight: #CCE8FE;
 
+  --clr-error: #0058a3;
+  
   --ff-ikea: "Noto IKEA", "Noto Sans", "Roboto", "Open Sans", system-ui, sans-serif;
   
   --shadow: 0px 0px 10px 2px rgba(0,0,0,0.1); 
 
+  --fs-s: 1.4rem;
   --fs-base: 1.6rem;
   --fs-lg: 1.8rem;
   --fs-xl: 2.8rem;
@@ -225,7 +228,8 @@ main {
   gap: 8px;
 }
 
-.intro-content-container {
+.intro-content-container, 
+.question-container {
   display: grid;
   grid-template-columns: 1;
   grid-template-rows: auto;
@@ -251,12 +255,99 @@ main {
   line-height: 1.4;  
 }
 
+.intro-content-container,
+.question-container {
+  & > :last-child {
+    margin-top: 4px; 
+  } 
+}
+
+.question-step {
+  font-size: var(--fs-s);
+  font-weight: 700;
+  line-height: 1;
+  display: flex;
+  & div {
+    background-color: var(--clr-medium-yellow);    
+    padding: 1rem 1.2rem;
+    border-radius: 400px;
+  }
+}
+
+.question-header {
+  background-color: var(--clr-medium-yellow);    
+  border-radius: 1.6rem;
+  font-size: var(--fs-xl);
+  line-height: 1.2;
+  font-weight: 700;
+  padding: 1.6rem 1.2rem;
+}
+
+.question-answer {
+  background-color: var(--clr-white);    
+  border-radius: 1.6rem;
+  font-size: var(--fs-lg);
+  line-height: 1.4;
+  padding: 1.6rem 1.2rem;
+
+  & em {
+    font-style: normal;
+    background-color: var(--clr-text-highlight);
+    padding: 1px 2px;
+    margin-right: -2px;
+  }
+
+  & input[type=radio] {
+    position: absolute;
+    opacity: 0;
+    cursor: pointer;
+    height: 0;
+    width: 0;
+  }
+
+  &:has(input[type=radio]:checked) {
+    outline: 4px solid var(--clr-text-highlight);
+    outline-offset: -4px;
+  }
+}
+
+.question-result {
+  background-color: var(--clr-medium-yellow);    
+  border-radius: 1.6rem;
+  font-size: var(--fs-base);
+  line-height: 1.4;
+  padding: 1.6rem 1.2rem;
 
-.intro-content-container > :last-child {
-  margin-top: 4px; 
+  & strong {
+    font-weight: 700;
+  }
 }
 
 
+
+label.question-answer {
+  display: flex;
+  align-items: start;
+  min-height: 4.2em;
+  & input {
+    flex-grow: 1;
+    border: none;
+    outline: none;
+    font-size: var(--fs-lg);
+    line-height: 1.4;
+    padding: 0; 
+  }
+
+  &:has(.field_with_errors) {
+    outline: 4px solid var(--clr-error);
+    outline-offset: -4px;
+  }
+
+}
+
+
+
+
 @media (min-width: 815px) {
   header {
     top: 2rem;

app/controllers/admin/attachments_controller.rb

@@ -22,7 +22,6 @@ private
 
   def set_attachable_for
     @attachable_for = Node.find(params[:node_id]) if params[:node_id]
-    @attachable_for = Newsletter.find(params[:newsletter_id]) if params[:newsletter_id]
   end
 
 

app/controllers/answers_controller.rb

@@ -0,0 +1,33 @@
+class AnswersController < ApplicationController
+
+  include QuizHelperMethods
+
+  # POST /q/:id/answer
+  def create
+    not_found unless question
+
+    @answer = Answer.new(answer_params.merge(player_id: current_player.id, node_id: question.id))
+
+    respond_to do |format|
+      if @answer.save
+        format.html { redirect_to url_for(controller: 'questions', action: 'answer', id: params[:id]) }
+      else
+        format.html { render 'questions/show', status: :unprocessable_entity }
+      end
+    end
+  end
+
+
+
+private
+
+  # Only allow a list of trusted parameters through.
+  def answer_params
+    params.require(:answer).permit(
+      :value
+    )
+  end
+
+
+
+end

app/controllers/application_controller.rb

@@ -4,6 +4,7 @@ class ApplicationController < ActionController::Base
 
 private
 
+
   def set_locale
     I18n.locale = params[:locale].presence_in(I18n.available_locales.map(&:to_s)) || I18n.default_locale
   end

app/controllers/concerns/quiz_helper_methods.rb

@@ -0,0 +1,60 @@
+module QuizHelperMethods
+  extend ActiveSupport::Concern
+
+  included do
+    before_action :require_player!
+    before_action :set_locale
+
+    helper_method :current_player,
+                  :questions,
+                  :question,
+                  :questions_size,
+                  :question_index
+
+  end
+
+
+private
+
+
+  def questions
+    @questions ||= Node.at_depth(1).viewable.ordered.to_a
+  end
+
+
+  def question
+    @question ||= questions[params[:id].to_i-1]
+  end
+
+
+  def questions_size
+    @questions_size ||= questions.size + 1
+  end
+
+
+  def question_index
+    @question_index ||= (params[:id].to_i + 1)
+  end
+
+
+  def require_player!
+    unless player_present?
+      redirect_to url_for(controller: 'players', action: 'new')
+    end
+  end
+
+
+  def current_player
+    Current.player ||= player_from_session
+  end
+
+
+  def player_from_session
+    Player.find_by(id: session[:player_id])
+  end
+
+
+  def player_present?
+    current_player.present?
+  end
+end

app/controllers/languages_controller.rb

@@ -1,18 +1,23 @@
 class LanguagesController < ApplicationController
 
-  before_action :set_locale_to_default
+  before_action :set_locale_to_default, only: :index
+  before_action :set_locale, only: :show
+
   helper_method :accept_language
 
   def index
+  end
 
 
+  def show
+    @accept_language = params[:locale]
+    render :index
   end
 
 
   def update
     set_locale
 
-    # Respond with Turbo Stream that updates the content div
     respond_to do |format|
       format.turbo_stream
     end

app/controllers/players_controller.rb

@@ -0,0 +1,42 @@
+class PlayersController < ApplicationController
+
+  include QuizHelperMethods
+
+  skip_before_action :require_player!
+
+  # GET /player
+  def new
+    reset_session
+    Current.player = nil
+
+    @player = Player.new
+  end
+
+
+  # POST /player
+  def create
+    @player = Player.new(player_params.merge(locale: I18n.locale))
+
+
+    respond_to do |format|
+      if @player.save
+        session[:player_id] = @player.id
+        format.html { redirect_to url_for(controller: 'questions', action: 'show', id: 1) }
+      else
+        format.html { render :new, status: :unprocessable_entity }
+      end
+    end
+  end
+
+
+private
+
+
+  # Only allow a list of trusted parameters through.
+  def player_params
+    params.require(:player).permit(
+      :name
+    )
+  end
+
+end

app/controllers/questions_controller.rb

@@ -0,0 +1,24 @@
+class QuestionsController < ApplicationController
+
+  include QuizHelperMethods
+
+
+  def show
+    not_found unless question
+
+    @answer = Answer.new(player_id: current_player.id, node_id: question.id)
+  end
+
+
+  def answer
+    @answer = Answer.find_by(node_id: question.id, player_id: current_player.id)
+    @question_answer = question.attachments.with_text.each_slice(2).to_a[@answer.value]
+  end
+
+
+
+
+
+
+
+end

app/controllers/site_controller.rb

@@ -2,6 +2,8 @@ class SiteController < ApplicationController
 
   before_action :set_locale
 
+
+
   def index
     @node = Node.roots.viewable.first
     not_found and return unless @node
@@ -27,6 +29,7 @@ class SiteController < ApplicationController
 
 private
 
+
   def url_from_param
     return '' unless params[:url]
 
@@ -34,4 +37,7 @@ private
     File.join('', I18n.locale.to_s, params[:url])
   end
 
+
+
+
 end

app/helpers/answers_helper.rb

@@ -0,0 +1,2 @@
+module AnswersHelper
+end

app/helpers/players_helper.rb

@@ -0,0 +1,2 @@
+module PlayersHelper
+end

app/helpers/questions_helper.rb

@@ -0,0 +1,2 @@
+module QuestionsHelper
+end

app/models/answer.rb

@@ -0,0 +1,9 @@
+class Answer < ApplicationRecord
+
+  belongs_to :player
+  belongs_to :node
+
+  validates :value, presence: true
+  validates :value, numericality: { only_integer: true, greater_than_or_equal_to: 0, less_than_or_equal_to: 1 }
+
+end

app/models/attachment.rb

@@ -18,6 +18,8 @@ class Attachment < ApplicationRecord
   scope :ordered, -> { order(position: :asc) }
   scope :favorites, -> { where(is_favorite: true) }
 
+  scope :with_text, -> { where(asset: nil) }
+
   scope :favorites_first, -> { reorder("(is_favorite = TRUE) DESC, position ASC") }
   scope :portraits_first, -> { reorder(Arel.sql("(props ->> 'is_portrait' = '1') DESC, position ASC")) }
 

app/models/current.rb

@@ -1,3 +1,3 @@
 class Current < ActiveSupport::CurrentAttributes
-  attribute :user
+  attribute :user, :player
 end

app/models/node.rb

@@ -8,6 +8,7 @@ class Node < ApplicationRecord
   include HasAttachments
   include HasTags
 
+  has_many :answers, dependent: :destroy
 
   extend Mobility
   translates :slug,

app/models/player.rb

@@ -0,0 +1,7 @@
+class Player < ApplicationRecord
+
+  validates_presence_of :name
+
+  has_many :answers, dependent: :destroy
+
+end

app/views/admin/attachments/new.turbo_stream.erb

@@ -1,9 +1,10 @@
 <turbo-stream action="append" targets="#attachments">
   <template>
+    <% time_stamp = (Time.now.to_f * 1000).to_i %>
     <% @attachments.each_with_index do |attachment, i| %>
-      <% tmp_id = Time.now.to_i + i %>
+      <% tmp_id = time_stamp + i %>
       <%= fields_for "#{@attachable_for.class.name.underscore.singularize}[attachments_attributes][#{ tmp_id }]", attachment do |builder| %>
-        <%= render partial: 'admin/attachments/attachment', locals: {f: builder, tmp_id: tmp_id}, formats: :html %>
+        <%= render partial: 'admin/attachments/attachment', locals: {f: builder, tmp_id: tmp_id}, formats: :html %>        
       <% end %>
     <% end %>    
   </template>

app/views/languages/_intro.html.erb

@@ -1,6 +1,7 @@
-<% Node.roots.first.attachments.limit(2).each_with_index do |attachment, i| %>
+<% Node.roots.viewable.first.attachments.limit(2).each_with_index do |attachment, i| %>
   <%= tag.div attachment.body.html_safe, class: i == 0 ? "intro-content-header" : "intro-content-body" %>
 <% end %>
 
-<%= link_to t('get_started'), Node.roots.first.children.first.url, class: 'button__base'  %>
+<%= link_to t('get_started'), url_for(controller: 'players', action: 'new', locale: I18n.locale), class: 'button__base'  %>
+
 

app/views/languages/index.html.erb

@@ -1,6 +1,6 @@
 <%- content_for :title, t('project_name') %>
 
-<%= turbo_frame_tag 'main' do %>
+
 <div class="intro-container">
   
   
@@ -30,4 +30,3 @@
   </div>
 
 </div>
-<% end %>

app/views/layouts/application.html.erb

@@ -4,9 +4,15 @@
     <title><%= content_for?(:title) ? yield(:title) : t(:project_name) %></title>
     
     <meta charset="utf-8">
+    
     <%= tag :meta, name: 'description', content: content_for?(:meta_description) ? yield(:meta_description) : (@node.present?? @node.page_description : '') %>
+    
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <meta name="theme-color" content="#F0B902">
+    
+    <meta name="turbo-prefetch" content="false">
+    <meta name="turbo-cache-control" content="no-cache">
+    
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>    
     

app/views/players/new.html.erb

@@ -0,0 +1,26 @@
+<%- 
+  content_for :title, t('what_is_your_name')  
+%>
+
+
+<%= form_with model: @player, url: url_for(controller: 'players', action: 'create') do |form| %>
+  
+  <div class="question-container">
+  
+    <div class="question-step">
+      <div>1/<%= questions_size %></div>
+    </div>
+
+    <div class="question-header">
+      <%= t 'what_is_your_name' %>
+    </div>
+    
+    <%= form.label :name, class: "question-answer" do %>    
+      <%= form.text_field :name, placeholder: t('what_is_your_name') %>
+    <% end %>
+    
+    <%= form.submit t('submit'), class: 'button__base'  %>
+  
+  </div>
+
+<% end %>

app/views/questions/answer.html.erb

@@ -0,0 +1,19 @@
+<%-   
+  content_for :title, question.page_title.blank? ? question.title : question.page_title
+  content_for :meta_description, question.page_description
+%>
+
+
+<div class="question-container">
+  
+  <div class="question-step">
+    <div><%= question_index %>/<%= questions_size %></div>
+  </div>
+
+  <div class="question-result">
+  <%= @question_answer.last.body.html_safe %>
+  </div>
+  
+  <%= link_to t('next_question'), url_for(controller: 'questions', action: 'show', id: question_index), class: 'button__base'  %>
+
+</div>

app/views/questions/show.html.erb

@@ -0,0 +1,31 @@
+<%-   
+  content_for :title, question.page_title.blank? ? question.title : question.page_title
+  content_for :meta_description, question.page_description
+%>
+
+<%= form_with model: @answer, url: url_for(controller: 'answers', action: 'create') do |form| %>
+  
+  <div class="question-container">
+  
+    <div class="question-step">
+      <div><%= question_index %>/<%= questions_size %></div>
+    </div>
+
+    <div class="question-header">
+      <%= question.title %>
+    </div>
+    
+    <% question.attachments.with_text.each_slice(2).each_with_index do |answer_option, i| %>
+    <div class="question-answer">
+      <%= form.label :value, for: nil do %>
+        <%= answer_option.first.body.html_safe %>
+        <%= form.radio_button :value, i %>        
+      <%- end -%>
+    </div>
+    <% end %>
+    
+    <%= form.submit t('submit'), class: 'button__base' %>
+  
+  </div>
+
+<% end %>

app/views/site/tmpl_article.html.erb

@@ -8,6 +8,4 @@
   content_for :meta_description, @node.page_description.blank? ? article_parts[:description] : @node.page_description
 %>
 
-<%= turbo_frame_tag 'main' do %>
-Hej
-<% end %>
+<%= session[:player_id] %>

config/locales/en.yml

@@ -3,17 +3,13 @@ en:
   project_name: IKEA Foundation Week 2025
   client_name: IKEA Foundation
 
-  can_you_spot_the_link: Can you spot <span>the link?</span>
-  hello: Hello!
-  please_select_a_language_to_get_started: Please select a language to get started.
-  confirm: Confirm
   get_started: Let’s go!
-  learn_more: Learn more  
-  spot_another_link: Spot another link  
-  challange_a_friend: Challenge a friend
-  drag_to_reveal: Slide to reveal
-  shuffle_cards: Shuffle cards
+  what_is_your_name: What's your name
+  please_type_your_name_here: Please type your name here…
+  submit: Submit
+  next_question: Next question
 
+  
   languages:
     en: English
     zh: 中文 
@@ -206,8 +202,8 @@ en:
       de: German
     templates: 
       tmpl_index: Get started
-      tmpl_list: Cards
-      tmpl_article: Link       
+      tmpl_list: Result
+      tmpl_article: Question       
     categories: 
       box: Box
       folder: Folder

config/routes.rb

@@ -51,8 +51,17 @@ Rails.application.routes.draw do
   end
 
   scope ':locale', constraints: { locale: /en|zh|hr|cs|da|nl|fi|fr|fr-CA|de|hu|it|ja|ko|nb|pl|pt|ro|sr|sk|sl|es|sv|uk/ } do
-    get '', to: 'site#index'
-    get '*url', to: 'site#page', constraints: lambda { |req| req.path.exclude?('storage') }
+
+    get 'player', to: 'players#new'
+    post 'player', to: 'players#create'
+
+    post 'q/:id/answer', to: 'answers#create'
+    get 'q/:id/answer', to: 'questions#answer'
+    get 'q/:id', to: 'questions#show'
+
+
+    get '', to: 'languages#show'
+    # get '*url', to: 'site#page', constraints: lambda { |req| req.path.exclude?('storage') }
   end
 
   put 'update_locale', to: 'languages#update'

db/migrate/20250429085114_create_players.rb

@@ -0,0 +1,11 @@
+class CreatePlayers < ActiveRecord::Migration[8.0]
+  def change
+    create_table :players do |t|
+
+      t.text :name
+      t.text :locale
+
+      t.timestamps
+    end
+  end
+end

db/migrate/20250429121602_create_answers.rb

@@ -0,0 +1,14 @@
+class CreateAnswers < ActiveRecord::Migration[8.0]
+  def change
+    create_table :answers do |t|
+
+      t.references :player
+      t.references :node
+      t.integer :value, default: nil, index: true
+
+      t.timestamps
+    end
+
+
+  end
+end

db/schema.rb

@@ -10,9 +10,9 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema[7.2].define(version: 2025_04_27_131737) do
+ActiveRecord::Schema[8.0].define(version: 2025_04_29_121602) do
   # These are extensions that must be enabled in order to support this database
-  enable_extension "plpgsql"
+  enable_extension "pg_catalog.plpgsql"
 
   # Custom types defined in this database.
   # Note that some types may not work with other database engines. Be careful if changing database.
@@ -46,6 +46,17 @@ ActiveRecord::Schema[7.2].define(version: 2025_04_27_131737) do
     t.index ["blob_id", "variation_digest"], name: "index_active_storage_variant_records_uniqueness", unique: true
   end
 
+  create_table "answers", force: :cascade do |t|
+    t.bigint "player_id"
+    t.bigint "node_id"
+    t.integer "value"
+    t.datetime "created_at", null: false
+    t.datetime "updated_at", null: false
+    t.index ["node_id"], name: "index_answers_on_node_id"
+    t.index ["player_id"], name: "index_answers_on_player_id"
+    t.index ["value"], name: "index_answers_on_value"
+  end
+
   create_table "assets", force: :cascade do |t|
     t.text "title"
     t.datetime "created_at", null: false
@@ -103,6 +114,13 @@ ActiveRecord::Schema[7.2].define(version: 2025_04_27_131737) do
     t.index ["url"], name: "index_nodes_on_url", using: :gin
   end
 
+  create_table "players", force: :cascade do |t|
+    t.text "name"
+    t.text "locale"
+    t.datetime "created_at", null: false
+    t.datetime "updated_at", null: false
+  end
+
   create_table "users", force: :cascade do |t|
     t.text "email"
     t.text "password_digest"

test/controllers/answers_controller_test.rb

@@ -0,0 +1,7 @@
+require "test_helper"
+
+class AnswersControllerTest < ActionDispatch::IntegrationTest
+  # test "the truth" do
+  #   assert true
+  # end
+end

test/controllers/players_controller_test.rb

@@ -0,0 +1,7 @@
+require "test_helper"
+
+class PlayersControllerTest < ActionDispatch::IntegrationTest
+  # test "the truth" do
+  #   assert true
+  # end
+end

test/controllers/questions_controller_test.rb

@@ -0,0 +1,7 @@
+require "test_helper"
+
+class QuestionsControllerTest < ActionDispatch::IntegrationTest
+  # test "the truth" do
+  #   assert true
+  # end
+end

test/fixtures/answers.yml

@@ -0,0 +1,11 @@
+# Read about fixtures at https://api.rubyonrails.org/classes/ActiveRecord/FixtureSet.html
+
+# This model initially had no columns defined. If you add columns to the
+# model remove the "{}" from the fixture names and add the columns immediately
+# below each fixture, per the syntax in the comments below
+#
+one: {}
+# column: value
+#
+two: {}
+# column: value

test/fixtures/players.yml

@@ -0,0 +1,11 @@
+# Read about fixtures at https://api.rubyonrails.org/classes/ActiveRecord/FixtureSet.html
+
+# This model initially had no columns defined. If you add columns to the
+# model remove the "{}" from the fixture names and add the columns immediately
+# below each fixture, per the syntax in the comments below
+#
+one: {}
+# column: value
+#
+two: {}
+# column: value

test/models/answer_test.rb

@@ -0,0 +1,7 @@
+require "test_helper"
+
+class AnswerTest < ActiveSupport::TestCase
+  # test "the truth" do
+  #   assert true
+  # end
+end

test/models/player_test.rb

@@ -0,0 +1,7 @@
+require "test_helper"
+
+class PlayerTest < ActiveSupport::TestCase
+  # test "the truth" do
+  #   assert true
+  # end
+end