Skip to content

Commit

Permalink
Merge pull request #1522 from clpetersonucf/issue/1505-enhanced-help-…
Browse files Browse the repository at this point in the history 
…section

Enhanced help section
  • Loading branch information
@clpetersonucf
clpetersonucf authored Oct 17, 2023
2 parents 44152c3 + 33a8535 commit d26c8fb
Show file tree
Hide file tree
Showing 6 changed files with 423 additions and 178 deletions.
93 changes: 93 additions & 0 deletions src/components/help-for-instructors.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
import React from 'react';

const HelpForInstructors = () => {

return (
<>
<section className='full-width'>
<h2>For Instructors</h2>
<p>Check out the <a href="https://cdl.ucf.edu/support/materia/materia-quick-start-guide/" className="external">Materia Quickstart Guide</a> for a brief introduction to creating a new widget.</p>
</section>
<section className='full-width'>
<h2>Common Questions &amp; Issues</h2>
<h3>General</h3>
<dl>
<dt>Is Materia part of the LMS?</dt>
<dd>
<p>No. Materia is a platform that operates independently to the LMS, but integrates with it through a protocol called LTI.
You can authenticate to Materia through LTI, or directly by visiting the Login button.</p>
</dd>
<dt>Are there login credentials specific to Materia?</dt>
<dd>
<p>That depends on how your institution has configured Materia. If you visit Materia through your LMS, authentication is handled for you. If you login directly to Materia,
you may need credentials specifically set up for Materia. If logging in transitions you to a an external login, use the credentials associated with that external login instead.</p>
</dd>
<dt>I'm an instructor, why does Materia think I'm suddenly a student?</dt>
<dd>
<p>Materia defers to your LMS when receiving login information that may include your role in the course you last accessed Materia from. Depending on your course role,
your role in Materia may update to match. For example, if you are instructor in Course A but a student in Course B, Materia will flag you as a student if you visit
Materia content embedded in Course B. Visiting Materia content in Course A will once again grant you the author role.</p>
</dd>
<dt>Can my students author widgets?</dt>
<dd>
<p>Yes they can, but student-authored widgets have several limitations. Primarily, the widget is forced into Guest Mode, which removes the login requirement, but all scores
recorded by Guest Mode widgets are anonymous. Student-authored widgets cannot be embedded in your LMS, and if a student grants you access, you cannot disable Guest Mode.
Students can freely share their widgets with other users using the Play URL or Embed Code.</p>
</dd>
</dl>
<h3>Scores & Grades</h3>
<dl>
<dt>Does Materia save student grades?</dt>
<dd>
<p>Materia does not save grade information, but it does save student performance data. Student scores are stored and can be reviewed any time by
visiting the Student Activity section of a widget in My Widgets. When embedded in your LMS, Materia sends a score percentage to the LMS that's
then applied as a point value or grade by the LMS itself for an assignment.</p>
</dd>
<dt>How does scoring work?</dt>
<dd>
<p>By default, a student must authenticate to Materia - either automatically, when accessed through the LMS, or directly, by clicking the Login button -
so the system knows who they are and who to associate a score with. All score data for a widget is accessible under the Student Activity section in My Widgets.
Additionally, student performance data can be exported at any time by clicking the Export Options button in My Widgets.</p>
</dd>
<dt>My widget is embedded in the LMS but the gradebook did not update! What happened?</dt>
<dd>
<p>This can happen for multiple reasons. First, ensure the widget is properly embedded in your LMS by reviewing <a href='https://ucfopen.github.io/Materia-Docs/create/embedding-in-canvas.html' target='_blank'>our documentation for embedding widgets in Canvas. </a>
Next, verify the score the student recieved by reviewing the widget's Student Activity section in Materia under My Widgets. If a score is present in Materia but not synced with the gradebook, contact Support. Often the "handshake" between Materia and the LMS can
fail or be invalidated for several reasons that are not nefarious.</p>
</dd>
</dl>
<h3>Widget Ownership</h3>
<dl>
<dt>Can I give other instructors access to a widget?</dt>
<dd>
<p>Yes. Select <span className='bold'>Collaborate</span> in My Widgets to share widgets with other users. You can search for any other Materia user in the search field,
provided they've interacted with Materia at least once in the past. You can grant other users one of two access levels: <span className='bold'>Full</span>, which
effectively makes a user a co-owner, or <span className='bold'>View Scores</span>, which allows a user to share and read score information related to a widget but they cannot edit it.</p>
</dd>
<dt>Can I make students co-owners of a widget?</dt>
<dd>
<p>You cannot share widgets with students unless they have been set to <span className='bold'>Guest Mode</span>, under a widget's access settings. As a general rule, Materia will not
allow students ownership access to widgets unless the scores associated with the widgets are anonymized. Conversely, widgets authored by students are forced into Guest Mode, and changing a student widget
you co-own to Normal Access will remove the student as an owner.</p>
</dd>
<dt>I see a widget embedded in my course in the LMS, but I don't own it. What do I do?</dt>
<dd>
<p>Don't panic! Even if you don't own the widget, it will continue to function normally, and sync scores with the gradebook if configured to do so. If you're an author of the course,
you will be provided with a list of owners of the widget, and can select <span className='bold'>Request Access</span> from any owner. The owner will receive a notification in Materia
and be provided with an option to add you as a collaborator. Note that this does not guarantee you will receive access! In cases where the original owner is no longer associated with your institution, feel free to
contact Support.</p>
</dd>
</dl>
<h3>Miscellaneous</h3>
<dl>
<dt>How do I activate Beard Mode?</dt>
<dd>
<p>What? We don't know what you're talking about.</p>
</dd>
</dl>
</section>
</>
)
}

export default HelpForInstructors
65 changes: 65 additions & 0 deletions src/components/help-for-students.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
import React from 'react';

const HelpForStudents = () => {

return (
<>
<section className='half-width'>
<h2>For Students</h2>
<p>
Materia is an open-source educational platform hosted alongside your LMS to enhance course content with interactive tools
called <span className='italic'>widgets. </span> If you run into a problem playing a widget or receiving a score, we're here to help.
</p>
</section>
<section className="half-width">
<h2 id="support">Get Support</h2>
<p>If you need help beyond what has been provided here, please contact support using one of the following:</p>
<dl>
<dt>Support</dt>
<dd><a href="http://website/support">http://website/support/</a></dd>
<dt>Email</dt>
<dd><a href="mailto:support@website">support@website</a></dd>
<dt>Phone</dt>
<dd>PHONE NUMBER HERE</dd>
</dl>
</section>
<section className='full-width'>
<h2>Common Questions &amp; Issues</h2>
<dl>
<dt>I'm not seeing a widget, only an error message. What do I do?</dt>
<dd>
<p>For one reason or a another Materia encountered a server issue or an issue authenticating you. Contact support using the info above.</p>
</dd>
<dt>I completed a widget, but my grade didn't update. What happened?</dt>
<dd>
<p>Widgets should automatically update the gradebook with your score when embedded correctly in an assignment. If a widget is embedded as a module item or directly in a regular course page,
the gradebook sync will <span className='italic'>not</span> occur. Additionally, ensure you have advanced the widget all the way to the score screen,
which is when the play session is formally concluded. Leaving the play session early will prevent the play from being marked as complete.</p>
<p>If all items above check out, contact support. Support can verify the score and ensure your grade is properly updated.</p>
</dd>
<dt>How many times can I play a widget?</dt>
<dd>
<p>By default, widgets can be played as many times as you want. When embedded as assignments, your highest score is the one synced with the gradebook. If your instructor has set an attempt limit,
the additional attempt count will be displayed on the score screen alongside the Play Again button.</p>
</dd>
<dt>Can I see scores from widgets I've previously played in Materia?</dt>
<dd>
<p>You can! Log in to Materia directly, if you're not already authenticated. Then, visit your profile by clicking your name at the top right, or the
My Profile link the header. Your profile page will list your complete play history for every widget you've previously interacted with.</p>
</dd>
<dt>Can I make my own widget?</dt>
<dd>
<p>Students can make widgets, but there's one important limitation: the widget will be set to Guest Mode, which means it won't know who is playing it, and consequently, score
data will be anonymous.</p>
</dd>
<dt>What's the answer to life, the universe, and everything?</dt>
<dd>
<p>That's a really big question, but we're pretty sure the answer is 42.</p>
</dd>
</dl>
</section>
</>
)
}

export default HelpForStudents
52 changes: 52 additions & 0 deletions src/components/help-home.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import React from 'react';

const HelpHome = () => {

return (
<>
<section className="full-width">
<h2 id="faq-link">Getting Started</h2>
<p>Having issues with Materia or don't know where to get started? We're here to help. For first-time users, get more information about Materia from the links below.</p>
<p><a href="https://ucfopen.github.io/Materia-Docs/play/getting-started.html">Player/Student Guide</a></p>
<p><a href="https://ucfopen.github.io/Materia-Docs/create/getting-started.html">Author/Instructor Guide</a></p>
</section>
<section className="full-width">
<h2 id="flash-required">Requirements</h2>
<p className="flash-version">Materia requires that you use an up-to-date browser with javascript and cookies enabled.</p>
</section>

<section className="half-width">
<h2 id="login-issues">Login Issues</h2>
<p>In many cases, problems logging in are a result of one of the following:</p>

<h3>Incorrect Password</h3>
<p>You may need to reset your password.</p>

<h3>Expired Password</h3>
<p>You may need to reset your password.</p>

<h3>User Account Doesn't exist</h3>
<p>Your user account may not have been created yet.</p>
</section>

<section className="half-width">
<h2 id="support">Support</h2>
<p>If you need help beyond what has been provided here, please contact support using one of the following:</p>
<dl>
<dt>Support</dt>
<dd><a href="http://website/support">http://website/support/</a></dd>
<dt>Email</dt>
<dd><a href="mailto:support@website">support@website</a></dd>
<dt>Phone</dt>
<dd>PHONE NUMBER HERE</dd>
</dl>
</section>
<section className='full-width'>
<h2 id="faq-link">Documentation</h2>
<p><a href="https://ucfopen.github.io/Materia-Docs/">Our docs site</a> has extensive documentation for students, authors, support users, and developers.</p>
</section>
</>
)
}

export default HelpHome
89 changes: 45 additions & 44 deletions src/components/help-page.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,58 +1,59 @@
import React from 'react'
import React, { useState, useEffect } from 'react'
import Header from './header'

import HelpHome from './help-home'
import HelpForStudents from './help-for-students'
import HelpForInstructors from './help-for-instructors'

import './help-page.scss';

const HelpPage = () => {

const [page, setPage] = useState(window.location.hash.match(/#(home|students|instructors){1}$/)?.[1])

const listenToHashChange = () => {
const match = window.location.hash.match(/#(home|students|instructors){1}$/)
if (match != null && match[1] != null) setPage(match[1])
else setPage('home')
}

useEffect(() => {
window.addEventListener('hashchange', listenToHashChange)

return () => {
window.removeEventListener('hashchange', listenToHashChange)
}
}, [])

let helpContentRender = null
switch (page) {
case 'students':
helpContentRender = <HelpForStudents />
break
case 'instructors':
helpContentRender = <HelpForInstructors />
break
default:
helpContentRender = <HelpHome />
}

return (
<>
<Header />
<div className="container">
<section className="page">
<h1>Help &amp; Support</h1>
<section className="bordered">
<h2 id="getting-started-link">Getting Started</h2>
<p>Check out the <a href="https://cdl.ucf.edu/support/materia/materia-quick-start-guide/" className="external">Materia Quickstart Guide</a>.</p>
</section>

<section className="bordered">
<h2 id="flash-required">Requirements</h2>
<p className="flash-version">Materia requires that you use an up-to-date browser with javascript and cookies enabled.</p>
</section>

<section className="float left">
<h2 id="login-issues">Login Issues</h2>
<p>In many cases, problems logging in are a result of one of the following:</p>

<h3>Incorrect Password</h3>
<p>You may need to reset your password.</p>

<h3>Expired Password</h3>
<p>You may need to reset your password.</p>

<h3>User Account Doesn't exist</h3>
<p>Your user account may not have been created yet.</p>
</section>

<section className="float right bordered">
<h2 id="faq-link">Documentation</h2>
<p><a href="https://ucfopen.github.io/Materia-Docs/">View the docs</a> for guides on using Materia.</p>
<h3 id="faq-link">Getting Started</h3>
<p><a href="https://ucfopen.github.io/Materia-Docs/play/getting-started.html">Player/Student Guide</a></p>
<p><a href="https://ucfopen.github.io/Materia-Docs/create/getting-started.html">Author/Instructor Guide</a></p>
</section>

<section className="float right">
<h2 id="support">Support</h2>
<p>If you need help beyond what has been provided here, please contact support using one of the following:</p>
<dl>
<dt>Support</dt>
<dd><a href="http://website/support">http://website/support/</a></dd>
<dt>Email</dt>
<dd><a href="mailto:support@website">support@website</a></dd>
<dt>Phone</dt>
<dd>PHONE NUMBER HERE</dd>
</dl>
<section className='content'>
<nav className='navigation'>
<ul>
<li><a href='#home'>Help Home</a></li>
<li><a href='#students'>For Students</a></li>
<li><a href='#instructors'>For Instructors</a></li>
</ul>
</nav>
<main>
{helpContentRender}
</main>
</section>
</section>
</div>
Expand Down
Loading

0 comments on commit d26c8fb

Please sign in to comment.