1
Fork 0

Add documentation.

This commit is contained in:
Bauke 2023-07-02 12:04:29 +02:00
parent b130ec37a7
commit 2e0ea98225
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
5 changed files with 35 additions and 1 deletions

View File

@ -6,6 +6,7 @@ export * from "./introduction.js";
export * from "./shared/exports.js"; export * from "./shared/exports.js";
export * from "./types.js"; export * from "./types.js";
/** All tours available in a single array. */
export const allTours: TourData[] = [ export const allTours: TourData[] = [
introductionTour, introductionTour,
accountSettingsTour, accountSettingsTour,

View File

@ -1,5 +1,6 @@
import {type JSX} from "preact"; import {type JSX} from "preact";
/** Check if the user is logged in and return a warning element if they aren't. */
export function LoggedOutWarning(): JSX.Element { export function LoggedOutWarning(): JSX.Element {
const userIsLoggedIn = const userIsLoggedIn =
document.querySelector(".logged-in-user-username") !== null; document.querySelector(".logged-in-user-username") !== null;

View File

@ -1,6 +1,10 @@
import Shepherd from "shepherd.js"; import Shepherd from "shepherd.js";
import {renderInContainer} from "../utilities.js"; import {renderInContainer} from "../utilities.js";
/**
* Start an ad-hoc tour to display an error message.
* @param text The message to show.
*/
export function showTourError(text: string) { export function showTourError(text: string) {
const tour = new Shepherd.Tour({ const tour = new Shepherd.Tour({
defaultStepOptions: { defaultStepOptions: {

View File

@ -1,30 +1,58 @@
import type Shepherd from "shepherd.js"; import type Shepherd from "shepherd.js";
/** All available tour IDs. */
export enum TourId { export enum TourId {
InterfaceAccountSettings = "interface-account-settings", InterfaceAccountSettings = "interface-account-settings",
InterfaceHomepage = "interface-homepage", InterfaceHomepage = "interface-homepage",
Introduction = "introduction", Introduction = "introduction",
} }
/** Requirements of a tour to be checked before the tour is started. */
export type TourRequirement = { export type TourRequirement = {
/**
* This tour requires that the user must be logged in. Only set this to true
* if the tour goes to pages only accessible by logged in users.
*/
mustBeLoggedIn: boolean; mustBeLoggedIn: boolean;
/** The {@link URL.pathname} to run the tour at. */
path: string; path: string;
}; };
/** An individual tour step event handler. */
export type TourStepEvent = { export type TourStepEvent = {
/**
* - The "show" event will be called when the step is displayed.
* - The "destroy" event will be called when the step is finished.
*/
event: "show" | "destroy"; event: "show" | "destroy";
/** The handler for this step event. */
handler: Parameters<Shepherd.Step["on"]>[1]; handler: Parameters<Shepherd.Step["on"]>[1];
}; };
/** All the tour data collected in one place. */
export type TourData = { export type TourData = {
/** A short description of the tour for use in the options page. */
description: string; description: string;
/** Whether this tour should be shown in the options page. */
displayInOptionsPage: boolean; displayInOptionsPage: boolean;
/** All event handlers to be added to this tour's steps. */
eventHandlers: Array<{ eventHandlers: Array<{
eventHandlers: TourStepEvent[]; eventHandlers: TourStepEvent[];
stepId: string; stepId: string;
}>; }>;
/** The unique ID for this tour. */
id: TourId; id: TourId;
/** The requirements this tour must match before starting it. */
requirements: TourRequirement; requirements: TourRequirement;
/** All the steps this tour will take. */
steps: Shepherd.Step.StepOptions[]; steps: Shepherd.Step.StepOptions[];
/** The title of the tour for use in the options page. */
title: string; title: string;
}; };

View File

@ -5,7 +5,7 @@ import browser from "webextension-polyfill";
* Adds a `[data-tildes-shepherd-counter]` attribute to a specified element. For * Adds a `[data-tildes-shepherd-counter]` attribute to a specified element. For
* the associated CSS, see `source/content-scripts/scss/main.scss`. * the associated CSS, see `source/content-scripts/scss/main.scss`.
* *
* @param selector The selector of element to apply the counter to, if the * @param selector The selector of the element to apply the counter to, if the
* target element can't be selected an error will be thrown. * target element can't be selected an error will be thrown.
* @param count The number to display in the counter. * @param count The number to display in the counter.
*/ */