BAM News
Bike-reviews
Ride-out
BAM members
Events
Club
Other news

Resources

-

This is an example list of resources available at IAM (please ensure you are logged into your IAM account before clicking on link):

-Masters Training -to find out more, click here
-Become a Fellow -to find out more about becoming a fellow, click here

/**
 * Advanced Motorcycle Club - Gutenberg Block Editor Code
 * File: resource-blocks.js
 * Description: Custom Gutenberg blocks for the Resources page.
 */

import { registerBlockType } from '@wordpress/blocks';
import { RichText, URLInputButton, MediaUpload, InspectorControls } from '@wordpress/block-editor';
import { PanelBody, Button, TextControl } from '@wordpress/components';
import { Fragment } from '@wordpress/element';

// 1. Featured Authority Links Block
registerBlockType('amc/featured-links', {
    title: 'Featured Authority Links',
    icon: 'admin-links',
    category: 'widgets',
    attributes: {
        items: { type: 'array', default: [
            { icon: '🏍️', title: 'IAM RoadSmart', url: 'https://www.iamroadsmart.com', description: 'Advanced riding techniques and coaching.' },
            { icon: '📋', title: 'DVSA', url: 'https://www.gov.uk/government/organisations/driver-and-vehicle-standards-agency', description: 'Official licensing and regulations.' },
            { icon: '🛡️', title: 'RoSPA', url: 'https://www.rospa.com', description: 'Safety training and accident prevention.' }
        ] },
    },
    edit({ attributes, setAttributes }) {
        const { items } = attributes;
        const updateItem = (value, index, field) => {
            const newItems = items.map((item, i) => i === index ? { ...item, [field]: value } : item);
            setAttributes({ items: newItems });
        };
        return (
            <div className="amc-featured-links">
                {items.map((item, index) => (
                    <div className="amc-link-card" key={index} style={{border: '1px solid #ddd', padding: '1em', marginBottom: '1em'}}>
                        <TextControl
                            label="Icon"
                            value={item.icon}
                            onChange={(val) => updateItem(val, index, 'icon')}
                        />
                        <TextControl
                            label="Title"
                            value={item.title}
                            onChange={(val) => updateItem(val, index, 'title')}
                        />
                        <RichText
                            tagName="p"
                            label="Description"
                            value={item.description}
                            onChange={(val) => updateItem(val, index, 'description')}
                        />
                        <URLInputButton
                            url={item.url}
                            onChange={(url, post) => updateItem(url, index, 'url')}
                        />
                    </div>
                ))}
            </div>
        );
    },
    save({ attributes }) {
        const { items } = attributes;
        return (
            <div className="amc-featured-links grid grid-cols-3 gap-6">
                {items.map((item, index) => (
                    <a href={item.url} className="amc-link-card" key={index}>
                        <div className="icon text-2xl">{item.icon}</div>
                        <h3 className="title font-bold">{item.title}</h3>
                        <p className="description">{item.description}</p>
                        <span className="arrow"></span>
                    </a>
                ))}
            </div>
        );
    },
});

// 2. Downloadables & Guides Block
registerBlockType('amc/downloadables', {
    title: 'Downloadables & Guides',
    icon: 'download',
    category: 'widgets',
    attributes: {
        guides: { type: 'array', default: [
            { title: 'Advanced Rider Handbook', fileUrl: '', label: 'Download PDF' },
            { title: 'Motorcycle Roadcraft', fileUrl: '', label: 'Buy on Amazon' },
            { title: 'Biker Down! Kit', fileUrl: '', label: 'Download' }
        ] },
    },
    edit({ attributes, setAttributes }) {
        const { guides } = attributes;
        const updateGuide = (value, index, field) => {
            const newGuides = guides.map((g, i) => i === index ? { ...g, [field]: value } : g);
            setAttributes({ guides: newGuides });
        };
        return (
            <div className="amc-downloadables two-column">
                {guides.map((guide, index) => (
                    <div key={index} style={{border: '1px solid #ccc', padding: '1em', marginBottom: '1em'}}>
                        <TextControl
                            label="Title"
                            value={guide.title}
                            onChange={(val) => updateGuide(val, index, 'title')}
                        />
                        <TextControl
                            label="Button Label"
                            value={guide.label}
                            onChange={(val) => updateGuide(val, index, 'label')}
                        />
                        <URLInputButton
                            url={guide.fileUrl}
                            onChange={(url) => updateGuide(url, index, 'fileUrl')}
                        />
                    </div>
                ))}
            </div>
        );
    },
    save({ attributes }) {
        const { guides } = attributes;
        return (
            <div className="amc-downloadables grid grid-cols-2 gap-6">
                {guides.map((guide, index) => (
                    <div key={index} className="guide-card">
                        <h4>{guide.title}</h4>
                        <a href={guide.fileUrl} className="button inline-block mt-2">{guide.label}</a>
                    </div>
                ))}
            </div>
        );
    },
});

// More blocks (Training, Tools, Chapters) can follow a similar pattern...