Skip to content

Commit

Permalink
Merge pull request #192 from ASSETS-Conference/dev
Browse files Browse the repository at this point in the history 
new header component & fixing alphabetical ordering
  • Loading branch information
@surajgoraya
surajgoraya authored Aug 23, 2024
2 parents ab079d8 + d333853 commit 78245c3
Show file tree
Hide file tree
Showing 3 changed files with 109 additions and 65 deletions.
27 changes: 27 additions & 0 deletions src/app/lib/components/lists/Letter.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import react from "react";
/**
* Displays a box with a letter in it, acts as a list heading for alphabetic lists.
* @param {object} props The props of the component
* @param {String} props.letter The letter of the alphabet you would like displayed as the header in the listing
* @param {HTMLElement?} props.className Standard Class property.
* @returns {import("react").ReactNode}
*/
export default function Letter({ letter, className }) {
return (
<>
<a
key={`letter-${letter}`}
className={`border-2 w-12 border-theme-dark text-theme-dark flex items-center px-2 pt-4 hover:text-white hover:bg-theme-dark transition-colors ${className}`}
href={letter ? "#beginning-with-" + letter .toLowerCase(): "#?"}
>
<h2 className={"text-xl font-light m-0"}>{letter ? letter : "?"}</h2>
</a>
{/* this is a way to push the scrollbar so it offsets the header */}
<div
aria-hidden
className="h-0 scroll-m-36"
id={letter ? "beginning-with-" + letter.toLowerCase() : "#?"}
></div>
</>
);
}
72 changes: 36 additions & 36 deletions src/app/lib/config/acceptedpapers.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,7 @@ export const ACCEPTED_PAPERS = [
authors: ["Rodolfo Cossovich", "Shanel Wu", "Audrey Girouard"],
},
{
title: "“I Try to Represent Myself as I Am”: Self-Presentation Preferences of People with Invisible Disabilities through Embodied Social VR Avatars",
title: "\"I Try to Represent Myself as I Am\": Self-Presentation Preferences of People with Invisible Disabilities through Embodied Social VR Avatars",
authors: [
"Ria J. Gualano",
"Lucy Jiang",
Expand Down Expand Up @@ -406,6 +406,18 @@ export const ACCEPTED_PAPERS = [
"Robin N. Brewer",
],
},
{
title: '"Not Only Annoying but Dangerous": devising an ecology of protections for photosensitive social media users',
authors: [
"Rua Mae Williams",
"Chorong Park",
"Laila Sameer Dodhy",
"Monaami Pal",
"Atharva Anand Dnyanmote",
"Angel Lam",
"Sean Joo",
],
},
{
title: "Our Stories, Our Data: Co-designing Visualizations with People with Intellectual and Developmental Disabilities",
authors: [
Expand Down Expand Up @@ -478,6 +490,10 @@ export const ACCEPTED_PAPERS = [
title: "SoundModVR: Sound Modifications in Virtual Reality to Support People who are Deaf and Hard of Hearing",
authors: ["Xinyun Cao", "Dhruv Jain"],
},
{
title: "The Promise and Pitfalls of Web Accessibility Overlays for Blind and Low Vision Users",
authors: ["Tlamelo Makati", "Garreth W. Tigwell", "Kristen Shinohara"],
},
{
title: "Towards Accessible Musical Performances in Virtual Reality: Designing a Conceptual Framework for Omnidirectional Audio Descriptions",
authors: ["Khang Dang", "Grace Burke", "Hamdi Korreshi", "Sooyeon Lee"],
Expand All @@ -503,10 +519,29 @@ export const ACCEPTED_PAPERS = [
title: "Uncovering the New Accessibility Crisis in Scholarly PDFs",
authors: ["Anukriti Kumar", "Lucy Lu Wang"],
},
{
title: "Understanding and Reducing the Challenges Faced by Creators of Accessible Online Data Visualizations",
authors: [
"Ather Sharif",
"Joo Gyeong Kim",
"Jessie Zijia Xu",
"Jacob O. Wobbrock",
],
},
{
title: "Understanding How Blind Users Handle Object Recognition Errors: Strategies and Challenges",
authors: ["Jonggi Hong", "Hernisa Kacorri"],
},
{
title: "Understanding Low Vision Graphical Perception of Bar Charts",
authors: [
"Yash Prakash",
"Akshay Kolgar Nayak",
"Sampath Jayarathna",
"Hae-Na Lee",
"Vikas Ashok",
],
},
{
title: "Vision-Based Assistive Technologies for People with Cerebral Visual Impairment: A Review and Focus Study",
authors: [
Expand All @@ -532,39 +567,4 @@ export const ACCEPTED_PAPERS = [
"Patrick Carrington",
],
},
{
title: '"Not Only Annoying but Dangerous": devising an ecology of protections for photosensitive social media users',
authors: [
"Rua Mae Williams",
"Chorong Park",
"Laila Sameer Dodhy",
"Monaami Pal",
"Atharva Anand Dnyanmote",
"Angel Lam",
"Sean Joo",
],
},
{
title: "The Promise and Pitfalls of Web Accessibility Overlays for Blind and Low Vision Users",
authors: ["Tlamelo Makati", "Garreth W. Tigwell", "Kristen Shinohara"],
},
{
title: "Understanding and Reducing the Challenges Faced by Creators of Accessible Online Data Visualizations",
authors: [
"Ather Sharif",
"Joo Gyeong Kim",
"Jessie Zijia Xu",
"Jacob O. Wobbrock",
],
},
{
title: "Understanding Low Vision Graphical Perception of Bar Charts",
authors: [
"Yash Prakash",
"Akshay Kolgar Nayak",
"Sampath Jayarathna",
"Hae-Na Lee",
"Vikas Ashok",
],
},
];
75 changes: 46 additions & 29 deletions src/app/program/accepted-papers/page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,42 +4,59 @@ import Subpage from "@/app/lib/components/templates/Subpage";
import Link from "@/app/lib/components/primitives/Link";
import { createMetadata } from "@/app/lib/utils/createMetadata";
import { ACCEPTED_PAPERS } from "@/app/lib/config/acceptedpapers.config";
import Letter from "@/app/lib/components/lists/Letter";

export const metadata = createMetadata({ title: "Accepted Papers" });
const excludeSpecialChars = new RegExp('[^"“]');

function AcceptedPaper({ title, authors }) {
return (
<div className="mb-8">
<p>
<strong>{title}</strong>
<br />
{authors.map((author, idx) => {
return idx < authors.length - 1 ? (
<span key={idx}>{`${author}, `}</span>
) : (
<span key={idx}>{`${author}`}</span>
);
})}
</p>
</div>
);
return (
<div className="mb-8">
<p>
<strong>{title}</strong>
<br />
{authors.map((author, idx) => {
return idx < authors.length - 1 ? (
<span key={idx}>{`${author}, `}</span>
) : (
<span key={idx}>{`${author}`}</span>
);
})}
</p>
</div>
);
}

export default function AcceptedPapers() {
return (
<Subpage title={"Accepted Papers"} noTOC={true}>
<Section title={"Accepted Papers"} spacing={"bottom-only"}>
<p className="mb-6">
{`We are pleased to share the titles and authors of accepted technical papers (in alphabetical order). More information regarding the program will be made available in September.`}
</p>
{displayList()}
</Section>
</Subpage>
);
}

function displayList() {
let letter;
let letterObj = undefined;
let letterChanged = false;
return ACCEPTED_PAPERS.map((paper, idx) => {
if (letter !== paper.title.match(excludeSpecialChars)[0]) {
letter = paper.title.match(excludeSpecialChars)[0];
letterObj = <Letter letter={letter} className={"mb-2"} />;
letterChanged = true;
} else {
letterChanged = false;
}
return (
<Subpage title={"Accepted Papers"} noTOC={true}>
<Section title={"Accepted Papers"} spacing={"bottom-only"}>
<p className="mb-6">
{`We are pleased to share the titles and authors of accepted technical papers (in alphabetical order). More information regarding the program will be made available in September.`}
</p>
{ACCEPTED_PAPERS.map((paper, idx) => (
<AcceptedPaper
key={idx}
title={paper.title}
authors={paper.authors}
/>
))}
</Section>
</Subpage>
<>
{letterObj && letterChanged ? letterObj : null}
<AcceptedPaper key={`paper-${idx}`} title={paper.title} authors={paper.authors} />
</>
);
});
}

0 comments on commit 78245c3

Please sign in to comment.