Skip to content

Commit

Permalink
clean up Array.from in codebase (closes MozillaFoundation#3109)
Browse files Browse the repository at this point in the history
  • Loading branch information
@kgeorgiou
kgeorgiou committed Sep 30, 2019
1 parent 183011f commit 4865a05
Show file tree
Hide file tree
Showing 5 changed files with 105 additions and 125 deletions.
2 changes: 1 addition & 1 deletion network-api/networkapi/wagtailpages/static/js/directory-listing-filters.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@
* associated year (for now)
*/
function bindEventsToLabels() {
let labels = Array.from(filters);
const labels = filters;
labels.forEach(label => {
label.addEventListener("click", evt => {
// the label text content is, itself, the filter:
Expand Down
209 changes: 97 additions & 112 deletions source/js/buyers-guide/bg-main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,28 +73,25 @@ let main = {
let productName = productBox
? productBox.textContent
: `unknown product`;
let criteriaWithHelp = document.querySelectorAll(
const criteriaWithHelp = document.querySelectorAll(
`.criterion button.toggle`
);

if (criteriaWithHelp.length > 0) {
Array.from(criteriaWithHelp).forEach(button => {
let help = button.closest(`.criterion`).querySelector(`.helptext`);

button.addEventListener(`click`, () => {
button.classList.toggle(`open`);
help.classList.toggle(`open`);

if (help.classList.contains(`open`)) {
ReactGA.event({
category: `product`,
action: `expand accordion tap`,
label: `detail view on ${productName}`
});
}
});
criteriaWithHelp.forEach(button => {
let help = button.closest(`.criterion`).querySelector(`.helptext`);

button.addEventListener(`click`, () => {
button.classList.toggle(`open`);
help.classList.toggle(`open`);

if (help.classList.contains(`open`)) {
ReactGA.event({
category: `product`,
action: `expand accordion tap`,
label: `detail view on ${productName}`
});
}
});
}
});
}

// Record that we're done, when we're really done.
Expand All @@ -116,114 +113,102 @@ let main = {
},

enableCopyLinks() {
if (document.querySelectorAll(`.copy-link`)) {
Array.from(document.querySelectorAll(`.copy-link`)).forEach(element => {
element.addEventListener(`click`, event => {
event.preventDefault();
const copyLinks = document.querySelectorAll(`.copy-link`)
copyLinks.forEach(element => {
element.addEventListener(`click`, event => {
event.preventDefault();

let productBox = document.querySelector(
`.product-detail .h1-heading`
);
let productTitle = productBox
? productBox.textContent
: `unknown product`;

ReactGA.event({
category: `product`,
action: `copy link tap`,
label: `copy link ${productTitle}`
});
let productBox = document.querySelector(
`.product-detail .h1-heading`
);
let productTitle = productBox
? productBox.textContent
: `unknown product`;

copyToClipboard(event.target, window.location.href);
ReactGA.event({
category: `product`,
action: `copy link tap`,
label: `copy link ${productTitle}`
});

copyToClipboard(event.target, window.location.href);
});
}
});
},

// Embed various React components based on the existence of containers within the current page
injectReactComponents() {
let creepVoteTargets = document.querySelectorAll(`.creep-vote-target`);

if (creepVoteTargets.length > 0) {
Array.from(creepVoteTargets).forEach(element => {
let csrf = element.querySelector(`input[name=csrfmiddlewaretoken]`);
let productName = element.dataset.productName;
let productID = element.querySelector(`input[name=productID]`).value;
let votes = element.querySelector(`input[name=votes]`).value;

try {
votes = JSON.parse(votes.replace(/'/g, `"`));
} catch (e) {
votes = {
creepiness: {
average: 50,
vote_breakdown: { "0": 0, "1": 0, "2": 0, "3": 0, "4": 0 }
},
confidence: { "0": 0, "1": 0 }
};
}
const creepVoteTargets = document.querySelectorAll(`.creep-vote-target`);
creepVoteTargets.forEach(element => {
let csrf = element.querySelector(`input[name=csrfmiddlewaretoken]`);
let productName = element.dataset.productName;
let productID = element.querySelector(`input[name=productID]`).value;
let votes = element.querySelector(`input[name=votes]`).value;

try {
votes = JSON.parse(votes.replace(/'/g, `"`));
} catch (e) {
votes = {
creepiness: {
average: 50,
vote_breakdown: { "0": 0, "1": 0, "2": 0, "3": 0, "4": 0 }
},
confidence: { "0": 0, "1": 0 }
};
}

apps.push(
new Promise(resolve => {
ReactDOM.render(
<CreepVote
csrf={csrf.value}
productName={productName}
productID={parseInt(productID, 10)}
votes={votes}
whenLoaded={() => resolve()}
/>,
element
);
})
);
});
}

let creepometerTargets = document.querySelectorAll(`.creepometer-target`);

if (creepometerTargets.length > 0) {
Array.from(creepometerTargets).forEach(element => {
let initialValue = element.dataset.initialValue;

apps.push(
new Promise(resolve => {
ReactDOM.render(
<Creepometer
initialValue={initialValue}
whenLoaded={() => resolve()}
/>,
element
);
})
);
});
}
apps.push(
new Promise(resolve => {
ReactDOM.render(
<CreepVote
csrf={csrf.value}
productName={productName}
productID={parseInt(productID, 10)}
votes={votes}
whenLoaded={() => resolve()}
/>,
element
);
})
);
});

if (document.querySelectorAll(`.join-us`)) {
var elements = Array.from(document.querySelectorAll(`.join-us`));
const creepometerTargets = document.querySelectorAll(`.creepometer-target`);
creepometerTargets.forEach(element => {
let initialValue = element.dataset.initialValue;

apps.push(
new Promise(resolve => {
ReactDOM.render(
<Creepometer
initialValue={initialValue}
whenLoaded={() => resolve()}
/>,
element
);
})
);
});

if (elements.length) {
elements.forEach(element => {
var props = element.dataset;
const elements = document.querySelectorAll(`.join-us`);
elements.forEach(element => {
var props = element.dataset;

props.apiUrl = `${networkSiteURL}/api/campaign/signups/${props.signupId ||
0}/`;
props.apiUrl = `${networkSiteURL}/api/campaign/signups/${props.signupId ||
0}/`;

props.csrfToken = props.csrfToken || csrfToken;
props.isHidden = false;
props.csrfToken = props.csrfToken || csrfToken;
props.isHidden = false;

apps.push(
new Promise(resolve => {
ReactDOM.render(
<JoinUs {...props} whenLoaded={() => resolve()} />,
element
);
})
apps.push(
new Promise(resolve => {
ReactDOM.render(
<JoinUs {...props} whenLoaded={() => resolve()} />,
element
);
});
}
}
})
);
});
}
};

Expand Down
2 changes: 1 addition & 1 deletion source/js/buyers-guide/components/filter/filter.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -272,7 +272,7 @@ export default class Filter extends React.Component {
let minC = this.state.creepinessMin,
maxC = this.state.creepinessMax,
like = this.state.likelihood,
all = Array.from(document.querySelectorAll(`.${CLASS_PRODUCT_BOX}`));
all = document.querySelectorAll(`.${CLASS_PRODUCT_BOX}`);

all.forEach(productBox => {
let c = parseInt(productBox.dataset.creepiness, 10);
Expand Down
2 changes: 1 addition & 1 deletion source/js/buyers-guide/homepage-c-slider.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export default {
`scroll`,
() => {
// Figure out which face to show while scrolling:
let visible = Array.from(products).filter(v => {
let visible = products.filter(v => {
return isElementInViewport(v) && !v.classList.contains(`d-none`);
});

Expand Down
15 changes: 5 additions & 10 deletions source/js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -280,16 +280,14 @@ let main = {
);
});

// petition elements
var petitionElements = Array.from(
document.querySelectorAll(`.sign-petition`)
);
var subscribed = false;

if (window.location.search.indexOf(`subscribed=1`) !== -1) {
subscribed = true;
}


// petition elements
const petitionElements = document.querySelectorAll(`.sign-petition`)
petitionElements.forEach(element => {
var props = element.dataset;

Expand Down Expand Up @@ -352,10 +350,7 @@ let main = {
}

// Pulse project lists
let pulseProjectList = Array.from(
document.querySelectorAll(`.pulse-project-list`)
);

const pulseProjectList = document.querySelectorAll(`.pulse-project-list`)
pulseProjectList.forEach(target => {
apps.push(
new Promise(resolve => {
Expand Down

0 comments on commit 4865a05

Please sign in to comment.