-
Notifications
You must be signed in to change notification settings - Fork 1
AppDotVueAndMockJS.md
JenDiamond edited this page Jul 12, 2024
·
1 revision
To get ucla-library-website-components working be. sure to add the App.vue & mock.js to the src file
like: src/App.vue & src/mock.js
We can continue to add to this file
<script setup>
import { computed, provide } from 'vue'
import RichText from '@/lib-components/RichText.vue'
import SimpleCards from '@/lib-components/SimpleCards.vue'
import ImpactNumbersCarousel from '@/lib-components/ImpactNumbersCarousel.vue'
import HelloWorld from '@/lib-components/HelloWorld.vue'
import * as API from '@/stories/mock-api.json'
import * as MOCK from '@/mock.js'
import DateFilter from './lib-components/DateFilter.vue'
// import SectionPagination from '@/lib-components/SectionPagination.vue'
// import CardWithImage from './lib-components/Flexible/CardWithImage.vue'
const mockdata = [
{
largeText: "10",
mediumText: "million",
smallDescriptor:
"dollars in funding allocated for the procurement of digital and print material",
image: [API.image],
altImageText: "Image for slide 1",
},
{
largeText: "3.5",
mediumText: "million",
smallDescriptor:
"dollars in funding allocated for the procurement of digital and print material",
image: [API.image],
altImageText: "Image for slide 2",
},
{
largeText: "5",
mediumText: "bajillion",
smallDescriptor: "SMdes 0",
image: [API.image],
altImageText: "Image for slide 3",
},
{
largeText: "25",
mediumText: "percent",
smallDescriptor: "SMdes 1",
image: [API.image],
altImageText: "Image for slide 4",
},
]
const mockDateFilterData = {
initialDates: { startDate: new Date('March 18, 2024'), endDate: new Date('March 19, 2024') },
// TODO check formatting, repeated dates as strings, correct?
eventDates: ['2/29/2024', '2/29/2024', '2/29/2024', '2/29/2024', '3/1/2024', '3/2/2024', '3/2/2024', '3/4/2024', '3/6/2024', '3/8/2024', '3/19/2024', '3/19/2024', '3/19/2024', '3/19/2024', '3/19/2024', '3/19/2024',],
}
const testKey = 'blockFormData'
const testValue = MOCK.blockForm
provide('eventId', '9383207')
provide(testKey, testValue)
provide('registrationType', 'both')
provide('libcalEndpoint', 'https://proxy.calendar.library.ucla.edu/')
provide('libcalWaitlist', '')
</script>
<template>
<div>
<HelloWorld msg="Vite + Vue" />
<br>
<hr>
<br>
</div>
<!-- SimpleCards -->
<div>
<h2>SIMPLY-SimpleCards Component</h2>
<br>
<SimpleCards
:items="MOCK.twoCards.cards"
:section-title="MOCK.mockdata.sectionTitle"
:section-summary="MOCK.mockdata.sectionSummary"
/>
<br>
<hr>
<br>
</div>
<!-- ImpactNumbersCarousel -->
<div>
<h2>Impact Numbers Carousel</h2>
<br>
<h3>Impact Numbers Carousel</h3>
<ImpactNumbersCarousel :blocks="mockdata" />
<br>
<hr>
<br>
</div>
<!-- DateFilter -->
<div>
<h2>Date Filter</h2>
<br>
<h3>Date Filter</h3>
<!-- for testing :hideInput="true" -->
<DateFilter
:eventDates="mockDateFilterData.eventDates"
:initialDates="mockDateFilterData.initialDates"
/>
<!-- <CardWithImage :block="MOCK.flexibleCardWithImage" /> -->
<br>
<hr>
<br>
</div>
<!-- Section Pagination -->
<div>
<h2>Section Pagination</h2>
<br>
<!-- <SectionPagination nextTo="hey" previousTo="ho" /> -->
<br>
<hr>
<br>
</div>
<!-- Flexible SimpleCards -->
<div>
<h2>FLEXY-Flexible SimpleCards Component</h2>
<br>
<h3>{{ MOCK.flexSimpleCards }}</h3>
<!-- <FlexibleSimpleCards :block="MOCK.flexSimpleCards" /> -->
<br>
<hr>
<br>
</div>
<!-- SiteBrandBar -->
<div>
<h2>SiteBrandBar Component</h2>
<br>
<SiteBrandBar />
<br>
<hr>
<br>
</div>
<!-- FlexibleImpactNumberCard -->
<div>
<h2>FlexibleImpactNumberCard</h2>
<flexible-impact-number-cards :block="MOCK.flexImpactNumberCardsMock" />
<hr>
<br>
</div>
<!-- Divider -->
<div>
<h2>Divider Component</h2>
<DividerGeneral />
<hr>
<br>
</div>
<!-- DividerWayFinder -->
<div>
<h2>DividerWayFinder Component</h2>
<DividerWayFinder color="help" />
<hr>
<br>
</div>
<!-- RichText -->
<!-- <div>
<h2>RichText Component</h2>
<RichText :rich-text-content="MOCK.richText" />
<br>
<hr>
<br>
</div> -->
<!-- SiteNotificationAlert -->
<!-- <div>
<h2>SiteNotificationAlert Component</h2>
<br>
<SiteNotificationAlert :title="MOCK.mockdata.title" :text="MOCK.mockdata.text" />
<SiteNotificationAlert :title="MOCK.mockdata.title" :text="MOCK.mockdata.textLong" />
<br>
<hr>
<br>
</div> -->
<!-- ButtonLink -->
<div>
<h2>ButtonLink Component</h2>
<br>
<ButtonLink
label="Internal Lib Path"
to="/help/more"
/>
<br>
<br>
<ButtonLink
label="Internal-Secondary"
:is-secondary="true"
to="/help/more"
/>
<br>
<br>
<ButtonLink
label="UCLA Link-Secondary"
:is-secondary="true"
to="https://calendar.library.ucla.edu/"
/>
<br>
<br>
<ButtonLink
label="External-No icon attr"
:is-secondary="true"
to="https://www.google.com/"
/>
<br>
<br>
<ButtonLink
label="Internal-Icon Right"
icon-name="svg-arrow-right"
to="/help/more"
/>
<br>
<br>
<ButtonLink
label="Internal-Secondary-Icon Right"
:is-secondary="true"
icon-name="svg-arrow-right"
to="/help/more"
/>
<br>
<br>
<ButtonLink
label="External-Secondary-Icon"
:is-secondary="true"
icon-name="svg-external-link"
to="www.google.com"
/>
<br>
<br>
<ButtonLink
label="External-Secondary-IconNameNone"
:is-secondary="true"
icon-name="none"
to="www.google.com"
/>
<br>
<br>
<ButtonLink
label="External-Secondary-IconNameEmptyString"
:is-secondary="true"
icon-name=""
to="www.google.com"
/>
<br>
<br>
<ButtonLink
label="External-Secondary-NoIcon"
:is-secondary="true"
to="www.google.com"
/>
<br>
<br>
<hr>
<br>
</div>
<!-- Button -->
<div>
<h2>Button Component</h2>
<br>
<ButtonHide />
<br>
<ButtonShow />
<br>
<ButtonMore />
<br>
<hr>
<br>
</div>
<!-- HeadingArrow -->
<div>
<h2>HeadingArrow Component</h2>
<br>
<HeadingArrow text="Default" />
<br>
<HeadingArrow
text="About Us"
to="/about/"
/>
<br>
<HeadingArrow
text="Visit Us"
to="/visit/"
/>
<br>
<HeadingArrow
text="Get Help"
to="/help/"
/>
<br>
<hr>
<br>
</div>
<!-- PullQuote -->
<div>
<h2>PullQuote Component</h2>
<br>
<PullQuote :text="MOCK.mockdata.text" />
<br>
<PullQuote
:text="MOCK.mockdata.text"
:attribution="MOCK.mockdata.attribution"
/>
<br>
<hr>
<br>
</div>
<!-- BlockDate -->
<div>
<h2>BlockDate Component</h2>
<br>
<BlockDate
date="10"
day="Digniss"
/>
<br>
<hr>
<br>
</div>
<!-- IconWithLink -->
<div>
<h2>IconWithLink Component</h2>
<br>
<IconWithLink
text="Powell"
icon-name="svg-icon-location"
to="/visit/library/powell"
/>
<br>
<IconWithLink
text="See More"
icon-name="svg-icon-search"
to="https://www.google.com/"
/>
<br>
<hr>
<br>
</div>
<!-- AlphabeticalBrowseBy -->
<div>
<h2>AlphabeticalBrowseBy Component</h2>
<br>
<AlphabeticalBrowseBy />
<br>
<AlphabeticalBrowseBy selected-letter-prop="A" />
<br>
<hr>
<br>
</div>
<!-- SearchResult -->
<div>
<h2>SearchResult Component</h2>
<br>
<SearchResult
:category="MOCK.mockdata.category"
:title="MOCK.mockdata.title"
:summary="MOCK.mockdata.text"
:to="MOCK.mockdata.to"
/>
<br>
<hr>
<br>
</div>
<!-- SingleCheckbox -->
<div>
<h2>SingleCheckbox Component</h2>
<br>
<SingleCheckbox />
<br>
<hr>
<br>
</div>
<!-- BlockCallToAction -->
<div>
<h2>BlockCallToAction Component</h2>
<br>
<BlockCallToAction
:svg-name="MOCK.mockdata.svgName"
:title="MOCK.mockdata.title"
:text="MOCK.mockdata.text"
:name="MOCK.mockdata.name"
:to="MOCK.mockdata.to"
:is-dark="false"
:is-small-size="false"
/>
<br>
<BlockCallToAction
svg-name="svg-call-to-action-money"
:title="MOCK.mockdata.title"
:text="MOCK.mockdata.text"
:name="MOCK.mockdata.name"
:to="MOCK.mockdata.to"
:is-small-size="true"
:is-dark="true"
/>
<br>
<hr>
<br>
</div>
<!-- BlockCallToActionTwoUp -->
<div>
<h2>BlockCallToActionTwoUp Component</h2>
<BlockCallToActionTwoUp :items="MOCK.blockCTAitems" />
<hr>
<br>
</div>
<!-- BlockSpace -->
<div>
<h2>BlockSpace Component</h2>
<br>
<BlockSpaces
:to="MOCK.mockdata.to"
:title="MOCK.mockdata.title"
:location="MOCK.mockdata.location"
:text="MOCK.mockdata.text"
/>
<br>
<hr>
<br>
</div>
<!-- BlockSimpleCard -->
<div>
<h2>BlockSimpleCard Component</h2>
<br>
<BlockSimpleCard
:title="MOCK.mockdata.title"
:text="MOCK.mockdata.text"
:to="MOCK.mockdata.to"
/>
<br>
<hr>
<br>
</div>
<!-- BlockEvent -->
<div>
<h2>BlockEvent Component</h2>
<br>
<BlockEvent
:category="MOCK.mockdata.category"
:title="MOCK.mockdata.title"
:prompt="MOCK.mockdata.title"
:start-date="MOCK.mockdata.startDate"
:end-date="MOCK.mockdata.endDate"
:to="MOCK.mockdata.to"
:section-handle="MOCK.mockdata.title"
/>
<br>
<hr>
<br>
</div>
<!-- BlockSponsor -->
<div>
<h2>BlockSponsor Component</h2>
<br>
<BlockSponsor
:funder-logo="MOCK.mockdata.funderLogo"
funder-name="Hostess Cupcakes"
funder-url="https://www.hostesscakes.com/products/cupcakes/chocolate/"
/>
<br>
<hr>
<br>
</div>
<!-- BlockCardWithIllustration -->
<div>
<h2>BlockCardWithIllustration Component</h2>
<br>
<ul>
<BlockCardWithIllustration
:to="MOCK.mockdata.to"
:title="MOCK.mockdata.title"
:text="MOCK.mockdata.text"
/>
</ul>
<br>
<hr>
<br>
</div>
<!-- BlockShowHide -->
<div>
<h2>BlockShowHide Component</h2>
<br>
<BlockShowHide style="width: 100%; padding: 0 48px;">
<div
style="width: 100%; padding: 0 12px 18px; border: 2px grey dotted"
data-cy="main"
>
Main content is passed via a slot and will be visible by default.
</div>
<div
class="show-hide-hideable"
style="width: 100%; padding: 0 12px 18px; border: 2px grey dotted"
data-cy="extra"
>
To make content "expandable" it should be passed in the slot along with the main content, but add the class
"show-hide-hideable" to any items that should be hidden.
</div>
</BlockShowHide>
<br>
<hr>
<br>
</div>
<!-- SectionStaffOrcidPublications -->
<div>
<h2>SectionStaffOrcidPublications Component</h2>
<br>
<SectionStaffOrcidPublications
class="staff-orcid-publications"
orcid="https://orcid.org/0000-0002-6391-2088"
publications="<ul><li><strong>Johnson, M. W.</strong>, Abumeeiz, S. & McAulay, E. (2021). 'Teaching in the Digital Library: A Partnership Between Teaching Librarians and Digital Library Staff.' College & Research Libraries News. 82(7). <a href='https://crln.acrl.org/index.php/crlnews/article/view/25033/32921'>https://crln.acrl.org/index.php/crlnews/article/view/25033/32921</a></li></ul>"
/>
<br>
<hr>
<br>
</div>
<!-- NavBreadcrumb -->
<div>
<h2>NavBreadcrumb Component</h2>
<NavBreadcrumb
title="jane-doe"
to="/about/news"
parent-title="parent"
/>
<br>
<hr>
<br>
</div>
<!-- BlockStaffSubjectLibrarian -->
<div>
<h2>BlockStaffSubjectLibrarian Component</h2>
<table>
<tbody>
<BlockStaffSubjectLibrarian v-bind="MOCK.staff" />
</tbody>
</table>
<br>
<hr>
<br>
</div>
<!-- BlockGenericList -->
<div>
<h2>BlockGenericList Component</h2>
<br>
<ul>
<BlockGenericList v-bind="MOCK.staff2" />
</ul>
<br>
<hr>
<br>
</div>
<!-- BlockAmenities -->
<div>
<h2>BlockAmenities Component</h2>
<br>
<BlockAmenities v-bind="MOCK.amenities" />
<br>
<hr>
<br>
</div>
<!-- SimpleCards -->
<div>
<h2>SimpleCards Component</h2>
<br>
<SimpleCards
:items="MOCK.twoCards.cards"
:section-title="MOCK.mockdata.sectionTitle"
:section-summary="MOCK.mockdata.sectionSummary"
/>
<br>
<hr>
<br>
</div>
<!-- SectionSpacesList -->
<div>
<h2>SectionSpacesList Component</h2>
<br>
<SectionSpacesList
:items="MOCK.spaces"
n-shown="2"
/>
<br>
<hr>
<br>
</div>
<!-- ResponsiveImage -->
<div>
<h2>ResponsiveImage Component</h2>
<br>
<ResponsiveImage
:media="API.image"
:aspect-ratio="100"
/>
<br>
<hr>
<br>
</div>
<!-- SectionDualMasonry -->
<div>
<h2>SectionDualMasonry Component</h2>
<br>
<SectionDualMasonry
:items="API.bricks"
to="/visit/foo"
text="See All Events"
/>
<br>
<hr>
<br>
</div>
<!-- SectionCardsWithIllustrations -->
<div>
<h2>SectionCardsWithIllustrations Component</h2>
<br>
<SectionCardsWithIllustrations
:items="MOCK.itemsVertical"
:section-title="MOCK.mockdata.sectionTitle"
:section-summary="MOCK.mockdata.sectionSummary"
to="/help/foo/bar"
:is-horizontal="false"
button-text="See More"
/>
<br>
<hr>
<br>
</div>
<!-- MastheadPrimary -->
<div>
<h2>MastheadPrimary Component</h2>
<br>
<MastheadPrimary
:link-items="MOCK.searchLinks.linkItems"
:advanced-search-link="MOCK.searchLinks.advancedSearchLink"
/>
<br>
<hr>
<br>
</div>
<!-- MastheadSecondary -->
<div>
<h2>MastheadSecondary Component</h2>
<br>
<MastheadSecondary
:title="MOCK.mockdata.sectionTitle"
:text="MOCK.mockdata.sectionSummary2"
/>
<br>
<hr>
<br>
</div>
<!-- CardMeta -->
<div>
<h2>CardMeta Component</h2>
<br>
<CardMeta v-bind="MOCK.mockdata" />
<br>
<hr>
<br>
</div>
<!-- BlockCardWithImage -->
<div>
<h2>BlockCardWithImage Component</h2>
<br>
<BlockCardWithImage v-bind="MOCK.mockdata" />
<br>
<hr>
<br>
</div>
<!-- BlockFloatingHighlight -->
<div>
<h2>BlockFloatingHighlight Component</h2>
<br>
<BlockFloatingHighlight v-bind="MOCK.mockdata" />
<br>
<hr>
<br>
</div>
<!-- BlockClippedDate -->
<div>
<h2>BlockClippedDate Component</h2>
<br>
<BlockClippedDate v-bind="MOCK.mockdata" />
<br>
<hr>
<br>
</div>
<!-- BannerFeatured -->
<div>
<h2>BannerFeatured Component</h2>
<br>
<BannerFeatured
:media="MOCK.mockdata.image"
:to="MOCK.mockdata.toHelp"
:title="MOCK.mockdata.title"
:category="MOCK.mockdata.category"
:breadcrumb="MOCK.mockdata.breadcrumb"
:byline="MOCK.mockdata.byline"
:prompt="MOCK.mockdata.prompt"
:locations="MOCK.mockdata.locations"
:section-handle="MOCK.mockdata.sectionHandle"
/>
<br>
<hr>
<br>
</div>
<!-- BannerHeader -->
<div>
<h2>BannerHeader</h2>
<br>
<BannerHeader
:media="MOCK.mockdata.image"
:to="MOCK.mockdata.to"
:title="MOCK.mockdata.title"
:category="MOCK.mockdata.category"
:start-date="MOCK.mockdata.startDate"
:end-date="MOCK.mockdata.endDate"
:byline="MOCK.mockdata.byline"
:prompt="MOCK.mockdata.prompt"
:locations="MOCK.mockdata.locations"
:section-handle="MOCK.mockdata.sectionHandle"
/>
<br>
<hr>
<br>
</div>
<!-- BannerText -->
<div>
<h2>BannerText</h2>
<br>
<BannerText
:category="MOCK.mockdata.category"
:title="MOCK.mockdata.title"
:text="MOCK.mockdata.text"
:button-text="MOCK.mockdata.buttonText"
:to="MOCK.mockdata.to"
:byline="MOCK.mockdata.byline"
:alternative-full-name="MOCK.mockdata.alternativeFullName"
:language="MOCK.mockdata.language"
/>
<br>
<hr>
<br>
</div>
<!-- BlockForm -->
<div>
<h2>BlockForm</h2>
<br>
<BlockForm />
<br>
<br>
<hr>
<br>
</div>
<!-- SearchHome -->
<div>
<h2>SearchHome Component</h2>
<br>
<SearchHome v-bind="MOCK.searchLinks" />
<br>
<hr>
<br>
</div>
<!-- ResponsiveVideo -->
<div>
<h2>ResponsiveVideo</h2>
<br>
<ResponsiveVideo
:media="MOCK.video"
:controls="true"
/>
<br>
<hr>
<br>
</div>
<!-- ImpactNumberCard -->
<div>
<h2>ImpactNumberCard</h2>
<br>
<ImpactNumberCard
:text="MOCK.mockdata.textShort"
:title="MOCK.mockdata.title"
:impact-number="MOCK.mockdata.impactNumber"
/>
<br>
<hr>
<br>
</div>
<!-- GridGallery -->
<div>
<h2>GridGallery</h2>
<br>
<GridGallery :items="MOCK.gridgallery" />
<br>
<hr>
<br>
</div>
<!-- FlexibleGridGalleryCards -->
<div>
<h2>FlexibleGridGalleryCards</h2>
<br>
<FlexibleGridGalleryCards :block="MOCK.flexibleGrid" />
<br>
<hr>
<br>
</div>
<!-- FlexibleCallToAction -->
<div>
<h2>FlexibleCallToAction</h2>
<br>
<FlexibleCallToAction :block="MOCK.flexCta" />
<br>
<hr>
<br>
</div>
<!-- FlexibleCallToActionTwoUp -->
<div>
<h2>FlexibleCallToActionTwoUp</h2>
<br>
<FlexibleCallToActionTwoUp :block="MOCK.flexCta2up" />
<br>
<hr>
<br>
</div>
<!-- FlexibleAssociatedTopicCards -->
<div>
<h2>FlexibleAssociatedTopicCards</h2>
<br>
<FlexibleAssociatedTopicCards :block="MOCK.flexAssocTopic" />
<br>
<hr>
<br>
</div>
<!-- FlexibleForm -->
<div>
<h2>FlexibleForm</h2>
<br>
<FlexibleForm :block="MOCK.flexForm" />
<br>
<hr>
<br>
</div>
<!-- Heading -->
<!-- <div>
<h2>Component</h2>
<br>
<component />
<br>
<hr>
<br>
</div> -->
</template>
<style scoped>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
export const flexSimpleCards = {
id: "20668",
typeHandle: "simpleCards",
sectionTitle: "SIX Flexible Simple Cards - 6 Available Printing Methods ",
sectionSummary: "<p><strong>Section Summary</strong> Let's explore <em>SIX</em> of the most well-known and commonly used types; Lithography, Screen Printing, Flexography, Digital Printing, Three Dimensional Printing, and LED UV Printing.</p>",
cards: [
{
id: "2870797",
typeHandle: "externalServiceOrResource",
title: "Lithography (External Content)",
summary: "Originally lithography used stone as the printing surface (lithography meaning ‘stone drawing’), but the Bavarian limestone most suited to production was replaced by zinc and later aluminium.",
externalLink: "https://www.hsm.ox.ac.uk/lithography"
},
{
id: "2870798",
typeHandle: "externalServiceOrResource",
title: "Screen Printing (External Content)",
summary: "Screenprinting is a process where ink is forced through a mesh screen. The ink that passes through the stencil forms the printed image. Screens used to be made of silk or synthetic materials.",
externalLink: "https://www.metmuseum.org/about-the-met/collection-areas/drawings-and-prints/materials-and-techniques/printmaking/screenprint#:~:text=Screenprinting%20is%20a%20process%20where,through%20forms%20the%20printed%20image."
},
{
id: "2870799",
typeHandle: "externalServiceOrResource",
title: "Flexography (External Content)",
summary: "Flexography is a high-speed, roll-feed web printing process. Flexographic printing is commonly used to print high volumes of labels and flexible packaging; gift wrap, shopping bags, envelopes, etc.",
externalLink: "https://ordant.com/what-is-flexographic-printing/"
},
{
id: "2870896",
typeHandle: "internalServiceOrResource",
contentLink: [
{
id: "2870869",
uri: "help/services-resources/digital-printing",
slug: "digital-printing",
title: "Digital Printing",
summary: "<p>Digital printing is the process of printing digital-based images directly onto a variety of media substrates. There is no need for a printing plate, unlike with offset printing.</p>"
}
]
},
{
id: "2881043",
typeHandle: "internalServiceOrResource",
contentLink: [
{
id: "9254",
uri: "visit/events-exhibitions/three-dimensional-printing",
slug: "three-dimensional-printing",
title: "Three Dimensional Printing",
summary: '<p><b>3D printing</b><span> or </span><b>additive manufacturing</b><span> is the </span><a href=\"https://en.wikipedia.org/wiki/Manufacturing\" title=\"Manufacturing\">construction</a><span> of a </span><a href=\"https://en.wikipedia.org/wiki/Three-dimensional_object\" class=\"mw-redirect\" title=\"Three-dimensional object\">three-dimensional object</a><span> from a </span><a href=\"https://en.wikipedia.org/wiki/Computer-aided_design\" title=\"Computer-aided design\">CAD</a><span> model or a digital </span><a href=\"https://en.wikipedia.org/wiki/3D_modeling\" title=\"3D modeling\">3D model</a><span>.</span></p>'
}
]
},
{
id: "2870996",
typeHandle: "internalServiceOrResource",
contentLink: [
{
id: "2870965",
uri: "about/news/led-uv-prinitng",
slug: "led-uv-prinitng",
title: "LED UV Prinitng",
summary: "<p><em>UV</em>-<em>LED</em> lamps are unidirectional – meaning the light is focused in one direction – and 30-50% more efficient than mercury vapor lamps.</p>",
externalResourceUrl: "https://coldesi-uvprinter.com/what-is-uv-led-printing/"
}
]
}
]
}
export const richTextFlex = {
id: "3052",
typeHandle: "richText",
sectionTitle: "ALL RICH TEXT - Section Title for Flexible Rich Text",
richText: '<h3>FLEXIBLE RICH TEXT - ALL RICH TEXT OPTIONS</h3>\n<h3><a href=\"https://printinghistory.org/mission/\" target=\"_blank\" rel=\"noreferrer noopener\">H3 - The American Printing History Association with External link</a></h3>\n<h4><a href=\"https://test-craft.library.ucla.edu/collecting-areas/arts-music\">H4 - with internal link to APHA</a></h4>\n<h5><a href=\"https://static.library.ucla.edu/craftassetstest/images/1686698673.jpg\" target=\"_blank\" rel=\"noreferrer noopener\">H5 History of printing - open in new tab</a></h5>\n<p><strong>Bold Text - The American Printing History Association</strong> <em>(APHA)</em> is a </p>\n<p><del>strikethrough membership</del> </p>\n<p>Unordered List <br /></p>\n<ul><li>calligraphy, </li><li>typefounding, </li><li>typography, </li></ul><div>Ordered List<br /></div>\n<ol><li>papermaking, </li><li>bookbinding, </li><li>illustration, and </li><li>publishing. </li></ol><h3><br />ALL THE KINDS OF LINKS</h3>\n<p><a href=\"https://test-craft.library.ucla.edu/about/news/testnews\">LINK TO ENTRY IN CRAFT (Internal) (testnews)</a></p>\n<p><a title=\"Conference\" href=\"https://static.library.ucla.edu/craftassetstest/Documents/giraffe_baby.jpg\">LINK TO ASSEST IN CRAFT (Internal) (Baby Giraffe Image)</a></p>\n<p><a href=\"https://test-craft.library.ucla.edu/collecting-areas/arts-music\">LINK TO CATEGORY (Arts & Music)</a></p>\n<p><a href=\"https://printinghistory.org/programs/conference/\" target=\"_blank\" rel=\"noreferrer noopener\">LINK (Insert Link External)</a></p>\n<h3>A PARAGRAPH</h3>\n<p><strong>The organization does this through</strong> <em>a wide variety of programs and services</em>: the <a title=\"Conference\" href=\"http://printinghistory.org/programs/conference/\">annual three-day conference</a> and <a title=\"Lieberman Lecture\" href=\"http://printinghistory.org/programs/lieberman/\">Lieberman Lecture series</a>; the <a title=\"Oral History\" href=\"http://printinghistory.org/programs/oral-history/\">oral history project</a>; the <a title=\"Fellowship\" href=\"http://printinghistory.org/programs/fellowship/\">fellowship program</a>; the scholarly journal <em><a title=\"Printing History\" href=\"http://printinghistory.org/publications/printing-history/\">Printing History</a></em> and other <a title=\"Special Publications\" href=\"http://printinghistory.org/publications/special-publications/\">special publications</a>; annual individual and institutional <a href=\"http://printinghistory.org/programs/awards/\">awards</a> that honor <del>distinguished achievement</del> in the field of printing history. <br /></p>\n<table><tbody><tr><td>TABLE</td><td>two</td><td>three</td></tr><tr><td>four</td><td>five</td><td>six</td></tr></tbody></table><p><br /></p>\n<h3>Powell Cat Image Position: LEFT - Image-style: HALF WIDTH - Link: INTERNAL</h3>\n<figure class=\"image--left image--half\"><a href=\"https://www.library.ucla.edu/about/news/in-memoriam-powell-cat/\"><img src=\"https://static.library.ucla.edu/craftassetstest/images/powell-cat-sm.png\" alt=\"Powell Cat\" /></a><figcaption>Powell Cat - POSITION: LEFT IMAGE-STYLE: HALF WIDTH LINK: INTERNAL</figcaption></figure><p> Powell Cat, UCLA’s beloved stray, passed away peacefully on March 9. The black and white cat was first spotted in 2015 near their namesake Powell Library, and soon became the campus’ informal mascot, immortalized with their own Instagram account, on t-shirts, stickers, buttons and even a cameo in a UCLA Library holiday card! The friendly feline captured students’ hearts and they shared their love and thanks at a memorial held on the steps of Powell Library on March 16. Here are a few of the hundreds of messages:</p>\n<p>Thank you for being there for me in a time when I needed it. | You were my pet away from home. Truly my comfort animal after a rough day of classes. | You’re the only cat I’ll sneeze for ♥ | Thank you for sitting on my lap when I was having a rough time. | Your legend will live forever. | Rest in peace Powell Cat ♥ We love you so much, Fly high!</p>\n<h3>Baby Giraffe Image Position: CENTER - Image-style: FULL WIDTH - Link: LINK EXTERNAL (NewTab)</h3>\n<figure class=\"image--center image--full\"><a href=\"https://www.animalfactsencyclopedia.com/Baby-Giraffe.html\" target=\"_blank\" rel=\"noreferrer noopener\"><img src=\"https://static.library.ucla.edu/craftassetstest/Documents/giraffe_baby.jpg\" alt=\"Baby Giraffe Center\" /></a><figcaption>Baby Giraffe Position: CENTER - Image-style: FULL WIDTH - Link: LINK EXTERNAL (NewTab)</figcaption></figure><p>Giraffe babies are born with their eyes open, and look very much like miniature adults, but their little horns, called \"ossicones\" are folded flat against their head while they are inside the mother, and take a few hours to start to stand up straight.Both males and females have horns known as \"occicones\", which are formed from cartilage and covered with skin. Females have thinner occicones, that are tufted with longer hair on top. Males occicones are larger, have knobs on the ends, and become bald on top as they mature. </p>\n<h3>Baby Giraffe Image. Position: RIGHT - Image-style: HALF WIDTH - Link: NO LINK</h3>\n<figure class=\"image--right image--half\"><img src=\"https://static.library.ucla.edu/craftassetstest/Documents/giraffe_baby.jpg\" alt=\"Baby Giraffe\" /><figcaption>Baby Giraffe Position: RIGHT - Image-style: HALF WIDTH - Link: NO LINK</figcaption></figure><p>A baby giraffe is a sight to behold! Just imagine a \"newborn\" that is 6 feet tall and weighs 150 pounds!<br /><br />Giraffe mothers are pregnant for 15 months, giving the embryo time to develop to such a large size, and when ready to come out, the baby comes front feet first, with the neck and head stretched out over the front knees in a sort of \"superman\" position.<br /></p>\n<p><br /></p>\n<h3 dir=\"rtl\"><br /></h3>\n<h3><br /></h3>\n<h3>VIDEO - Four Leaf Clover Hunt by Jen Diamond</h3>\n<figure><iframe style=\"width:500px;height:281px;\" src=\"//www.youtube.com/embed/RdAp0_iB7iU\" frameborder=\"0\"></iframe></figure><h3><br /></h3>\n<h3><a href=\"https://static.library.ucla.edu/craftassetstest/Documents/Peace-Guide.pdf\" target=\"_blank\" rel=\"noreferrer noopener\">LINKED FILE (Open in new page)</a> - Peace Guide</h3>\n<p lang=\"ar\" xml:lang=\"ar\">LANGUAGE TEST - Arabic</p>\n<p lang=\"zh\" xml:lang=\"zh\">LANGUAGE TEST - Chinese</p>\n<p>LANGUAGE TEST - English</p>\n<p lang=\"ja\" xml:lang=\"ja\">LANGUAGE TEST - Japanese</p>\n<p lang=\"ko\" xml:lang=\"ko\">LANGUAGE TEST - Korean</p>\n<p lang=\"es\" xml:lang=\"es\">LANGUAGE TEST - Spanish</p>\n<h3 dir=\"rtl\"><br /></h3><h3 dir=\"rtl\">TEXT DIRECTION - RIGHT TO LEFT</h3>\n<p dir=\"rtl\">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل وأساس تلك السعادة البشرية، فلا أحد يرفض أو يكره أو يتجنب الشعور بالسعادة، ولكن بفضل هؤلاء الأشخاص الذين لا يدركون بأن السعادة لا بد أن نستشعرها بصورة أكثر عقلانية ومنطقية فيعرضهم هذا لمواجهة الظروف الأليمة، وأكرر بأنه لا يوجد من يرغب في الحب ونيل المنال ويتلذذ بالآلام، الألم هو الألم ولكن نتيجة لظروف ما قد تكمن السعاده فيما نتحمله من كد وأسي.</p>',
}
export const mockdata = {
alternativeFullName: '陳餘敏卿纪念基金',
attribution: 'Lady Gaga',
breadcrumb: 'mock-breadcrumb',
buttonText: 'button-text',
byline: ['mock byline1 excepteur sint occaecat', 'mock byline2 non proident'],
category: 'mock category',
color: 'help',
description:
'Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
endDate: '2022-12-11T00:00',
funderLogo: [
{
id: '28636',
src: 'https://static.library.ucla.edu/craftassetstest/logo-arcadia1.svg',
height: 569,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/logo-arcadia1.svg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/logo-arcadia1.svg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/logo-arcadia1.svg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/logo-arcadia1.svg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/logo-arcadia1.svg 2560w',
alt: 'Logo arcadia1',
focalPoint: [0.5, 0.5],
},
],
image: {
"src": "https://via.placeholder.com/1920x1080",
"srcset": "https://via.placeholder.com/960x540 960w, https://via.placeholder.com/1280x720 1280w, https://via.placeholder.com/1920x1080 1920w",
"sizes": "100vw",
"alt": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"title": "Lorem ipsum",
"caption": "Lorem ipsum",
"height": 1080,
"width": 1920,
"focalPoint": [0.5, 0.5]
},
impactNumber: '3,958,321',
language: 'zh',
location: 'Fast Lane Building',
locations: [
{
id: '523',
title: 'Powell Library',
to: 'visit/locations/powell-library',
},
{
id: '801',
title: 'YRL',
to: 'visit/locations/yrl',
},
{
id: '3062',
title: 'Online',
to: 'visit/locations/online',
},
],
name: 'Ipsum dolor amet',
prompt: 'mock prompt',
sectionHandle: 'event',
sectionSummary: '<p><strong>Section Summary with Rich Text</strong> Lorem ipsum dolor <a href="https://fonts.google.com/featured" target="_blank" rel="noreferrer noopener">reprehenderit in voluptate.</a> <em>Ut enim ad minim veniam.</em> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p>',
sectionSummary2: '<p>Schedule a research consultation, chat with a librarian, email us, and find tutorials & workshops to support your research journey.</p> <h3>Learn how to</h3><ul><li>Find the Cafeteria</li><li>Create a Study Group</li><li>Navigate the Libraries</li></ul>',
sectionTitle: 'Section Title',
startDate: '2022-12-09T00:00',
svgName: 'svg-call-to-action-chat',
text: 'Litora torquent per conubia nostra, per inceptos himenaeos.Litora torquent per conubia nostra, per inceptos himenaeos.Litora torquent per conubia nostra, per inceptos himenaeos.Litora torquent per conubia nostra, per inceptos himenaeos.',
textShort: 'Litora torquent per conubia nostra, per inceptos himenaeos',
textLong:
'Greplin prezi zillow zoosk orkut, zoosk gooru. Kiko xobni joukuu ideeli bitly joukuu, squidoo heroku hulu sifteo, zooomr jumo dropio chumby. Qeyno wikia oooooc jajah, ebay qeyno lala, jajah lijit. Etsy wufoo flickr movity sclipo heroku, oooooc etsy oooooc. Vimeo foodzie zoosk ebay, wesabe. Ebay doostang vuvox, xobni. Mozy joyent dropio gooru kippt, greplin skype. Kiko napster geni dogster yoono yammer disqus, hipmunk xobni odeo zynga loopt. Groupon klout divvyshot zinch elgg yoono airbnb, orkut zinch chartly squidoo.',
textSemantic:
'Napster mozy sococo orkut <a href=\'http://google.com/\'>convore scribd napster</a>, twones diigo joukuu weebly. <i>Sclipo jibjab scribd</i>.',
title: 'mock title',
to: '/default/foo/bar',
toVisit: '/visit/foo/bar',
toAbout: '/about/foo/bar',
toHelp: '/help/foo/bar',
toExt: 'https://www.google.com/'
}
export const flexImpactNumberCardsMock = {
id: "37071",
sectionTitle: "Section Title: Impact Number Cards",
sectionSummary:
"<p>Section Summary: Impact Number Cards - Remote Learning by the Numbers: Data from March 2020 through September 2021</p>",
impactNumberCards: [
{
id: "37072",
title: "HathiTrust Partnership",
text: "Pages Viewed Through HathiTrust Digital Library to Support Collections Access",
impactNumber: "3,958,321",
},
{
id: "37073",
title: "Virtual Research Consultations",
text: "One-on-one Appointments with Librarians and Staff to Advance UCLA Research",
impactNumber: "6,059",
},
{
id: "37074",
title: "Device Loans",
text: "Laptop, Tablet, Hotspot Loans – Picked Up on Campus or Shipped to Users' Residences",
impactNumber: "2,902",
},
{
id: "37075",
title: "Books and Other Physical Materials Picked Up by Users at Charles E. Young Research Library",
text: "Campus Pickup",
impactNumber: "5,402",
},
{
id: "37076",
title: "Mail Delivery",
text: "Items Shipped to Users' Residences",
impactNumber: "2,220",
},
{
id: "37077",
title: "Digital Delivery",
text: "Book Chapters and Journal Articles Scanned and Delivered Digitally",
impactNumber: "2,280",
},
],
}
export const amenities = {
amenities: [
'icon-clock',
'icon-accessible',
'icon-chair',
'icon-virtual',
'icon-laptop',
'icon-locker',
'icon-light',
'icon-share-printer',
'icon-book',
],
}
export const blockCTAitems = [
{
...mockdata,
isDark: false,
isSmallSize: true,
},
{
...mockdata,
isDark: true,
isSmallSize: true,
},
]
export const blockForm = {
id: 5481,
name: "Data Science Center Workshops",
identityHelp: "",
emailMethod: {
status: "required",
label: "Email",
help: "",
},
phoneMethod: {
status: "disabled",
label: "Phone Number",
help: "",
},
barcodeMethod: {
status: "disabled",
label: "Library Barcode",
help: "",
},
questions: [
{
id: 32798,
label: "UCLA Department (Use Other Below if Your Department not Listed)",
type: "dropdown",
required: false,
options: [
"African American Studies",
"African Studies",
"American Indian Studies",
"Anderson School of Management",
"Anthropology",
],
},
{
id: 14994,
label: "Other Department or Affiliation",
type: "string",
required: false,
},
{
id: 14993,
label: "Status",
type: "checkbox",
required: true,
options: [
"Undergrad",
"Graduate",
"PostDoc",
"Faculty",
"Staff",
"Librarian",
"Visiting Scholar",
"Other",
],
},
{
id: 19717,
label: "Can we email you about future Data Science Center events & workshops?",
type: "radio",
required: false,
options: ["Yes", "No"],
},
{
id: 19772,
label: "What would you like to get out of this course?",
type: "string",
required: false,
},
],
}
export const blockToAction = {
svgName: 'svg-call-to-action-chat',
title: 'Lorem ipsum dolor sit amet?',
text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
name: 'Lorem ipsum dolor',
to: '/help/foo/bar/',
isDark: false,
isSmallSize: false,
}
export const gridgallery = [
{
image: mockdata.image,
monthYear: 'March 2020',
to: '/visit/foo/bar/',
headlineText: 'Vel Quam Elementum',
snippet:
'Vel eros donec ac odio tempor orci dapibus. Ante metus dictum at tempor. ',
},
{
image: mockdata.image,
monthYear: 'March 2020',
to: '/visit/foo/baz/',
headlineText:
'Mauris pellentesque pulvinar pellentesque habitant morbi tristique',
snippet:
'Ante metus dictum at tempor. Pretium nibh ipsum consequat nisl vel pretium. Amet consectetur adipiscing elit ut aliquam purus sit. Diam quis enim lobortis scelerisque fermentum dui faucibus. Hac habitasse platea dictumst quisque.',
},
{
image: mockdata.image,
monthYear: 'March 2020',
to: '/visit/foo/bat/',
headlineText: 'Adipiscing Tristique',
snippet:
'Vel eros donec ac odio nisl vel pretium. Amet consectetur adipiscing elit ut aliquam purus sit. ',
},
{
image: mockdata.image,
monthYear: 'March 2020',
to: '/visit/foo/ban/',
headlineText: 'Fames ac turpis egestas sed tempus lorem ipsum',
snippet: 'Vel eros donec ac .',
},
{
image: mockdata.image,
monthYear: 'March 2020',
to: '/visit/foo/barf/',
headlineText: 'Vel Quam Elementum',
featured: true,
},
{
image: mockdata.image,
to: '/visit/foo/bad/',
headlineText: 'Aenean Lectus Elit',
featured: true,
snippet:
'Vel eros donec ac odio tempor orci dapibus. Ante metus dictum at tempor. Pretium nibh ipsum consequat nisl vel pretium. Amet consectetur adipiscing elit ut aliquam purus sit. Diam quis enim lobortis scelerisque fermentum dui faucibus. Hac habitasse platea dictumst quisque.',
},
]
export const itemsBlockCallToActionTwoUp = [
{
svgName: 'svg-call-to-action-find',
title: 'Lorem ipsum dolor sit amet?',
text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
name: 'Lorem ipsum dolor',
to: '/help/foo/bar/',
isDark: false,
isSmallSize: true,
},
{
svgName: 'svg-call-to-action-chat',
title: 'Dolor sit amet Ipsum',
text: 'Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
name: 'Ipsum dolor amet',
to: '/help/foo/bar/',
isDark: true,
isSmallSize: true,
},
]
export const itemsVertical = [
{
iconName: 'illustration-book-binding',
to: '/help/foo/bar/',
title: 'Lacus Luctus',
text: 'There are lots of things to climb on and huge space to run around. There\'s a large sitting area for us to bring our snacks/lunch or for me to read a book while they play well, at least for a few minutes until they come up and want to interact with me again. :) The place has been very clean every time we\'ve been there.',
isHorizontal: false,
},
{
iconName: 'illustration-find-space',
to: '/visit/foo/baz/',
title: 'Ultrices Enim',
text: 'Under the Sea is the newest, fun, unique, exciting, most talked about children\'s entertainment center. Beautiful floor-to-ceiling murals depict the world under the sea, with pirates, mermaids, and other sea life. As different as all kids are, they all enjoy one thing: fun,fun, and tons of fun!',
isHorizontal: false,
},
{
// iconName: 'illustration-digitized-resources',
iconName: 'icon-clock',
to: '/about/foo/fred/',
title: 'Egestas et Augue Justo eu Magna Luctus',
text: 'Unleash your child\'s imagination in a world Under the Sea. Through play, children develop the self esteem, coordination, and social skills necessary to grow. Children will bounce in the Moon Bouncer, go down the Turbo Slide, crawl through the climbing structure, or climb up to the top of a sea castle.',
isHorizontal: false,
},
{
iconName: 'illustration-databases',
to: '/about/foo/thud/',
title: 'Proin Sodales',
text: 'Under the Sea is the newest, fun, unique, exciting, most talked about children\'s entertainment center. Beautiful floor-to-ceiling murals depict the world under the sea, with pirates, mermaids, and other sea life. As different as all kids are, they all enjoy one thing: fun, fun and tons of fun!',
isHorizontal: false,
},
{
iconName: 'illustration-remote-access',
to: '/visit/foo/qux/',
title: 'Taciti sociosqu',
text: 'Our Live Characters Make each event an unforgettable celebration. Each performance is unique, and includes music, games, magic, and interaction with the guests.',
isHorizontal: false,
},
]
export const navSecondaryLinks = {
items: [
{
id: '843',
name: 'Locations & Hours',
to: '/locations',
classes: '',
},
{
id: '844',
name: 'Ask a Librarian',
to: 'https://external.url/research-teaching-support/research-help',
classes: null,
},
{
id: '25315',
name: 'Support Us',
to: 'https://giving.ucla.edu/Standard/NetDonate.aspx?SiteNum=463',
classes: 'support-link',
target: '0',
},
{
id: '845',
name: 'My Account',
to: 'https://search.library.ucla.edu/discovery/login?vid=01UCS_LAL:UCLA',
classes: 'account-button',
target: '1',
},
],
}
export const searchLinks = {
linkItems: [
{
text: 'Course Reserves',
url: 'https://catalog.library.ucla.edu/vwebv/enterCourseReserve.do',
target: '_blank',
},
{
text: 'UCLA Research Guides',
url: 'https://guides.library.ucla.edu/',
target: '',
},
{
text: 'Databases A-Z',
url: 'https://guides.library.ucla.edu/az.php',
target: '_blank',
},
],
advancedSearchLink: {
text: 'Advanced Search',
url: 'https://www.library.ucla.edu/search',
target: '_blank',
},
}
export const searchResult = {
category: 'Article',
to: '/about/news/article',
title: 'Lacus Luctus',
summary:
'Litora torquent per conubia nostra, per inceptos himenaeos.Litora torquent per conubia nostra, per inceptos himenaeos.Litora torquent per conubia nostra, per inceptos himenaeos.Litora torquent per conubia nostra, per inceptos himenaeos.',
}
export const sectionTeaser = [
{
image: null,
to: '/visit/foo/bar/',
category: 'Ullamco',
title: 'Fames ac turpis egestas sed tempus lorem ipsum',
startDate: '2021-09-03T08:00:00+00:00',
endDate: '2021-10-08T07:10:00+00:00',
text: 'Ultricies leo integer malesuada nunc vel risus commodo viverra.',
sectionHandle: 'event',
},
{
image: mockdata.image,
to: '/visit/foo/baz/',
category: 'Sagittis',
title: 'Amet nisl suscipit adipiscing bibendum lectus sed',
startDate: '2021-09-03T08:00:00+00:00',
endDate: '2021-10-08T07:10:00+00:00',
sectionHandle: 'event',
text: 'A diam maecenas sed enim. Tristique senectus et netus et malesuada fames. Nibh nisl condimentum id venenatis. Mi bibendum neque egestas congue. Placerat duis ultricies lacus sed turpis. Massa enim nec dui nunc mattis. Dolor morbi non arcu risus quis varius vestibulum sed.',
},
{
image: mockdata.image,
to: '/visit/foo/bat/',
category: 'Tincidunt',
title: 'Scelerisque varius morbi enim nunc ornare quam',
startDate: '2021-09-03T08:00:00+00:00',
endDate: '2021-10-08T07:10:00+00:00',
sectionHandle: 'event',
text: 'Eu ultrices vitae auctor eu augue. Dolor morbi non arcu risus quis varius quam. Augue lacus viverra vitae congue eu consequat.',
},
{
image: mockdata.image,
to: '/visit/foo/ban/',
category: 'Gravida',
title: 'At varius vel pharetra vel turpis. Quam vulputate dignissim suspendisse in est ante in. Sed cras ornare arcu. Non diam phasellus vestibulum.',
startDate: '2021-09-03T08:00:00+00:00',
endDate: '2021-10-08T07:10:00+00:00',
sectionHandle: 'event',
text: 'Accumsan tortor posuere ac ut consequat semper viverra libero.',
},
{
image: mockdata.image,
to: '/visit/foo/bar/',
category: 'Ullamco',
title: 'Fames ac turpis egestas sed tempus lorem ipsum',
startDate: '2021-09-03T08:00:00+00:00',
endDate: '2021-10-08T07:10:00+00:00',
text: 'Ultricies leo integer malesuada nunc vel risus commodo viverra.',
sectionHandle: 'event',
},
]
export const spaces = [
{
to: 'https://calendar.library.ucla.edu',
title: 'Internal Portico',
location: 'Fames Turpis Building',
text: 'Etiam faucibus tellus quis magna finibus auctor. Fusce sagittis vel lectus sed ullamcorper. Proin faucibus nibh ut purus consequat lobortis. Aenean eu fermentum leo, vitae egestas eros. Vivamus urna nibh, porttitor in egestas eu, eleifend ac felis. Praesent sed tristique nibh. Nulla dignissim purus at metus consequat, vitae pharetra orci efficitur. Vivamus facilisis massa vel ipsum vestibulum, porta efficitur dolor aliquam.',
buttonUrl: 'http://google.com',
},
{
to: 'https://www.gettyimages.com/photos/cute-llamas',
title: 'External Von Junz',
location: 'Debordist Room',
text: 'If one examines Marxist class, one is faced with a choice: either reject Baudrillardist simulation or conclude that the significance of the artist is social comment. The premise of Debordist situation implies that the law is capable of significance. Therefore, any number of constructions concerning a self-sufficient reality may be found.',
buttonUrl: 'http://google.com',
},
{
to: '',
title: 'Null Beefeater Numpty',
location: 'Pennyboy Cottage',
text: 'Gosh beefeater numpty scouser rambunctious a bottle of plonk know your onions, cornish pasty spend a penny cheerio down the local mush. What a mug one off blimey a comely wench nose rag ponce gobsmacked pennyboy cottage pie, ey up fake tan spam fritters marvelous chippy hedgehog chav.',
buttonUrl: 'http://google.com',
},
]
export const staff = {
subjectArea: 'African American Studies',
nameFirst: 'Ariane',
nameLast: 'Bicho',
to: '/about/staff/ariane-bicho',
staffName: 'Ariane Bicho 娘の洋子より',
image: null,
jobTitle: 'Director of Communications and Marketing',
departments: [
{
id: '7272',
title: 'Communications',
},
{
id: '7373',
title: 'Marketing',
},
],
alternativeName: [
{
fullName: '娘の洋子より',
languageAltName: 'zh',
},
],
uri: 'about/staff/ariane-bicho',
phone: '(222) 444-5555',
email: '[email protected]',
consultation: 'https://calendar.library.ucla.edu/appointments/aogarcia',
academicDepartments: [
{
id: '11947',
title: 'African American Studies',
},
{
id: '11955',
title: 'Cluster 60: America in Sixties: Politics, Society, and Culture, 1954 to 1974',
},
],
locations: [
{
title: 'DIIT',
to: 'location/bar',
},
],
}
export const staff2 = {
title: 'Humanities and Social Sciences Librarian',
alternativeFullName: '陳餘敏卿纪念基金',
language: 'zh',
text:
'<p><span>The UCLA Library seeks a highly collaborative, user-focused professional for the position of Humanities and Social Sciences Librarian. </span><br /></p>',
jobType: [
{
title: 'Academic Librarian',
},
],
jobRequisitionNumber: 'JPF08053',
jobPostingURL: 'https://recruit.apo.ucla.edu/JPF08053',
department: [
{
title: 'User Engagement',
},
{
title: 'Human Resources',
},
],
associatedLocations: [
{
title: 'UCLA Film & Television Archive',
uri: 'visit/locations/film-television-archive',
},
{
title: 'Powell Library',
uri: 'visit/locations/powell-library',
},
]
}
export const twoCards = {
id: '13783',
sectionTitle: 'Fix Potholes',
sectionSummary:
'<p>Get pothole repair service in Los Angeles and surrounding areas. We look forward to serving all your needs. Contact us now for fast service. Get A Free Quote. It is a frightening thought to imagine the ground below your feet or house suddenly collapsing and forming a big hole in the ground.</p>',
cards: [
{
id: '6622',
text: '<p>Learn how to use a VPN or proxy server to access Library resources with your UCLA Logon ID through a series of helpful videos.</p>',
title: 'Connecting from Off-Campus',
slug: 'connecting-from-off-campus',
to: 'help/services-resources/connecting-from-off-campus',
type: 'resource',
},
{
id: '6407',
text: '<p>A research guide</p>',
title: 'A new research guide',
slug: 'a-new-research-guide',
to: null,
externalResourceUrl: 'http://libguides.library.ucla.edu',
},
],
}
export const threeCards = {
id: '13783',
sectionTitle: 'Fix Potholes',
sectionSummary:
'<p>Get pothole repair service in Los Angeles and surrounding areas. We look forward to serving all your needs. Contact us now for fast service. Get A Free Quote.</p>',
cards: [
{
id: '8203',
text: '<p>The Library Prize for Undergraduate Research recognizes and honors excellence in undergraduate research at UCLA. The application period for the 2022 Library Prize for Undergraduate Research closes on March 30, 2022 at 11:59 p.m. PT.</p>',
title: 'Library Prize for Undergraduate Research',
slug: 'library-prize-for-undergraduate-research',
to: 'about/awards-grants/library-prize-for-undergraduate-research',
},
{
id: '6622',
text: '<p>Learn how to use a VPN or proxy server to access Library resources with your UCLA Logon ID through a series of helpful videos.</p>',
title: 'Connecting from Off-Campus',
slug: 'connecting-from-off-campus',
to: 'help/services-resources/connecting-from-off-campus',
type: 'resource',
},
{
id: '6407',
text: '<p>A research guide</p>',
title: 'A new research guide',
slug: 'a-new-research-guide',
to: null,
externalResourceUrl: 'http://libguides.library.ucla.edu',
},
],
}
export const video = {
"id": "42094",
"src": "https://static.library.ucla.edu/ucla-impact-report-animation.mp4",
"height": 1892,
"width": 3360,
"srcset": "",
"alt": "Ucla impact report animation",
"focalPoint": [0.5, 0.5]
}
// FLEXIBLE MOCK DATA
export const flexAssocTopic = {
id: '13783',
typeHandle: 'associatedTopicCards',
sectionTitle: 'Section Title: Fix Potholes',
sectionSummary:
'<p>Section Summary: Get pothole repair service in Los Angeles and surrounding areas. We look forward to serving all your needs. Contact us now for fast service. Get A Free Quote.</p>',
associatedTopicsFlexiblePageBlock: [
{
id: '13899',
topics: [
{
to: 'help/road-work',
title: 'Road Work Guide',
text: '<p>A research guide</p>',
},
{
title: 'Types of Sinkholes',
text: 'Dissolution sinkholes, Cover-subsidence sinkholes, Cover-collapse sinkholes',
uri: 'help/types-sinkholes',
},
{
uri: 'help/animals',
title: 'Animals eat food!',
text: '<p>Some animals eat plants and plant products like grass, leaves and fodder. Goat, cow, horse and sheep eat only plants.</p>',
},
{
title: 'Metadata Planning Worksheet',
text: '<p>Use this worksheet to brainstorm how you might want to describe items\n within your collection and to hone in your choices before filling out \nthe spreadsheet.</p>',
uri: null,
externalResourceUrl:
'https://docs.google.com/document/d/1hyzHX5cWE_Y7aML7XHI29tswnqV44Q0sJsnibu-Krp4/edit',
},
],
},
],
}
export const flexBannerFeat = {
id: '26943',
sectionTitle: 'Internal link',
content: [
{
id: '26944',
contentLink: [
{
contentType: 'article',
title: 'La Niña',
to: 'about/news/la-niña',
sectionHandle: 'article',
summary:
'<p>La Niña is an oceanic and atmospheric phenomenon that is the colder counterpart of El Niño, as part of the broader El Niño–Southern Oscillation climate pattern.</p>',
articleCategory: [
{
title: 'Featured Category',
},
],
articleByline1: [
{
id: '11827',
to: 'about/staff/brigid-abreu',
title: 'Brigid Abreu',
},
{
id: '11910',
to: 'about/staff/sylvia-page',
title: 'Sylvia Page',
},
],
articleByline2: '2022-06-21T12:39:00-07:00',
articleLocations: [
{
id: '11709',
title: 'William Andrews Clark Memorial Library',
to: 'visit/locations/william-andrews-clark-memorial-library',
},
{
id: '11497',
title: 'Richard C. Rudolph East Asian Library',
to: 'visit/locations/east-asian-library',
},
],
heroImage: [
{
image: [
{
id: '20637',
src: 'https://static.library.ucla.edu/craftassetstest/LaNina-Jet-Wintertime-Pattern.jpg',
height: 1997,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 2560w',
alt: 'La Nina Jet Wintertime Pattern',
focalPoint: [0.5, 0.5],
altText: 'La Niña',
},
],
},
],
},
],
},
],
typeHandle: 'bannerFeatured',
}
export const flexCta = {
id: '16983',
typeHandle: 'callToAction',
callToAction: [
{
id: '16984',
titleCta: 'Call to Action',
summary: 'A Call to Action',
icon: 'svg-call-to-action-find',
buttonText: 'Click me',
buttonUrl: 'http://google.com',
backgroundColor: false,
},
],
}
export const flexCta2up = {
typeHandle: 'ctaBlock2Up',
ctaBlock2Up: [
{
text: 'Parking passes for Cats & Kittens only. Day use, weekly, monthly and annual passes are available now.',
name: 'Get Parking Passes',
to: 'http://cat-kitten-parking.com',
title: 'Cat & Kitten Parking Passes',
svgName: 'svg-call-to-action-find',
backgroundColor: true,
isDark: false,
isSmallSize: true,
},
{
text: 'Advanced Ancient Greek for Dogs. Teach your dog the useful language of ancient Greek so you can communicate together more effectively.',
name: 'Sign Up for Class',
to: 'http://ancient-greek-for-dogs.com',
title: 'Ancient Greek for Dogs',
svgName: 'svg-call-to-action-money',
backgroundColor: false,
isDark: true,
isSmallSize: true,
},
],
}
export const flexForm = {
form: '<div id="form_95580ed5e8d04c56e4afbf9e91781b28"></div><script type="text/javascript" src="https://ucla.libwizard.com/form_loader.php?id=95580ed5e8d04c56e4afbf9e91781b28&noheader=0"></script>',
sectionTitle: 'Section Title',
sectionSummary: 'Section Summary',
}
export const flexibleGrid = {
id: '40361',
// subtitle: 'Flexible Grid Gallery Cards',
// summary: '<p>Hello everyone</p>',
sectionTitle: 'Section Title: Grid Gallery Cards',
sectionSummary: '<p>Section Summary: Grid Gallery Cards</p>',
gridGalleryCards: [
{
id: '40362',
contentLink: [
{
contentType: 'article',
title: 'La Niña',
snippet:
'<p>La Niña is an oceanic and atmospheric phenomenon that is the colder counterpart of El Niño, as part of the broader El Niño–Southern Oscillation climate pattern.</p>',
to: 'about/news/la-niña',
heroImage: [
{
image: [
{
id: '20637',
src: 'https://static.library.ucla.edu/craftassetstest/LaNina-Jet-Wintertime-Pattern.jpg',
height: 1997,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 2560w',
alt: 'La Nina Jet Wintertime Pattern',
focalPoint: [0.5, 0.5],
},
],
},
],
},
],
featured: 'false',
},
{
id: '40363',
featured: 'true',
titleGeneral: 'This is a featured content',
snippet: '<p>Virtual library demo</p>',
image: [
{
id: '40342',
src: 'https://static.library.ucla.edu/craftassetstest/images/virtual-screening-room-toll-sea_2022-09-21-214436_bnja.jpeg',
height: 1870,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/images/_375xAUTO_crop_center-center_none/virtual-screening-room-toll-sea_2022-09-21-214436_bnja.jpeg 375w, https://static.library.ucla.edu/craftassetstest/images/_960xAUTO_crop_center-center_none/virtual-screening-room-toll-sea_2022-09-21-214436_bnja.jpeg 960w, https://static.library.ucla.edu/craftassetstest/images/_1280xAUTO_crop_center-center_none/virtual-screening-room-toll-sea_2022-09-21-214436_bnja.jpeg 1280w, https://static.library.ucla.edu/craftassetstest/images/_1920xAUTO_crop_center-center_none/virtual-screening-room-toll-sea_2022-09-21-214436_bnja.jpeg 1920w, https://static.library.ucla.edu/craftassetstest/images/_2560xAUTO_crop_center-center_none/virtual-screening-room-toll-sea_2022-09-21-214436_bnja.jpeg 2560w',
alt: 'Virtual screening room toll sea',
focalPoint: [0.5, 0.5],
},
],
externalLink: 'http://www.google.com',
},
],
typeHandle: 'gridGalleryCards',
}
export const flexHighlightMock1 = {
id: '27359',
typeHandle: 'highlight',
sectionTitle: 'Section Title: BlockHighlight',
sectionSummary: '<p>Section Summary: BlockHighlight</p>',
highlight: [
{
id: '27360',
typeHandle: 'internalContent',
contentLink: [
{
id: '20628',
contentType: 'article',
to: 'about/news/la-niña',
title: 'La Niña',
text: '<p><strong>La Niña</strong> is an <em>oceanic and atmospheric phenomenon</em> that is the colder counterpart of El Niño, as part of the broader El Niño–Southern Oscillation climate pattern.</p>',
articleCategory: [
{
title: 'Featured Internal Content',
},
],
articleByline1: [
{
id: '11827',
to: 'about/staff/brigid-abreu',
title: 'Brigid Abreu',
},
{
id: '11910',
to: 'about/staff/sylvia-page',
title: 'Sylvia Page',
},
],
articleByline2: '2022-06-21T12:39:00-07:00',
associatedLocations: [
{
id: '11709',
title: 'William Andrews Clark Memorial Library',
to: 'visit/locations/william-andrews-clark-memorial-library',
},
{
id: '11497',
title: 'Richard C. Rudolph East Asian Library',
to: 'visit/locations/east-asian-library',
},
],
heroImage: [
{
id: '20639',
image: [
{
id: '20637',
src: 'https://static.library.ucla.edu/craftassetstest/LaNina-Jet-Wintertime-Pattern.jpg',
height: 1997,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/LaNina-Jet-Wintertime-Pattern.jpg 2560w',
alt: 'La Nina Jet Wintertime Pattern',
focalPoint: [0.5, 0.5],
altText: 'La Niña',
},
],
},
],
},
],
},
{
id: '27361',
typeHandle: 'internalContent',
contentLink: [
{
id: '16484',
contentType: 'article',
to: 'about/news/this-is-the-newest-article',
title: 'Shortbread is delicious',
text: '<p><strong>Shortbread</strong> or shortie is a traditional <a href="https://www.scotchandscones.com/shortbread-history/">Scottish biscuit</a> usually made from <em>one part white sugar</em>, two parts butter, and three to four parts plain wheat flour.</p>',
articleCategory: [
{
title: 'Featured External Content',
},
],
articleByline1: [
{
id: '3522',
to: 'about/staff/dianne',
title: 'Dianne Weinthal',
},
],
articleByline2: '2022-05-19T13:59:00-07:00',
associatedLocations: [
{
id: '4695',
title: 'Louise M. Darling Biomedical Library',
to: 'visit/locations/biomed',
},
],
heroImage: [
{
id: '16537',
image: [
{
id: '2442',
src: 'https://static.library.ucla.edu/craftassetstest/shortbread-cookies.jpg',
height: 1421,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/shortbread-cookies.jpg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/shortbread-cookies.jpg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/shortbread-cookies.jpg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/shortbread-cookies.jpg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/shortbread-cookies.jpg 2560w',
alt: 'Shortbread cookies',
focalPoint: [0.5, 0.5],
altText: null,
},
],
},
],
},
],
},
{
id: '39508',
typeHandle: 'externalContent',
title: 'Pandemic Spurs Virtual Screening Room, Bringing Moving Images to a Global Audience',
image: [
{
id: '36751',
src: 'https://static.library.ucla.edu/craftassetstest/images/virtual-screening-room-toll-sea.jpeg',
height: 1869,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/images/_375xAUTO_crop_center-center_none/virtual-screening-room-toll-sea.jpeg 375w, https://static.library.ucla.edu/craftassetstest/images/_960xAUTO_crop_center-center_none/virtual-screening-room-toll-sea.jpeg 960w, https://static.library.ucla.edu/craftassetstest/images/_1280xAUTO_crop_center-center_none/virtual-screening-room-toll-sea.jpeg 1280w, https://static.library.ucla.edu/craftassetstest/images/_1920xAUTO_crop_center-center_none/virtual-screening-room-toll-sea.jpeg 1920w, https://static.library.ucla.edu/craftassetstest/images/_2560xAUTO_crop_center-center_none/virtual-screening-room-toll-sea.jpeg 2560w',
alt: 'Virtual screening room toll sea',
focalPoint: [0.5, 0.5],
},
],
byline1: null,
byline2: null,
category: null,
text: 'When its <a href"https://www.nationaltheatre.org.uk/">theatrical home</a> closed its doors in <strong>March 2020</strong> due to <em>COVID-19</em> the UCLA Film & Television Archive shifted public programming to an ambitious new online screening',
to: 'https://www.cinema.ucla.edu/blogs/archive-blog/2022/01/31/pandemic-spurs-virtual-screening-room',
},
{
id: '27384',
typeHandle: 'externalContent',
title: 'Mmmmm Shortbread',
image: [
{
id: '26803',
src: 'https://static.library.ucla.edu/craftassetstest/shortbread-cookies.jpg',
height: 1421,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/shortbread-cookies.jpg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/shortbread-cookies.jpg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/shortbread-cookies.jpg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/shortbread-cookies.jpg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/shortbread-cookies.jpg 2560w',
alt: 'Kids',
focalPoint: [0.5, 0.5],
altText: null,
},
],
byline1: 'Ashton Prigge',
byline2: null,
category: 'External Content',
location: null,
text: null,
},
{
id: '28621',
typeHandle: 'internalContent',
contentLink: [
{
id: '25318',
contentType: 'meapProject',
to: 'meap/projects/argentinean-human-rights-digital-library-of-periodical-and-non-periodical-publications',
title: 'Argentinean Human Rights Digital Library of Periodical and Non-periodical Publications',
text: '<p><a href="https://www.cinema.ucla.edu/billy-wilder-theater">Memoria Abierta</a> is an <strong>alliance</strong> of nine Argentinean <em>human rights</em> organizations. Most of them were created during the last dictatorship (1976-1983) to denounce the violations committed during that period and to support relatives and victims. The Argentinean human rights movement, with its innovative strategies to fight oblivion and achieve justice, is known worldwide and referenced by other countries where human rights crimes have been or are being committed.</p>',
projectCategory: 'Publications',
projectByline1: [
{
id: '25325',
title: 'Memoria Abierta',
},
],
articleByline2: '2022-07-26T10:49:00-07:00',
projectLocations: [
{
id: '25324',
title: 'South America',
},
],
heroImage: [
{
id: '25334',
image: [
{
id: '24878',
src: 'https://static.library.ucla.edu/craftassetstest/toni-g-rbregi1jeo-unsplash.jpg',
height: 4552,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/_375xAUTO_crop_center-center_none/toni-g-rbregi1jeo-unsplash.jpg 375w, https://static.library.ucla.edu/craftassetstest/_960xAUTO_crop_center-center_none/toni-g-rbregi1jeo-unsplash.jpg 960w, https://static.library.ucla.edu/craftassetstest/_1280xAUTO_crop_center-center_none/toni-g-rbregi1jeo-unsplash.jpg 1280w, https://static.library.ucla.edu/craftassetstest/_1920xAUTO_crop_center-center_none/toni-g-rbregi1jeo-unsplash.jpg 1920w, https://static.library.ucla.edu/craftassetstest/_2560xAUTO_crop_center-center_none/toni-g-rbregi1jeo-unsplash.jpg 2560w',
alt: 'Toni g rbregi1jeo unsplash',
focalPoint: [0.5, 0.5],
altText: null,
},
],
},
],
},
],
},
],
}
export const flexHighlightMock2 = {
id: '696267',
typeHandle: 'highlight',
sectionTitle: 'Flexible Highlight with events and exhibitions',
sectionSummary:
'<p>Flexible Highlight with events and exhibitions so that we can test</p>',
highlight: [
{
id: '696268',
typeHandle: 'internalContent',
contentLink: [
{
id: '197177',
contentType: 'event',
to: 'visit/events-exhibitions/test-the-white-balloon',
title: 'TEST - The White Balloon',
text: null,
eventDescription:
'<p><strong>All <em>Family Flicks</em> screenings are free admission. Seating is first come, first served. The Billy Wilder Theater opens 15 minutes before each <em>Family Flicks</em> program.</strong></p>\n\n<p>Director Jafar Panahi’s debut feature, <em>The White Balloon</em>, won the Camera d’Or at the Cannes Film Festival and announced the arrival of a major new voice on the international film scene. A simply presented but powerful moving fable of perseverance, it follows a young girl as she overcomes the obstacles of the big city on her way to buy a goldfish for Nowruz, the Iranian New Year. Among The Guardian newspaper’s top 50 family films of all time, <em>The White Balloon</em> is also on the British Film Institute’s list of 50 films you should see by the age of 14.</p>\n\n<p>35mm, color, in Persian with English subtitles, 85 min. Director: Jafar Panahi. Screenwriter: Abbas Kiarostami. With: Aida Mohammadkhani, Mohsen Kafili, Fereshteh Sadre Orafaiy.</p>\n\n<p>Part of: <a href="https://www.cinema.ucla.edu/events/family-flicks" target="_blank" rel="noreferrer noopener">Family Flicks</a><br /><a href="https://www.cinema.ucla.edu/events/2023/01/22/the-white-balloon" target="_blank" rel="noreferrer noopener">Learn more</a> </p>',
articleByline2: '2022-12-19T07:48:00-08:00',
startDateWithTime: '2022-12-19T11:00',
endDateWithTime: '2022-12-19T12:30',
eventType: [],
associatedLocations: [
{
id: '11612',
title: 'UCLA Film & Television Archive',
to: 'visit/locations/film-television-archive',
},
],
heroImage: [
{
id: '197178',
image: [
{
id: '86612',
src: 'https://static.library.ucla.edu/craftassetstest/images/_fullscreen/1670615203.jpg',
height: 1846,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/images/_375xAUTO_crop_center-center_none/1670615203.jpg 375w, https://static.library.ucla.edu/craftassetstest/images/_960xAUTO_crop_center-center_none/1670615203.jpg 960w, https://static.library.ucla.edu/craftassetstest/images/_1280xAUTO_crop_center-center_none/1670615203.jpg 1280w, https://static.library.ucla.edu/craftassetstest/images/_1920xAUTO_crop_center-center_none/1670615203.jpg 1920w, https://static.library.ucla.edu/craftassetstest/images/_2560xAUTO_crop_center-center_none/1670615203.jpg 2560w',
alt: 'placeholder',
focalPoint: [0.5, 0.5],
},
],
},
],
},
],
},
{
id: '696269',
typeHandle: 'internalContent',
contentLink: [
{
id: '8901',
contentType: 'exhibition',
to: 'visit/events-exhibitions/fante-asafo-flags',
title: 'Fante Asafo Flags',
text: '<p>Prior to the colonial era, asafo companies were charged with the safety and protection of the region. Surviving a century of violence and upheaval, they remain one of the core local institutions.</p>',
articleByline2: '2022-03-09T15:17:00-08:00',
startDate: '2023-01-04T00:00',
endDate: '2023-03-05T00:00',
heroImage: [
{
id: '9068',
image: [
{
id: '63048',
src: 'https://static.library.ucla.edu/craftassetstest/images/_fullscreen/flag_2022-11-23-012414_fjms.jpg',
height: 1703,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/images/_375xAUTO_crop_center-center_none/flag_2022-11-23-012414_fjms.jpg 375w, https://static.library.ucla.edu/craftassetstest/images/_960xAUTO_crop_center-center_none/flag_2022-11-23-012414_fjms.jpg 960w, https://static.library.ucla.edu/craftassetstest/images/_1280xAUTO_crop_center-center_none/flag_2022-11-23-012414_fjms.jpg 1280w, https://static.library.ucla.edu/craftassetstest/images/_1920xAUTO_crop_center-center_none/flag_2022-11-23-012414_fjms.jpg 1920w, https://static.library.ucla.edu/craftassetstest/images/_2560xAUTO_crop_center-center_none/flag_2022-11-23-012414_fjms.jpg 2560w',
alt: null,
focalPoint: [0.5, 0.5],
},
],
},
],
},
],
},
{
id: '696270',
typeHandle: 'internalContent',
contentLink: [
{
id: '36092',
contentType: 'article',
to: 'about/news/casper-the-ghost',
title: 'Casper the Ghost',
text: '<p>He is a pleasant, personable and translucent <a href="https://en.wikipedia.org/wiki/Ghost" title="Ghost" target="_blank" rel="noreferrer noopener">ghost</a>, but often criticized by his three wicked uncles, <a href="https://en.wikipedia.org/wiki/The_Ghostly_Trio" class="mw-redirect" title="The Ghostly Trio" target="_blank" rel="noreferrer noopener">the Ghostly Trio</a>.<br /></p>',
articleCategory: [],
articleByline2: '2022-09-13T15:06:00-07:00',
associatedLocations: [],
heroImage: [
{
id: '49470',
image: [
{
id: '49469',
src: 'https://static.library.ucla.edu/craftassetstest/images/_fullscreen/Casper.png',
height: 2225,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/images/_375xAUTO_crop_center-center_none/Casper.png 375w, https://static.library.ucla.edu/craftassetstest/images/_960xAUTO_crop_center-center_none/Casper.png 960w, https://static.library.ucla.edu/craftassetstest/images/_1280xAUTO_crop_center-center_none/Casper.png 1280w, https://static.library.ucla.edu/craftassetstest/images/_1920xAUTO_crop_center-center_none/Casper.png 1920w, https://static.library.ucla.edu/craftassetstest/images/_2560xAUTO_crop_center-center_none/Casper.png 2560w',
alt: null,
focalPoint: [0.5, 0.5],
},
],
},
],
},
],
},
{
id: '707393',
typeHandle: 'internalContent',
contentLink: [
{
id: '50864',
contentType: 'workshopOrEventSeries',
to: 'visit/events-exhibitions/test-event-series',
title: 'Test Event Series: Side Pie',
text: '<p>Started in a Side Yard in a Pandemic. Our goals are simple: to bring the best pizza to the neighborhood and give back to the community. We love Altadena, we love pizza. <br /></p>',
articleByline2: '2022-10-31T16:11:00-07:00',
startDate: '2022-11-17T00:00',
endDate: '2022-11-30T00:00',
associatedLocations: [
{
id: '801',
title: 'Charles E. Young Research Library',
to: 'visit/locations/young-research-library',
},
],
heroImage: [
{
id: '60178',
image: [
{
id: '59935',
src: 'https://static.library.ucla.edu/craftassetstest/images/_fullscreen/SidePie20220278_470x.webp',
height: 1026,
width: 2560,
srcset: 'https://static.library.ucla.edu/craftassetstest/images/_375xAUTO_crop_center-center_none/SidePie20220278_470x.webp 375w, https://static.library.ucla.edu/craftassetstest/images/_960xAUTO_crop_center-center_none/SidePie20220278_470x.webp 960w, https://static.library.ucla.edu/craftassetstest/images/_1280xAUTO_crop_center-center_none/SidePie20220278_470x.webp 1280w, https://static.library.ucla.edu/craftassetstest/images/_1920xAUTO_crop_center-center_none/SidePie20220278_470x.webp 1920w, https://static.library.ucla.edu/craftassetstest/images/_2560xAUTO_crop_center-center_none/SidePie20220278_470x.webp 2560w',
alt: 'color photograph of beige tshirt with side pie text',
focalPoint: [0.5, 0.5],
},
],
},
],
},
],
},
],
}