Add in lecture time popover

This commit is contained in:
Joshua Coles 2023-10-06 20:49:53 +01:00
parent fda26e3b53
commit 41e3eebe52
4 changed files with 17 additions and 4 deletions

View File

@ -6,7 +6,7 @@ import { application } from "controllers/application"
import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"
eagerLoadControllersFrom("controllers", application)
import { Popover } from "tailwindcss-stimulus-components"
import Popover from 'stimulus-popover'
application.register('popover', Popover)
// Lazy load controllers as they appear in the DOM (remember not to preload controllers in import map!)

View File

@ -5,4 +5,9 @@ class Attendance < ApplicationRecord
:concurrent,
:catchup
]
def duration
toggl_data['time_entries'].sum { |entry| entry['seconds'] }
.seconds
end
end

View File

@ -58,8 +58,8 @@
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
</td>
<% else %>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500 flex justify-center">
<div>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500 flex justify-center" data-controller="popover">
<div data-action="mouseenter->popover#show mouseleave->popover#hide">
<% if lecture.attendance.nil? %>
<i class="fa fa-times text-red-700"></i>
<% elsif lecture.attendance.kind == 'concurrent' %>
@ -69,6 +69,14 @@
<% else %>
<% lecture.attendance.kind %>
<% end %>
<% if lecture.attendance.present? %>
<template data-popover-target="content">
<div class="content absolute max-w-xs bg-gray-300 rounded p-2" data-popover-target="card">
In lecture: <%= lecture.attendance.duration.in_minutes.round %> minutes
</div>
</template>
<% end %>
</div>
</td>

View File

@ -5,4 +5,4 @@ pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js", preload: true
pin_all_from "app/javascript/controllers", under: "controllers"
pin "tailwindcss-stimulus-components", to: "https://ga.jspm.io/npm:tailwindcss-stimulus-components@4.0.4/dist/tailwindcss-stimulus-components.module.js"
pin "stimulus-popover", to: "https://ga.jspm.io/npm:stimulus-popover@6.2.0/dist/stimulus-popover.mjs"