Skip to content

Commit

Permalink
refactorin
Browse files Browse the repository at this point in the history
  • Loading branch information
Chris Nelson committed Sep 19, 2024
1 parent 8844373 commit 0c29422
Show file tree
Hide file tree
Showing 7 changed files with 90 additions and 142 deletions.
62 changes: 23 additions & 39 deletions assets/js/phoenix_live_view/hooks.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -221,62 +221,46 @@ Hooks.InfiniteScroll = {
}
}

const serializeEvent = (event) => {
const { detail, target: { dataset } } = event;
return {...detail, ...dataset};
};

Hooks.CustomEvents = {

listeners: [],

serializeEvent(event) {
const { detail, target: { dataset } } = event;
return {...detail, ...dataset};
pushCustomEvent(eventName, phxEvent) {
const attrs = this.el.attributes;
const phxTarget = attrs["phx-target"] && attrs["phx-target"].value;
const pushEvent = phxTarget
? (event, payload, callback) =>
this.pushEventTo(phxTarget, event, payload, callback)
: (event, payload, callback) => this.pushEvent(event, payload, callback);
const listener = (evt) => {
const payload = serializeEvent(evt);
this.el.dispatchEvent(new CustomEvent('phx-event-start', { detail: { name: eventName, payload } }));
pushEvent(phxEvent, payload, e => {
this.el.dispatchEvent(new CustomEvent('phx-event-complete', { detail: { name: eventName, payload } }));
});
};
this.el.addEventListener(eventName, listener);
this.listeners.push({eventName, listener});
},

mounted() {
const sendEvent = (eventName, phxEvent) => {
const attrs = this.el.attributes;
const phxTarget = attrs["phx-target"] && attrs["phx-target"].value;
const pushEvent = phxTarget
? (event, payload, callback) =>
this.pushEventTo(phxTarget, event, payload, callback)
: (event, payload, callback) => this.pushEvent(event, payload, callback);
const listener = (evt) => {
const payload = this.serializeEvent(evt);
this.el.dispatchEvent(new CustomEvent('phx-event-start', { detail: { name: eventName, payload } }));
pushEvent(phxEvent, payload, e => {
this.el.dispatchEvent(new CustomEvent('phx-event-complete', { detail: { name: eventName, payload } }));
});
};
this.el.addEventListener(eventName, listener);
this.listeners.push({eventName, listener});
};

const attrs = this.el.attributes;
for (var i = 0; i < attrs.length; i++) {
if (/^phx-custom-event-/.test(attrs[i].name)) {
const eventName = attrs[i].name.replace("phx-custom-event-", "");
const phxEvent = attrs[i].value;
sendEvent(eventName, phxEvent);
this.pushCustomEvent(eventName, phxEvent);
}
}

if (this.el.getAttribute("phx-send-events")) {
const eventsToSend = this.el.getAttribute("phx-send-events").split(",");
eventsToSend.forEach((eventName) => sendEvent(eventName, eventName));
}

if (this.el.getAttribute("phx-custom-events")) {
const eventsToSend = this.el.getAttribute("phx-custom-events").split(",");
eventsToSend.forEach((eventName) => sendEvent(eventName, eventName));
}

if (this.el.getAttribute("phx-receive-events")) {
const phoenixEvents = this.el
.getAttribute("phx-receive-events")
.split(",");
phoenixEvents.forEach((evt) => {
this.handleEvent(evt, (payload) => {
this.el.dispatchEvent(new CustomEvent(evt, { detail: payload }));
});
});
eventsToSend.forEach((eventName) => this.pushCustomEvent(eventName, eventName));
}
},

Expand Down
50 changes: 19 additions & 31 deletions priv/static/phoenix_live_view.cjs.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions priv/static/phoenix_live_view.cjs.js.map
View file

Large diffs are not rendered by default.

50 changes: 19 additions & 31 deletions priv/static/phoenix_live_view.esm.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions priv/static/phoenix_live_view.esm.js.map
View file

Large diffs are not rendered by default.

50 changes: 19 additions & 31 deletions priv/static/phoenix_live_view.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1603,50 +1603,38 @@ removing illegal node: "${(childNode.outerHTML || childNode.nodeValue).trim()}"
};
}
};
var serializeEvent = (event) => {
const { detail, target: { dataset } } = event;
return __spreadValues(__spreadValues({}, detail), dataset);
};
Hooks.CustomEvents = {
listeners: [],
serializeEvent(event) {
const { detail, target: { dataset } } = event;
return __spreadValues(__spreadValues({}, detail), dataset);
pushCustomEvent(eventName, phxEvent) {
const attrs = this.el.attributes;
const phxTarget = attrs["phx-target"] && attrs["phx-target"].value;
const pushEvent = phxTarget ? (event, payload, callback) => this.pushEventTo(phxTarget, event, payload, callback) : (event, payload, callback) => this.pushEvent(event, payload, callback);
const listener = (evt) => {
const payload = serializeEvent(evt);
this.el.dispatchEvent(new CustomEvent("phx-event-start", { detail: { name: eventName, payload } }));
pushEvent(phxEvent, payload, (e) => {
this.el.dispatchEvent(new CustomEvent("phx-event-complete", { detail: { name: eventName, payload } }));
});
};
this.el.addEventListener(eventName, listener);
this.listeners.push({ eventName, listener });
},
mounted() {
const sendEvent = (eventName, phxEvent) => {
const attrs2 = this.el.attributes;
const phxTarget = attrs2["phx-target"] && attrs2["phx-target"].value;
const pushEvent = phxTarget ? (event, payload, callback) => this.pushEventTo(phxTarget, event, payload, callback) : (event, payload, callback) => this.pushEvent(event, payload, callback);
const listener = (evt) => {
const payload = this.serializeEvent(evt);
this.el.dispatchEvent(new CustomEvent("phx-event-start", { detail: { name: eventName, payload } }));
pushEvent(phxEvent, payload, (e) => {
this.el.dispatchEvent(new CustomEvent("phx-event-complete", { detail: { name: eventName, payload } }));
});
};
this.el.addEventListener(eventName, listener);
this.listeners.push({ eventName, listener });
};
const attrs = this.el.attributes;
for (var i = 0; i < attrs.length; i++) {
if (/^phx-custom-event-/.test(attrs[i].name)) {
const eventName = attrs[i].name.replace("phx-custom-event-", "");
const phxEvent = attrs[i].value;
sendEvent(eventName, phxEvent);
this.pushCustomEvent(eventName, phxEvent);
}
}
if (this.el.getAttribute("phx-send-events")) {
const eventsToSend = this.el.getAttribute("phx-send-events").split(",");
eventsToSend.forEach((eventName) => sendEvent(eventName, eventName));
}
if (this.el.getAttribute("phx-custom-events")) {
const eventsToSend = this.el.getAttribute("phx-custom-events").split(",");
eventsToSend.forEach((eventName) => sendEvent(eventName, eventName));
}
if (this.el.getAttribute("phx-receive-events")) {
const phoenixEvents = this.el.getAttribute("phx-receive-events").split(",");
phoenixEvents.forEach((evt) => {
this.handleEvent(evt, (payload) => {
this.el.dispatchEvent(new CustomEvent(evt, { detail: payload }));
});
});
eventsToSend.forEach((eventName) => this.pushCustomEvent(eventName, eventName));
}
},
destroyed() {
Expand Down
8 changes: 4 additions & 4 deletions priv/static/phoenix_live_view.min.js
View file

Large diffs are not rendered by default.

0 comments on commit 0c29422

Please sign in to comment.