mapleopentech/monorepo
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added additional plugins

Browse source
This commit is contained in:
Rodolfo Martinez 2025-12-12 19:05:48 -05:00
parent c85895d306
commit 00e60ec1b7
132 changed files with 27514 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

719
native/wordpress/ticket-tailor-wp-max/assets/js/blocks.js Normal file
View file

@ -0,0 +1,719 @@
/**
* Ticket Tailor Gutenberg Blocks
* Enhanced with full-width control and dynamic columns
*/
(function (wp) {
const { registerBlockType } = wp.blocks;
const { InspectorControls, BlockControls, AlignmentToolbar } = wp.blockEditor;
const { PanelBody, TextControl, ToggleControl, SelectControl, RangeControl } =
wp.components;
const { __ } = wp.i18n;
const { createElement: el, Fragment } = wp.element;
// Block 1: Event Widget (Original)
registerBlockType("ticket-tailor/event-widget", {
title: __("Ticket Tailor Event Widget", "ticket-tailor"),
description: __("Embed a Ticket Tailor event widget", "ticket-tailor"),
icon: "tickets-alt",
category: "embed",
keywords: [
__("ticket", "ticket-tailor"),
__("event", "ticket-tailor"),
__("ticketing", "ticket-tailor"),
],
supports: {
align: ["wide", "full"],
},
attributes: {
url: { type: "string", default: "" },
minimal: { type: "boolean", default: false },
bgFill: { type: "boolean", default: true },
showLogo: { type: "boolean", default: true },
ref: { type: "string", default: "website_widget" },
},
edit: function (props) {
const { attributes, setAttributes } = props;
const { url, minimal, bgFill, showLogo, ref } = attributes;
return el(
Fragment,
{},
el(
InspectorControls,
{},
el(
PanelBody,
{
title: __("Widget Settings", "ticket-tailor"),
initialOpen: true,
},
el(ToggleControl, {
label: __("Minimal Design", "ticket-tailor"),
checked: minimal,
onChange: (value) => setAttributes({ minimal: value }),
}),
el(ToggleControl, {
label: __("Background Fill", "ticket-tailor"),
checked: bgFill,
onChange: (value) => setAttributes({ bgFill: value }),
}),
el(ToggleControl, {
label: __("Show Logo", "ticket-tailor"),
checked: showLogo,
onChange: (value) => setAttributes({ showLogo: value }),
}),
el(TextControl, {
label: __("Tracking Reference", "ticket-tailor"),
value: ref,
onChange: (value) => setAttributes({ ref: value }),
}),
),
),
el(
"div",
{
className: "tt-block-placeholder",
style: {
border: "2px dashed #ccc",
padding: "40px",
textAlign: "center",
background: "#f9f9f9",
},
},
el("span", {
className: "dashicons dashicons-tickets-alt",
style: { fontSize: "48px", color: "#666" },
}),
!url
? el(
"div",
{},
el(
"p",
{ style: { marginBottom: "15px" } },
__("Ticket Tailor Event Widget", "ticket-tailor"),
),
el(TextControl, {
label: __("Event URL", "ticket-tailor"),
placeholder: "https://www.tickettailor.com/events/...",
value: url,
onChange: (value) => setAttributes({ url: value }),
}),
)
: el(
"div",
{},
el("p", {}, __("Widget URL configured", "ticket-tailor")),
el(
"button",
{
className: "button",
onClick: () => setAttributes({ url: "" }),
},
__("Change URL", "ticket-tailor"),
),
),
),
);
},
save: function () {
return null;
},
});
// Block 2: Event Listing - ENHANCED WITH FULL WIDTH OPTIONS
registerBlockType("ticket-tailor/event-listing", {
title: __("Event Listing", "ticket-tailor"),
description: __("Display a list of events", "ticket-tailor"),
icon: "calendar-alt",
category: "widgets",
keywords: [
__("events", "ticket-tailor"),
__("listing", "ticket-tailor"),
__("calendar", "ticket-tailor"),
],
supports: {
align: ["wide", "full"],
customClassName: true,
},
attributes: {
limit: { type: "number", default: 10 },
layout: { type: "string", default: "grid" },
columns: { type: "number", default: 3 },
columnsMode: { type: "string", default: "fixed" }, // 'fixed' or 'responsive'
showPast: { type: "boolean", default: false },
showImage: { type: "boolean", default: true },
imageType: { type: "string", default: "header" },
fullWidth: { type: "boolean", default: true },
maxCardWidth: { type: "string", default: "none" }, // 'none', 'small', 'medium', 'large'
},
edit: function (props) {
const { attributes, setAttributes, className } = props;
const {
limit,
layout,
columns,
columnsMode,
showPast,
showImage,
imageType,
fullWidth,
maxCardWidth,
} = attributes;
return el(
Fragment,
{},
el(
InspectorControls,
{},
el(
PanelBody,
{
title: __("Layout Settings", "ticket-tailor"),
initialOpen: true,
},
el(SelectControl, {
label: __("Layout", "ticket-tailor"),
value: layout,
options: [
{ label: __("Grid", "ticket-tailor"), value: "grid" },
{ label: __("List", "ticket-tailor"), value: "list" },
],
onChange: (value) => setAttributes({ layout: value }),
}),
layout === "grid" &&
el(
Fragment,
{},
el(SelectControl, {
label: __("Columns Mode", "ticket-tailor"),
value: columnsMode,
options: [
{
label: __("Fixed Columns", "ticket-tailor"),
value: "fixed",
},
{
label: __("Responsive (Auto-fit)", "ticket-tailor"),
value: "responsive",
},
],
onChange: (value) => setAttributes({ columnsMode: value }),
help: __(
"Responsive mode automatically adjusts columns based on available space",
"ticket-tailor",
),
}),
el(RangeControl, {
label:
columnsMode === "fixed"
? __("Number of Columns", "ticket-tailor")
: __("Maximum Columns", "ticket-tailor"),
value: columns,
onChange: (value) => setAttributes({ columns: value }),
min: 1,
max: 5,
help:
columnsMode === "responsive"
? __(
"In responsive mode, columns will adjust automatically but won't exceed this number",
"ticket-tailor",
)
: null,
}),
el(SelectControl, {
label: __("Maximum Card Width", "ticket-tailor"),
value: maxCardWidth,
options: [
{
label: __("No Limit (Full Width)", "ticket-tailor"),
value: "none",
},
{
label: __("Small (300px)", "ticket-tailor"),
value: "small",
},
{
label: __("Medium (400px)", "ticket-tailor"),
value: "medium",
},
{
label: __("Large (500px)", "ticket-tailor"),
value: "large",
},
],
onChange: (value) => setAttributes({ maxCardWidth: value }),
help: __(
"Set a maximum width for individual event cards",
"ticket-tailor",
),
}),
),
el(ToggleControl, {
label: __("Full Width Container", "ticket-tailor"),
checked: fullWidth,
onChange: (value) => setAttributes({ fullWidth: value }),
help: __(
"Make the event listing fill the width of its container",
"ticket-tailor",
),
}),
),
el(
PanelBody,
{
title: __("Display Settings", "ticket-tailor"),
initialOpen: false,
},
el(RangeControl, {
label: __("Number of Events", "ticket-tailor"),
value: limit,
onChange: (value) => setAttributes({ limit: value }),
min: 1,
max: 50,
}),
el(ToggleControl, {
label: __("Show Past Events", "ticket-tailor"),
checked: showPast,
onChange: (value) => setAttributes({ showPast: value }),
}),
el(ToggleControl, {
label: __("Show Event Images", "ticket-tailor"),
checked: showImage,
onChange: (value) => setAttributes({ showImage: value }),
}),
showImage &&
el(SelectControl, {
label: __("Image Type", "ticket-tailor"),
value: imageType,
options: [
{
label: __("Thumbnail (Square)", "ticket-tailor"),
value: "thumbnail",
},
{
label: __("Banner (16:9)", "ticket-tailor"),
value: "header",
},
],
onChange: (value) => setAttributes({ imageType: value }),
}),
),
),
el(
"div",
{
className: "tt-block-placeholder",
style: {
border: "2px dashed #ccc",
padding: "40px",
textAlign: "center",
background: "#f9f9f9",
width: fullWidth ? "100%" : "auto",
},
},
el("span", {
className: "dashicons dashicons-calendar-alt",
style: { fontSize: "48px", color: "#666" },
}),
el(
"p",
{
style: {
fontSize: "16px",
fontWeight: "bold",
marginBottom: "10px",
},
},
__("Event Listing", "ticket-tailor"),
),
el(
"p",
{ style: { fontSize: "14px", color: "#666" } },
__("Showing ", "ticket-tailor") +
limit +
__(" events", "ticket-tailor"),
),
el(
"p",
{ style: { fontSize: "13px", color: "#888", marginTop: "10px" } },
layout === "grid"
? columnsMode === "responsive"
? __("Responsive grid with max ", "ticket-tailor") +
columns +
__(" columns", "ticket-tailor")
: columns + __(" column grid", "ticket-tailor")
: __("List layout", "ticket-tailor"),
),
fullWidth &&
el(
"p",
{
style: { fontSize: "12px", color: "#2271b1", marginTop: "5px" },
},
__("✓ Full width enabled", "ticket-tailor"),
),
),
);
},
save: function () {
return null;
},
});
// Block 3: Single Event - ENHANCED WITH WIDTH OPTIONS
registerBlockType("ticket-tailor/single-event", {
title: __("Single Event", "ticket-tailor"),
description: __("Display a specific event", "ticket-tailor"),
icon: "megaphone",
category: "widgets",
keywords: [
__("event", "ticket-tailor"),
__("single", "ticket-tailor"),
__("detail", "ticket-tailor"),
],
supports: {
align: ["wide", "full"],
},
attributes: {
eventId: { type: "string", default: "" },
showDescription: { type: "boolean", default: true },
showTickets: { type: "boolean", default: true },
showImage: { type: "boolean", default: true },
imageType: { type: "string", default: "header" },
fullWidth: { type: "boolean", default: false },
maxWidth: { type: "string", default: "800px" },
},
edit: function (props) {
const { attributes, setAttributes } = props;
const {
eventId,
showDescription,
showTickets,
showImage,
imageType,
fullWidth,
maxWidth,
} = attributes;
const eventOptions =
window.ticketTailorData && window.ticketTailorData.events
? window.ticketTailorData.events
: [{ value: "", label: __("Loading events...", "ticket-tailor") }];
return el(
Fragment,
{},
el(
InspectorControls,
{},
el(
PanelBody,
{ title: __("Event Settings", "ticket-tailor"), initialOpen: true },
el(SelectControl, {
label: __("Select Event", "ticket-tailor"),
value: eventId,
options: [
{ value: "", label: __("Select an event...", "ticket-tailor") },
].concat(eventOptions),
onChange: (value) => setAttributes({ eventId: value }),
}),
el(ToggleControl, {
label: __("Full Width Display", "ticket-tailor"),
checked: fullWidth,
onChange: (value) => setAttributes({ fullWidth: value }),
}),
!fullWidth &&
el(TextControl, {
label: __("Maximum Width", "ticket-tailor"),
value: maxWidth,
onChange: (value) => setAttributes({ maxWidth: value }),
help: __("e.g. 800px, 100%, 60rem", "ticket-tailor"),
}),
el(ToggleControl, {
label: __("Show Event Image", "ticket-tailor"),
checked: showImage,
onChange: (value) => setAttributes({ showImage: value }),
}),
showImage &&
el(SelectControl, {
label: __("Image Type", "ticket-tailor"),
value: imageType,
options: [
{
label: __("Banner (Wide)", "ticket-tailor"),
value: "header",
},
{
label: __("Thumbnail (Square)", "ticket-tailor"),
value: "thumbnail",
},
],
onChange: (value) => setAttributes({ imageType: value }),
}),
el(ToggleControl, {
label: __("Show Description", "ticket-tailor"),
checked: showDescription,
onChange: (value) => setAttributes({ showDescription: value }),
}),
el(ToggleControl, {
label: __("Show Ticket Button", "ticket-tailor"),
checked: showTickets,
onChange: (value) => setAttributes({ showTickets: value }),
}),
),
),
el(
"div",
{
className: "tt-block-placeholder",
style: {
border: "2px dashed #ccc",
padding: "40px",
textAlign: "center",
background: "#f9f9f9",
},
},
el("span", {
className: "dashicons dashicons-megaphone",
style: { fontSize: "48px", color: "#666" },
}),
!eventId
? el(
"p",
{},
__("Please select an event from the sidebar", "ticket-tailor"),
)
: el(
"div",
{},
el("p", {}, __("Single Event Display", "ticket-tailor")),
el(
"p",
{ style: { fontSize: "14px", color: "#666" } },
__("Event ID: ", "ticket-tailor") + eventId,
),
fullWidth &&
el(
"p",
{
style: {
fontSize: "12px",
color: "#2271b1",
marginTop: "5px",
},
},
__("✓ Full width enabled", "ticket-tailor"),
),
),
),
);
},
save: function () {
return null;
},
});
// Block 4: Category Events - ENHANCED
registerBlockType("ticket-tailor/category-events", {
title: __("Category Events", "ticket-tailor"),
description: __("Display events from a specific category", "ticket-tailor"),
icon: "category",
category: "widgets",
keywords: [
__("category", "ticket-tailor"),
__("filter", "ticket-tailor"),
__("events", "ticket-tailor"),
],
supports: {
align: ["wide", "full"],
},
attributes: {
category: { type: "string", default: "" },
limit: { type: "number", default: 10 },
layout: { type: "string", default: "grid" },
columns: { type: "number", default: 3 },
columnsMode: { type: "string", default: "fixed" },
showImage: { type: "boolean", default: true },
imageType: { type: "string", default: "thumbnail" },
fullWidth: { type: "boolean", default: true },
},
edit: function (props) {
const { attributes, setAttributes } = props;
const {
category,
limit,
layout,
columns,
columnsMode,
showImage,
imageType,
fullWidth,
} = attributes;
return el(
Fragment,
{},
el(
InspectorControls,
{},
el(
PanelBody,
{
title: __("Category Settings", "ticket-tailor"),
initialOpen: true,
},
el(TextControl, {
label: __("Category", "ticket-tailor"),
help: __(
"Enter the category name (e.g., Music, Sports, Theatre)",
"ticket-tailor",
),
value: category,
onChange: (value) => setAttributes({ category: value }),
}),
el(RangeControl, {
label: __("Number of Events", "ticket-tailor"),
value: limit,
onChange: (value) => setAttributes({ limit: value }),
min: 1,
max: 50,
}),
el(SelectControl, {
label: __("Layout", "ticket-tailor"),
value: layout,
options: [
{ label: __("Grid", "ticket-tailor"), value: "grid" },
{ label: __("List", "ticket-tailor"), value: "list" },
],
onChange: (value) => setAttributes({ layout: value }),
}),
layout === "grid" &&
el(
Fragment,
{},
el(SelectControl, {
label: __("Columns Mode", "ticket-tailor"),
value: columnsMode,
options: [
{
label: __("Fixed Columns", "ticket-tailor"),
value: "fixed",
},
{
label: __("Responsive (Auto-fit)", "ticket-tailor"),
value: "responsive",
},
],
onChange: (value) => setAttributes({ columnsMode: value }),
}),
el(RangeControl, {
label:
columnsMode === "fixed"
? __("Columns", "ticket-tailor")
: __("Maximum Columns", "ticket-tailor"),
value: columns,
onChange: (value) => setAttributes({ columns: value }),
min: 1,
max: 5,
}),
),
el(ToggleControl, {
label: __("Full Width Container", "ticket-tailor"),
checked: fullWidth,
onChange: (value) => setAttributes({ fullWidth: value }),
}),
el(ToggleControl, {
label: __("Show Event Images", "ticket-tailor"),
checked: showImage,
onChange: (value) => setAttributes({ showImage: value }),
}),
showImage &&
el(SelectControl, {
label: __("Image Type", "ticket-tailor"),
value: imageType,
options: [
{
label: __("Thumbnail (Square)", "ticket-tailor"),
value: "thumbnail",
},
{
label: __("Banner (16:9)", "ticket-tailor"),
value: "header",
},
],
onChange: (value) => setAttributes({ imageType: value }),
}),
),
),
el(
"div",
{
className: "tt-block-placeholder",
style: {
border: "2px dashed #ccc",
padding: "40px",
textAlign: "center",
background: "#f9f9f9",
width: fullWidth ? "100%" : "auto",
},
},
el("span", {
className: "dashicons dashicons-category",
style: { fontSize: "48px", color: "#666" },
}),
!category
? el(
"div",
{},
el(
"p",
{ style: { marginBottom: "15px" } },
__("Category Events Display", "ticket-tailor"),
),
el(
"p",
{ style: { fontSize: "14px", color: "#666" } },
__(
"Enter a category name in the sidebar to display filtered events",
"ticket-tailor",
),
),
)
: el(
"div",
{},
el(
"p",
{ style: { marginBottom: "10px", fontWeight: "bold" } },
__("Category Events: ", "ticket-tailor") + category,
),
el(
"p",
{ style: { fontSize: "14px", color: "#666" } },
__("Showing ", "ticket-tailor") +
limit +
__(" events", "ticket-tailor"),
),
fullWidth &&
el(
"p",
{
style: {
fontSize: "12px",
color: "#2271b1",
marginTop: "5px",
},
},
__("✓ Full width enabled", "ticket-tailor"),
),
),
),
);
},
save: function () {
return null;
},
});
})(window.wp);