diff --git a/client/database/BonusCard.js b/client/database/BonusCard.js index cbca06c6..16355390 100644 --- a/client/database/BonusCard.js +++ b/client/database/BonusCard.js @@ -1,6 +1,7 @@ import account from '../scripts/accounts.js'; import { stringifyBonus } from './stringify.js'; import { getBonusPartLabel } from '../scripts/utilities/index.js'; +import Star from './Star.js'; export default function BonusCard({ bonus, highlightedBonus, @@ -90,11 +91,15 @@ export default function BonusCard({ }, /*#__PURE__*/React.createElement("b", { className: "clickable", onClick: clickToCopy - }, bonus.set.name, " | ", bonus.category, " | ", bonus.subcategory, " ", bonus.alternate_subcategory ? ' (' + bonus.alternate_subcategory + ')' : '', " | ", bonus.difficulty), /*#__PURE__*/React.createElement("b", { + }, bonus.set.name, " | ", bonus.category, " | ", bonus.subcategory, " ", bonus.alternate_subcategory ? ' (' + bonus.alternate_subcategory + ')' : '', " | ", bonus.difficulty), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("b", { className: "clickable", "data-bs-toggle": "collapse", "data-bs-target": `#question-${_id}` - }, "Packet ", bonus.packet.number, " | Question ", bonus.number)), /*#__PURE__*/React.createElement("div", { + }, "Packet ", bonus.packet.number, " |"), /*#__PURE__*/React.createElement("span", null, " "), /*#__PURE__*/React.createElement(Star, { + _id: _id, + questionType: "bonus", + initiallyStarred: false + }))), /*#__PURE__*/React.createElement("div", { className: "card-container collapse show", id: `question-${_id}` }, /*#__PURE__*/React.createElement("div", { @@ -102,7 +107,11 @@ export default function BonusCard({ style: { fontSize: `${fontSize}px` } - }, /*#__PURE__*/React.createElement("p", { + }, /*#__PURE__*/React.createElement("span", { + style: { + fontWeight: bonus.leadin.substring(0, 3) === '' ? 'bold' : 'normal' + } + }, bonus.number, ". "), /*#__PURE__*/React.createElement("span", { dangerouslySetInnerHTML: { __html: highlightedBonus.leadin } @@ -123,7 +132,7 @@ export default function BonusCard({ "data-bs-target": "#bonus-stats-modal" }, /*#__PURE__*/React.createElement("small", { className: "text-muted" - }, packetName ? 'Packet ' + packetName : /*#__PURE__*/React.createElement("span", null, "\xA0")), /*#__PURE__*/React.createElement("small", { + }, packetName ? 'Packet ' + packetName + '' : /*#__PURE__*/React.createElement("span", null, "\xA0")), /*#__PURE__*/React.createElement("small", { className: "text-muted float-end" }, /*#__PURE__*/React.createElement("a", { href: "#", diff --git a/client/database/BonusCard.jsx b/client/database/BonusCard.jsx index e3c1128d..d3c3ccc3 100644 --- a/client/database/BonusCard.jsx +++ b/client/database/BonusCard.jsx @@ -1,6 +1,7 @@ import account from '../scripts/accounts.js'; import { stringifyBonus } from './stringify.js'; import { getBonusPartLabel } from '../scripts/utilities/index.js'; +import Star from './Star.js'; export default function BonusCard ({ bonus, highlightedBonus, hideAnswerlines, showCardFooter, fontSize = 16 }) { const _id = bonus._id; @@ -91,13 +92,18 @@ export default function BonusCard ({ bonus, highlightedBonus, hideAnswerlines, s {bonus.set.name} | {bonus.category} | {bonus.subcategory} {bonus.alternate_subcategory ? ' (' + bonus.alternate_subcategory + ')' : ''} | {bonus.difficulty} - - Packet {bonus.packet.number} | Question {bonus.number} - + + + Packet {bonus.packet.number} | + + + +
-

+ ' ? 'bold' : 'normal' }}>{bonus.number}. + {indices.map((i) =>

@@ -116,7 +122,9 @@ export default function BonusCard ({ bonus, highlightedBonus, hideAnswerlines, s )}
- {packetName ? 'Packet ' + packetName :  } + + {packetName ? 'Packet ' + packetName + '' :  } + Report Question diff --git a/client/database/Star.js b/client/database/Star.js new file mode 100644 index 00000000..cbcf97d5 --- /dev/null +++ b/client/database/Star.js @@ -0,0 +1,54 @@ +import star from '../scripts/auth/star.js'; +const starredHTML = /*#__PURE__*/React.createElement("svg", { + xmlns: "http://www.w3.org/2000/svg", + width: "20", + height: "20", + fill: "currentColor", + class: "bi bi-star-fill", + viewBox: "0 0 20 20" +}, /*#__PURE__*/React.createElement("path", { + d: "M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" +})); +const unstarredHTML = /*#__PURE__*/React.createElement("svg", { + xmlns: "http://www.w3.org/2000/svg", + width: "20", + height: "20", + fill: "currentColor", + class: "bi bi-star", + viewBox: "0 0 20 20" +}, /*#__PURE__*/React.createElement("path", { + d: "M2.866 14.85c-.078.444.36.791.746.593l4.39-2.256 4.389 2.256c.386.198.824-.149.746-.592l-.83-4.73 3.522-3.356c.33-.314.16-.888-.282-.95l-4.898-.696L8.465.792a.513.513 0 0 0-.927 0L5.354 5.12l-4.898.696c-.441.062-.612.636-.283.95l3.523 3.356-.83 4.73zm4.905-2.767-3.686 1.894.694-3.957a.565.565 0 0 0-.163-.505L1.71 6.745l4.052-.576a.525.525 0 0 0 .393-.288L8 2.223l1.847 3.658a.525.525 0 0 0 .393.288l4.052.575-2.906 2.77a.565.565 0 0 0-.163.506l.694 3.957-3.686-1.894a.503.503 0 0 0-.461 0z" +})); +export default function Star({ + _id, + questionType, + initiallyStarred +}) { + const [starred, setStarred] = React.useState(initiallyStarred); + async function onClick(event) { + event.preventDefault(); + event.stopPropagation(); + let successful = false; + if (starred) { + if (questionType === 'tossup') { + successful = await star.unstarTossup(_id); + } else { + successful = await star.unstarBonus(_id); + } + } else { + if (questionType === 'tossup') { + successful = await star.starTossup(_id); + } else { + successful = await star.starBonus(_id); + } + } + if (successful) { + setStarred(!starred); + } + } + return /*#__PURE__*/React.createElement("a", { + href: "#", + id: `star-${_id}`, + onClick: onClick + }, starred ? starredHTML : unstarredHTML); +} \ No newline at end of file diff --git a/client/database/Star.jsx b/client/database/Star.jsx new file mode 100644 index 00000000..0237277c --- /dev/null +++ b/client/database/Star.jsx @@ -0,0 +1,44 @@ +import star from '../scripts/auth/star.js'; + +const starredHTML = ( + + + +); +const unstarredHTML = ( + + + +); + +export default function Star ({ _id, questionType, initiallyStarred }) { + const [starred, setStarred] = React.useState(initiallyStarred); + + async function onClick (event) { + event.preventDefault(); + event.stopPropagation(); + let successful = false; + if (starred) { + if (questionType === 'tossup') { + successful = await star.unstarTossup(_id); + } else { + successful = await star.unstarBonus(_id); + } + } else { + if (questionType === 'tossup') { + successful = await star.starTossup(_id); + } else { + successful = await star.starBonus(_id); + } + } + if (successful) { + setStarred(!starred); + } + } + + return ( + + {starred ? starredHTML : unstarredHTML} + + ); +} diff --git a/client/database/TossupCard.js b/client/database/TossupCard.js index ebcdaed1..8c37a9bd 100644 --- a/client/database/TossupCard.js +++ b/client/database/TossupCard.js @@ -1,5 +1,6 @@ import account from '../scripts/accounts.js'; import { stringifyTossup } from './stringify.js'; +import Star from './Star.js'; export default function TossupCard({ tossup, highlightedTossup, @@ -85,11 +86,15 @@ export default function TossupCard({ }, /*#__PURE__*/React.createElement("b", { className: "clickable", onClick: clickToCopy - }, tossup.set.name, " | ", tossup.category, " | ", tossup.subcategory, " ", tossup.alternate_subcategory ? ' (' + tossup.alternate_subcategory + ')' : '', " | ", tossup.difficulty), /*#__PURE__*/React.createElement("b", { + }, tossup.set.name, " | ", tossup.category, " | ", tossup.subcategory, " ", tossup.alternate_subcategory ? ' (' + tossup.alternate_subcategory + ')' : '', " | ", tossup.difficulty), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("b", { className: "clickable", "data-bs-toggle": "collapse", "data-bs-target": `#question-${_id}` - }, "Packet ", tossup.packet.number, " | Question ", tossup.number)), /*#__PURE__*/React.createElement("div", { + }, "Packet ", tossup.packet.number, " |"), /*#__PURE__*/React.createElement("span", null, " "), /*#__PURE__*/React.createElement(Star, { + _id: _id, + questionType: "tossup", + initiallyStarred: false + }))), /*#__PURE__*/React.createElement("div", { className: "card-container collapse show", id: `question-${_id}` }, /*#__PURE__*/React.createElement("div", { @@ -98,6 +103,10 @@ export default function TossupCard({ fontSize: `${fontSize}px` } }, /*#__PURE__*/React.createElement("span", { + style: { + fontWeight: tossup.question.substring(0, 3) === '' ? 'bold' : 'normal' + } + }, tossup.number, ". "), /*#__PURE__*/React.createElement("span", { dangerouslySetInnerHTML: { __html: highlightedTossup.question } @@ -114,7 +123,7 @@ export default function TossupCard({ "data-bs-target": "#tossup-stats-modal" }, /*#__PURE__*/React.createElement("small", { className: "text-muted" - }, packetName ? 'Packet ' + packetName : /*#__PURE__*/React.createElement("span", null, "\xA0")), /*#__PURE__*/React.createElement("small", { + }, packetName ? 'Packet ' + packetName + '' : /*#__PURE__*/React.createElement("span", null, "\xA0")), /*#__PURE__*/React.createElement("small", { className: "text-muted float-end" }, /*#__PURE__*/React.createElement("a", { href: "#", diff --git a/client/database/TossupCard.jsx b/client/database/TossupCard.jsx index 02b7a876..2954c68a 100644 --- a/client/database/TossupCard.jsx +++ b/client/database/TossupCard.jsx @@ -1,5 +1,6 @@ import account from '../scripts/accounts.js'; import { stringifyTossup } from './stringify.js'; +import Star from './Star.js'; export default function TossupCard ({ tossup, highlightedTossup, hideAnswerline, showCardFooter, fontSize = 16 }) { const _id = tossup._id; @@ -85,12 +86,17 @@ export default function TossupCard ({ tossup, highlightedTossup, hideAnswerline, {tossup.set.name} | {tossup.category} | {tossup.subcategory} {tossup.alternate_subcategory ? ' (' + tossup.alternate_subcategory + ')' : ''} | {tossup.difficulty} - - Packet {tossup.packet.number} | Question {tossup.number} - + + + Packet {tossup.packet.number} | + + + +
+ ' ? 'bold' : 'normal' }}>{tossup.number}.
@@ -98,7 +104,9 @@ export default function TossupCard ({ tossup, highlightedTossup, hideAnswerline,
- {packetName ? 'Packet ' + packetName :  } + + {packetName ? 'Packet ' + packetName + '' :  } + Report Question diff --git a/client/database/index.html b/client/database/index.html index de028efb..95f497eb 100644 --- a/client/database/index.html +++ b/client/database/index.html @@ -65,6 +65,14 @@
+
+ +

diff --git a/client/scripts/auth/star.js b/client/scripts/auth/star.js index d925ee2a..25b1ab00 100644 --- a/client/scripts/auth/star.js +++ b/client/scripts/auth/star.js @@ -39,8 +39,8 @@ export default class star { }); } - static unstarBonus (bonusId) { - fetch('/auth/stars/unstar-bonus', { + static async unstarBonus (bonusId) { + return fetch('/auth/stars/unstar-bonus', { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ bonus_id: bonusId }) @@ -51,13 +51,15 @@ export default class star { } else if (!response.ok) { window.alert('There was an error unstarring the bonus.'); } + return response.ok; }).catch(_error => { window.alert('There was an error unstarring the bonus.'); + return false; }); } - static unstarTossup (tossupId) { - fetch('/auth/stars/unstar-tossup', { + static async unstarTossup (tossupId) { + return fetch('/auth/stars/unstar-tossup', { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ tossup_id: tossupId }) @@ -68,8 +70,10 @@ export default class star { } else if (!response.ok) { window.alert('There was an error unstarring the bonus.'); } + return response.ok; }).catch(_error => { window.alert('There was an error unstarring the bonus.'); + return false; }); } diff --git a/package.json b/package.json index a6367a70..0662c8d3 100644 --- a/package.json +++ b/package.json @@ -58,7 +58,9 @@ "ignore": [ "client/bootstrap/*", "client/admin/category-reports.js", - "client/database/index.js" + "client/database/index.js", + "client/database/BonusCard.js", + "client/database/TossupCard.js" ] } }