FEATURE temporarely keeping this demonsrtration block
This commit is contained in:
Antoine M
parent
d99a296280
commit
bf417b4e59
71
plugins/carhop-blocks/src/company-timeline/block.json
Normal file
71
plugins/carhop-blocks/src/company-timeline/block.json
Normal file
|
|
@ -0,0 +1,71 @@
|
|||
{
|
||||
"$schema": "https://schemas.wp.org/trunk/block.json",
|
||||
"apiVersion": 3,
|
||||
"name": "telex/block-company-timeline",
|
||||
"version": "0.1.0",
|
||||
"title": "Company Timeline",
|
||||
"category": "design",
|
||||
"icon": "calendar-alt",
|
||||
"description": "Display company milestones with a fixed sidebar navigation and scroll-based highlighting",
|
||||
"keywords": [
|
||||
"timeline",
|
||||
"history",
|
||||
"milestones",
|
||||
"chronology",
|
||||
"events"
|
||||
],
|
||||
"attributes": {
|
||||
"entries": {
|
||||
"type": "array",
|
||||
"default": [
|
||||
{
|
||||
"year": "2020",
|
||||
"title": "Company Founded",
|
||||
"description": "Our journey began with a vision to make a difference.",
|
||||
"imageUrl": "",
|
||||
"imageId": 0
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"example": {
|
||||
"attributes": {
|
||||
"entries": [
|
||||
{
|
||||
"year": "2010",
|
||||
"title": "The Beginning",
|
||||
"description": "Founded with a mission to innovate.",
|
||||
"imageUrl": "",
|
||||
"imageId": 0
|
||||
},
|
||||
{
|
||||
"year": "2015",
|
||||
"title": "Major Milestone",
|
||||
"description": "Reached 1 million customers worldwide.",
|
||||
"imageUrl": "",
|
||||
"imageId": 0
|
||||
},
|
||||
{
|
||||
"year": "2020",
|
||||
"title": "Global Expansion",
|
||||
"description": "Opened offices in 25 countries.",
|
||||
"imageUrl": "",
|
||||
"imageId": 0
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"supports": {
|
||||
"html": false,
|
||||
"anchor": true,
|
||||
"align": [
|
||||
"wide",
|
||||
"full"
|
||||
]
|
||||
},
|
||||
"textdomain": "company-timeline",
|
||||
"editorScript": "file:./index.js",
|
||||
"editorStyle": "file:./index.css",
|
||||
"style": "file:./style-index.css",
|
||||
"viewScript": "file:./view.js"
|
||||
}
|
||||
219
plugins/carhop-blocks/src/company-timeline/edit.js
Normal file
219
plugins/carhop-blocks/src/company-timeline/edit.js
Normal file
|
|
@ -0,0 +1,219 @@
|
|||
import { __ } from "@wordpress/i18n";
|
||||
|
||||
import {
|
||||
useBlockProps,
|
||||
InspectorControls,
|
||||
MediaUpload,
|
||||
MediaUploadCheck,
|
||||
RichText,
|
||||
} from "@wordpress/block-editor";
|
||||
|
||||
import {
|
||||
PanelBody,
|
||||
Button,
|
||||
TextControl,
|
||||
Card,
|
||||
CardBody,
|
||||
CardHeader,
|
||||
IconButton,
|
||||
} from "@wordpress/components";
|
||||
|
||||
import { useState } from "@wordpress/element";
|
||||
|
||||
import "./editor.scss";
|
||||
|
||||
export default function Edit({ attributes, setAttributes }) {
|
||||
const { entries } = attributes;
|
||||
const [selectedYear, setSelectedYear] = useState(null);
|
||||
|
||||
const addEntry = () => {
|
||||
const newEntries = [
|
||||
...entries,
|
||||
{
|
||||
year: new Date().getFullYear().toString(),
|
||||
title: "",
|
||||
description: "",
|
||||
imageUrl: "",
|
||||
imageId: 0,
|
||||
},
|
||||
];
|
||||
setAttributes({ entries: newEntries });
|
||||
};
|
||||
|
||||
const updateEntry = (index, field, value) => {
|
||||
const newEntries = [...entries];
|
||||
newEntries[index] = {
|
||||
...newEntries[index],
|
||||
[field]: value,
|
||||
};
|
||||
setAttributes({ entries: newEntries });
|
||||
};
|
||||
|
||||
const removeEntry = (index) => {
|
||||
const newEntries = entries.filter((_, i) => i !== index);
|
||||
setAttributes({ entries: newEntries });
|
||||
};
|
||||
|
||||
const sortedEntries = [...entries].sort(
|
||||
(a, b) => parseInt(a.year) - parseInt(b.year)
|
||||
);
|
||||
|
||||
const years = [...new Set(sortedEntries.map((entry) => entry.year))];
|
||||
|
||||
return (
|
||||
<>
|
||||
<InspectorControls>
|
||||
<PanelBody title={__("Timeline Entries", "company-timeline")}>
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={addEntry}
|
||||
style={{ marginBottom: "16px" }}
|
||||
>
|
||||
{__("Add Timeline Entry", "company-timeline")}
|
||||
</Button>
|
||||
|
||||
{sortedEntries.map((entry, index) => {
|
||||
const originalIndex = entries.findIndex(
|
||||
(e) =>
|
||||
e.year === entry.year &&
|
||||
e.title === entry.title &&
|
||||
e.description === entry.description
|
||||
);
|
||||
|
||||
return (
|
||||
<Card key={index} style={{ marginBottom: "12px" }}>
|
||||
<CardHeader>
|
||||
<strong>
|
||||
{entry.year || __("New Entry", "company-timeline")}
|
||||
</strong>
|
||||
</CardHeader>
|
||||
<CardBody>
|
||||
<TextControl
|
||||
label={__("Year", "company-timeline")}
|
||||
value={entry.year}
|
||||
onChange={(value) =>
|
||||
updateEntry(originalIndex, "year", value)
|
||||
}
|
||||
type="number"
|
||||
/>
|
||||
<Button
|
||||
isDestructive
|
||||
onClick={() => removeEntry(originalIndex)}
|
||||
style={{ marginTop: "8px" }}
|
||||
>
|
||||
{__("Remove Entry", "company-timeline")}
|
||||
</Button>
|
||||
</CardBody>
|
||||
</Card>
|
||||
);
|
||||
})}
|
||||
</PanelBody>
|
||||
</InspectorControls>
|
||||
|
||||
<div {...useBlockProps()}>
|
||||
<div className="wp-block-telex-company-timeline">
|
||||
<div className="timeline-sidebar">
|
||||
<div className="timeline-years">
|
||||
<h3>{__("Timeline", "company-timeline")}</h3>
|
||||
{years.map((year) => (
|
||||
<button
|
||||
key={year}
|
||||
className={`year-link ${
|
||||
selectedYear === year ? "active" : ""
|
||||
}`}
|
||||
onClick={() => setSelectedYear(year)}
|
||||
>
|
||||
{year}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="timeline-content">
|
||||
{sortedEntries.map((entry, index) => {
|
||||
const originalIndex = entries.findIndex(
|
||||
(e) =>
|
||||
e.year === entry.year &&
|
||||
e.title === entry.title &&
|
||||
e.description === entry.description
|
||||
);
|
||||
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className="timeline-entry"
|
||||
data-year={entry.year}
|
||||
>
|
||||
<div className="timeline-year-marker">
|
||||
<h2>{entry.year}</h2>
|
||||
</div>
|
||||
|
||||
<div className="timeline-entry-content">
|
||||
<RichText
|
||||
tagName="h3"
|
||||
value={entry.title}
|
||||
onChange={(value) =>
|
||||
updateEntry(originalIndex, "title", value)
|
||||
}
|
||||
placeholder={__(
|
||||
"Enter milestone title...",
|
||||
"company-timeline"
|
||||
)}
|
||||
className="timeline-title"
|
||||
/>
|
||||
|
||||
<RichText
|
||||
tagName="p"
|
||||
value={entry.description}
|
||||
onChange={(value) =>
|
||||
updateEntry(originalIndex, "description", value)
|
||||
}
|
||||
placeholder={__(
|
||||
"Enter milestone description...",
|
||||
"company-timeline"
|
||||
)}
|
||||
className="timeline-description"
|
||||
/>
|
||||
|
||||
<MediaUploadCheck>
|
||||
<MediaUpload
|
||||
onSelect={(media) => {
|
||||
updateEntry(originalIndex, "imageUrl", media.url);
|
||||
updateEntry(originalIndex, "imageId", media.id);
|
||||
}}
|
||||
allowedTypes={["image"]}
|
||||
value={entry.imageId}
|
||||
render={({ open }) => (
|
||||
<div className="timeline-media">
|
||||
{entry.imageUrl ? (
|
||||
<>
|
||||
<img src={entry.imageUrl} alt={entry.title} />
|
||||
<Button
|
||||
isDestructive
|
||||
onClick={() => {
|
||||
updateEntry(originalIndex, "imageUrl", "");
|
||||
updateEntry(originalIndex, "imageId", 0);
|
||||
}}
|
||||
>
|
||||
{__("Remove Image", "company-timeline")}
|
||||
</Button>
|
||||
</>
|
||||
) : (
|
||||
<Button onClick={open} variant="secondary">
|
||||
{__("Add Image", "company-timeline")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
/>
|
||||
</MediaUploadCheck>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
43
plugins/carhop-blocks/src/company-timeline/editor.scss
Normal file
43
plugins/carhop-blocks/src/company-timeline/editor.scss
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
/**
|
||||
* The following styles get applied inside the editor only.
|
||||
*
|
||||
* Replace them with your own styles or remove the file completely.
|
||||
*/
|
||||
|
||||
.wp-block-telex-company-timeline {
|
||||
.timeline-entry-content {
|
||||
.timeline-title,
|
||||
.timeline-description {
|
||||
&:focus {
|
||||
outline: 2px solid #3b82f6;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-media {
|
||||
button {
|
||||
margin-top: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.components-panel__body {
|
||||
.components-card {
|
||||
margin-bottom: 12px;
|
||||
|
||||
.components-card__header {
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
.components-card__body {
|
||||
.components-base-control {
|
||||
margin-bottom: 16px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
39
plugins/carhop-blocks/src/company-timeline/index.js
Normal file
39
plugins/carhop-blocks/src/company-timeline/index.js
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
/**
|
||||
* Registers a new block provided a unique name and an object defining its behavior.
|
||||
*
|
||||
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
|
||||
*/
|
||||
import { registerBlockType } from '@wordpress/blocks';
|
||||
|
||||
/**
|
||||
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
|
||||
* All files containing `style` keyword are bundled together. The code used
|
||||
* gets applied both to the front of your site and to the editor.
|
||||
*
|
||||
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
|
||||
*/
|
||||
import './style.scss';
|
||||
|
||||
/**
|
||||
* Internal dependencies
|
||||
*/
|
||||
import Edit from './edit';
|
||||
import save from './save';
|
||||
import metadata from './block.json';
|
||||
|
||||
/**
|
||||
* Every block starts by registering a new block type definition.
|
||||
*
|
||||
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
|
||||
*/
|
||||
registerBlockType( metadata.name, {
|
||||
/**
|
||||
* @see ./edit.js
|
||||
*/
|
||||
edit: Edit,
|
||||
|
||||
/**
|
||||
* @see ./save.js
|
||||
*/
|
||||
save,
|
||||
} );
|
||||
88
plugins/carhop-blocks/src/company-timeline/save.js
Normal file
88
plugins/carhop-blocks/src/company-timeline/save.js
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
/**
|
||||
* React hook that is used to mark the block wrapper element.
|
||||
* It provides all the necessary props like the class name.
|
||||
*
|
||||
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
|
||||
*/
|
||||
import { useBlockProps, RichText } from '@wordpress/block-editor';
|
||||
|
||||
/**
|
||||
* The save function defines the way in which the different attributes should
|
||||
* be combined into the final markup, which is then serialized by the block
|
||||
* editor into `post_content`.
|
||||
*
|
||||
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#save
|
||||
*
|
||||
* @param {Object} props Block properties
|
||||
* @return {Element} Element to render.
|
||||
*/
|
||||
export default function save( { attributes } ) {
|
||||
const { entries } = attributes;
|
||||
|
||||
const sortedEntries = [ ...entries ].sort( ( a, b ) =>
|
||||
parseInt( a.year ) - parseInt( b.year )
|
||||
);
|
||||
|
||||
const years = [ ...new Set( sortedEntries.map( entry => entry.year ) ) ];
|
||||
|
||||
return (
|
||||
<div { ...useBlockProps.save() }>
|
||||
<div className="wp-block-telex-company-timeline">
|
||||
<div className="timeline-sidebar">
|
||||
<div className="timeline-years">
|
||||
<h3>Timeline</h3>
|
||||
{ years.map( ( year ) => (
|
||||
<a
|
||||
key={ year }
|
||||
href={ `#year-${ year }` }
|
||||
className="year-link"
|
||||
data-year={ year }
|
||||
>
|
||||
{ year }
|
||||
</a>
|
||||
) ) }
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="timeline-content">
|
||||
{ sortedEntries.map( ( entry, index ) => (
|
||||
<div
|
||||
key={ index }
|
||||
className="timeline-entry"
|
||||
id={ `year-${ entry.year }` }
|
||||
data-year={ entry.year }
|
||||
>
|
||||
<div className="timeline-year-marker">
|
||||
<h2>{ entry.year }</h2>
|
||||
</div>
|
||||
|
||||
<div className="timeline-entry-content">
|
||||
{ entry.title && (
|
||||
<RichText.Content
|
||||
tagName="h3"
|
||||
value={ entry.title }
|
||||
className="timeline-title"
|
||||
/>
|
||||
) }
|
||||
|
||||
{ entry.description && (
|
||||
<RichText.Content
|
||||
tagName="p"
|
||||
value={ entry.description }
|
||||
className="timeline-description"
|
||||
/>
|
||||
) }
|
||||
|
||||
{ entry.imageUrl && (
|
||||
<div className="timeline-media">
|
||||
<img src={ entry.imageUrl } alt={ entry.title || '' } />
|
||||
</div>
|
||||
) }
|
||||
</div>
|
||||
</div>
|
||||
) ) }
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
198
plugins/carhop-blocks/src/company-timeline/style.scss
Normal file
198
plugins/carhop-blocks/src/company-timeline/style.scss
Normal file
|
|
@ -0,0 +1,198 @@
|
|||
/**
|
||||
* The following styles get applied both on the front of your site
|
||||
* and in the editor.
|
||||
*
|
||||
* Replace them with your own styles or remove the file completely.
|
||||
*/
|
||||
|
||||
.wp-block-telex-company-timeline {
|
||||
display: flex;
|
||||
gap: 60px;
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 40px 20px;
|
||||
position: relative;
|
||||
|
||||
.timeline-sidebar {
|
||||
flex: 0 0 200px;
|
||||
position: sticky;
|
||||
top: 100px;
|
||||
height: fit-content;
|
||||
align-self: flex-start;
|
||||
|
||||
.timeline-years {
|
||||
background: #f8f9fa;
|
||||
border-radius: 8px;
|
||||
padding: 24px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||
|
||||
h3 {
|
||||
margin: 0 0 20px 0;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
border-bottom: 2px solid #e2e8f0;
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.year-link {
|
||||
display: block;
|
||||
padding: 12px 16px;
|
||||
margin-bottom: 8px;
|
||||
text-decoration: none;
|
||||
color: #64748b;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
border-radius: 6px;
|
||||
transition: all 0.3s ease;
|
||||
cursor: pointer;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
|
||||
&:hover {
|
||||
background: #e2e8f0;
|
||||
color: #1e293b;
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
|
||||
.timeline-entry {
|
||||
margin-bottom: 80px;
|
||||
scroll-margin-top: 100px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.timeline-year-marker {
|
||||
margin-bottom: 24px;
|
||||
position: relative;
|
||||
padding-left: 40px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: #3b82f6;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.2);
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
font-weight: 800;
|
||||
color: #1e293b;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-entry-content {
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
padding: 32px;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
|
||||
border-left: 4px solid #3b82f6;
|
||||
|
||||
.timeline-title {
|
||||
margin: 0 0 16px 0;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
}
|
||||
|
||||
.timeline-description {
|
||||
margin: 0 0 24px 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.8;
|
||||
color: #475569;
|
||||
}
|
||||
|
||||
.timeline-media {
|
||||
margin-top: 24px;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
flex-direction: column;
|
||||
gap: 30px;
|
||||
padding: 20px 15px;
|
||||
|
||||
.timeline-sidebar {
|
||||
position: static;
|
||||
flex: 1;
|
||||
|
||||
.timeline-years {
|
||||
padding: 16px;
|
||||
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.year-link {
|
||||
padding: 10px 12px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-content {
|
||||
.timeline-entry {
|
||||
margin-bottom: 50px;
|
||||
|
||||
.timeline-year-marker {
|
||||
padding-left: 30px;
|
||||
|
||||
&::before {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-entry-content {
|
||||
padding: 20px;
|
||||
|
||||
.timeline-title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.timeline-description {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
67
plugins/carhop-blocks/src/company-timeline/view.js
Normal file
67
plugins/carhop-blocks/src/company-timeline/view.js
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
/**
|
||||
* Use this file for JavaScript code that you want to run in the front-end
|
||||
* on posts/pages that contain this block.
|
||||
*/
|
||||
|
||||
document.addEventListener( 'DOMContentLoaded', function() {
|
||||
const timeline = document.querySelector( '.wp-block-telex-company-timeline' );
|
||||
|
||||
if ( ! timeline ) {
|
||||
return;
|
||||
}
|
||||
|
||||
const sidebar = timeline.querySelector( '.timeline-sidebar' );
|
||||
const yearLinks = timeline.querySelectorAll( '.year-link' );
|
||||
const entries = timeline.querySelectorAll( '.timeline-entry' );
|
||||
|
||||
if ( ! sidebar || yearLinks.length === 0 || entries.length === 0 ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Smooth scroll to year when clicking sidebar link
|
||||
yearLinks.forEach( link => {
|
||||
link.addEventListener( 'click', function( e ) {
|
||||
e.preventDefault();
|
||||
const year = this.getAttribute( 'data-year' ) || this.getAttribute( 'href' ).replace( '#year-', '' );
|
||||
const targetEntry = timeline.querySelector( `[data-year="${ year }"]` );
|
||||
|
||||
if ( targetEntry ) {
|
||||
targetEntry.scrollIntoView( {
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
} );
|
||||
}
|
||||
} );
|
||||
} );
|
||||
|
||||
// Update active year on scroll
|
||||
const observerOptions = {
|
||||
root: null,
|
||||
rootMargin: '-20% 0px -70% 0px',
|
||||
threshold: 0
|
||||
};
|
||||
|
||||
const observerCallback = ( entries ) => {
|
||||
entries.forEach( entry => {
|
||||
if ( entry.isIntersecting ) {
|
||||
const year = entry.target.getAttribute( 'data-year' );
|
||||
|
||||
// Remove active class from all links
|
||||
yearLinks.forEach( link => link.classList.remove( 'active' ) );
|
||||
|
||||
// Add active class to current year
|
||||
const activeLink = timeline.querySelector( `.year-link[data-year="${ year }"]` );
|
||||
if ( activeLink ) {
|
||||
activeLink.classList.add( 'active' );
|
||||
}
|
||||
}
|
||||
} );
|
||||
};
|
||||
|
||||
const observer = new IntersectionObserver( observerCallback, observerOptions );
|
||||
|
||||
// Observe all timeline entries
|
||||
entries.forEach( entry => {
|
||||
observer.observe( entry );
|
||||
} );
|
||||
} );
|
||||
Loading…
Reference in New Issue
Block a user