Eop card browser/m2 eop deck browsing by ayman-art · Pull Request #3181 · OWASP/cornucopia

ayman-art · 2026-07-03T13:00:07Z

Description

Implements deck browsing, card endpoints, copi-identical styling, STRIDE mappings and taxonomy for the Elevation of Privilege (EoP) edition (eop-5.0-en), and links EoP cards in copi games to their cornucopia card pages.
Completes milestone M2 of the EoP Card Browser Project Adding a endpoint for each eop card and to the card browser #1322 (M1: Eop card browser/m1 data scaffolding #3122).

Changes

Feature 1: EoP edition in the Card Browser UI

data/website/phrases/en/cards.json: EoP button, header and description

Feature 2: EoP deck and suit registration

Registered eop 5.0/en; suits in source order (SP, TA, RE, ID, DS, EP), starting with Ace like the other editions.

src/lib/services/deckService.ts, deckServiceConsts.ts, src/domain/suit/suitController.ts
src/domain/suit/order.ts, src/domain/card/order.ts

Feature 3: Card routes for all 78 EoP cards

SP2 is the default card on version switch (as AAI2 for Companion).

src/routes/cards/+page.server.ts, +page.svelte, src/routes/cards/[card]/…
src/routes/edition/[edition]/+page.svelte, edition/[edition]/[card]/… and its [version]/[lang] children (cards_options)

Feature 4: EoP card styling imported from copi

Feature 5: STRIDE mappings component

src/lib/components/eopCardMapping.svelte: renders the stride field
cardPreview.svelte: mappings refactored via a component map so that future editions will require changing one line.

Feature 6: Card taxonomy

Threat Modeling template from M1, Mappings and Attacks sections, same structure as Companion.

src/lib/components/eopCardTaxonomy.svelte, cardFound.svelte (same component-map refactor)
data/website/phrases/en/cards.json: two translation keys

Feature 7: Copi cards link to cornucopia card pages

EoP cards in copi games now show a "Need more info?" link that opens the card's page on cornucopia.owasp.org to help players know more about the card.

priv/repo/cornucopia/eop-cards-5.0-en.yaml, eop-cards-5.1-en.yaml: added url: "https://cornucopia.owasp.org/cards/<id>" to all 78 cards in each file
lib/copi/migrations/card_migration.ex: added update_card_urls/1, which reads a deck yaml and writes the urls onto cards that are already in the database.
priv/repo/migrations/20260711100557_populate_eop_card_urls.exs: new migration to add the urls to cards in database.
lib/copi_web/controllers/card_html/show.html.heex: shows the link on EoP cards that have a url, same as companion

Feature 8: Tests

deckService.test.ts, decService.integration.test.ts: EoP registration covered
Screenshots:

Notes

Ace-first order: all source yamls list the Ace last, but the browser shows Ace first for every edition.
Styling units: kept copi's original vw/clamp() values, so EoP cards define their own size (240–320px) instead of filling their layout slot. That is why EoP cards are smaller than the other editions. Open to editing.
Adding card urls in 5.1 too in copi: copi games always play the latest EoP version (5.1), so urls only in 5.0 would never show up in a game. Both yamls have the same card content, so nothing else changes.

Resolved or fixed issue: none (partial progress on #1322)

AI Tool Disclosure

My contribution does not include any AI-generated content
My contribution includes AI-generated content, as disclosed below:
- AI Tools: [e.g. GitHub CoPilot, ChatGPT, JetBrains Junie etc.]
- LLMs and versions: [e.g. GPT-4.1, Claude Haiku 4.5, Gemini 2.5 Pro etc.]
- Prompts: [Summarize the key prompts or instructions given to the AI tools]

Affirmation

My code follows the CONTRIBUTING.md guidelines

…roller

…as in source files

…witch as a default card

…d its children ([version]/[lang])

…es from copi)

…nt map

… map

Copilot

Pull request overview

This PR adds support for browsing and rendering the “Elevation of Privilege” (EoP) deck in the SvelteKit website (new edition constant, deck loading, UI toggles, taxonomy/mapping rendering, and i18n strings).

Changes:

Add VERSION_EOP and wire EoP (eop, 5.0) into deck/suit loading and existing browsing routes.
Extend card-code validation lists and update ordering/color mappings for new EoP suits/cards.
Introduce EoP-specific UI components (taxonomy + mapping) and extend tests to cover the new deck.

Reviewed changes

Copilot reviewed 21 out of 21 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
cornucopia.owasp.org/src/routes/edition/[edition]/+page.svelte	Adds EoP as a selectable edition and renders its description/suits.
cornucopia.owasp.org/src/routes/edition/[edition]/[card]/+page.svelte	Extends allowed card IDs to include EoP codes and labels edition name for `eop`.
cornucopia.owasp.org/src/routes/edition/[edition]/[card]/[version]/+page.svelte	Extends allowed card IDs to include EoP codes and labels edition name for `eop`.
cornucopia.owasp.org/src/routes/edition/[edition]/[card]/[version]/[lang]/+page.svelte	Extends allowed card IDs to include EoP codes and labels edition name for `eop`.
cornucopia.owasp.org/src/routes/cards/+page.svelte	Adds EoP suits to the cards browser UI, preview selection, and noscript output.
cornucopia.owasp.org/src/routes/cards/+page.server.ts	Loads EoP deck cards server-side and merges into the deck map.
cornucopia.owasp.org/src/routes/cards/[card]/+page.svelte	Extends allowed card IDs to include EoP codes and labels edition name for `eop`.
cornucopia.owasp.org/src/routes/cards/[card]/+page.server.ts	Loads EoP deck cards server-side for per-card pages.
cornucopia.owasp.org/src/lib/services/decService.integration.test.ts	Updates integration expectations for EoP deck presence and total card counts.
cornucopia.owasp.org/src/lib/services/deckServiceConsts.ts	Adds `VERSION_EOP`.
cornucopia.owasp.org/src/lib/services/deckService.ts	Registers EoP deck metadata (latest + available decks).
cornucopia.owasp.org/src/lib/services/deckService.test.ts	Adds unit tests for EoP edition/version/language and adjusts deck counts.
cornucopia.owasp.org/src/lib/components/eopCardTaxonomy.svelte	New: taxonomy display for EoP cards (mappings + attacks).
cornucopia.owasp.org/src/lib/components/eopCardMapping.svelte	New: compact STRIDE mapping renderer for EoP cards in previews.
cornucopia.owasp.org/src/lib/components/cardPreview.svelte	Refactors mapping rendering to support EoP mapping component.
cornucopia.owasp.org/src/lib/components/cardFound.svelte	Refactors taxonomy rendering to support EoP taxonomy component.
cornucopia.owasp.org/src/domain/suit/suitController.ts	Adds EoP deck/language metadata for suit discovery.
cornucopia.owasp.org/src/domain/suit/order.ts	Adds suit ordering for STRIDE suit names.
cornucopia.owasp.org/src/domain/card/order.ts	Adds per-suit ordering for EoP card IDs.
cornucopia.owasp.org/src/domain/card/cardColor.ts	Adds color keys for STRIDE suit names.
cornucopia.owasp.org/data/website/phrases/en/cards.json	Adds EoP copy + i18n keys for button/heading and EoP taxonomy headings.

sydseter · 2026-07-07T07:44:29Z

You have the card texts, and the cards are browsable. No styling is applied, but I guess that is what you are working on next?

…cards in copi

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

ayman-art · 2026-07-10T14:32:51Z

You have the card texts, and the cards are browsable. No styling is applied, but I guess that is what you are working on next?

Yes, styling is imported from copi. I also linked the EoP cards in the Copi game to their card browser pages, so players can click any card to learn more!

Copilot

Pull request overview

Copilot reviewed 26 out of 109 changed files in this pull request and generated 4 comments.

+    const mappingComponents: Record<string, Component<any>> = {
+        mobileapp: MobileAppCardMapping,
+        companion: CompanionCardMapping,
+        eop: EopCardMapping
+    };


+  def update_card_urls(path) do
+    case YamlElixir.read_from_file(path) do
+      {:ok, cards} ->
+        edition = cards["meta"]["edition"]
+        language = cards["meta"]["language"]
+        version = cards["meta"]["version"]
+        for suit <- cards["suits"] do
+          for card <- suit["cards"] do
+            if Map.has_key?(card, "url") do
+              value = to_string(card["value"])
+              existing_card = Repo.get_by(Card, category: suit["name"], value: value, edition: edition, language: language, version: version)
+
+              if existing_card do
+                existing_card
+                |> Ecto.Changeset.change(url: card["url"])
+                |> Repo.update!()
+              end
+            end
+          end
+        end
+    end
+  end


+    update_card_urls(Path.join(:code.priv_dir(:copi), "/repo/cornucopia/eop-cards-5.0-en.yaml"))
+    update_card_urls(Path.join(:code.priv_dir(:copi), "/repo/cornucopia/eop-cards-5.1-en.yaml"))


sydseter · 2026-07-11T07:49:43Z

+      "SPA","SP2","SP3","SP4","SP5","SP6","SP7","SP8","SP9","SPX","SPJ","SPQ","SPK",
+      "TAA","TA2","TA3","TA4","TA5","TA6","TA7","TA8","TA9","TAX","TAJ","TAQ","TAK",
+      "REA","RE2","RE3","RE4","RE5","RE6","RE7","RE8","RE9","REX","REJ","REQ","REK",
+      "IDA","ID2","ID3","ID4","ID5","ID6","ID7","ID8","ID9","IDX","IDJ","IDQ","IDK",
+      "DSA","DS2","DS3","DS4","DS5","DS6","DS7","DS8","DS9","DSX","DSJ","DSQ","DSK",


A duplicate content here. Worth to separate out.

sydseter · 2026-07-10T23:56:47Z

@ayman-art, this is a great start. I would like you to take this a step further. The css for copi.owasp.org was never really in line with the original graphics of the EoP card game. F.ex. We are lacking the numbers in the background on the cards. Which is evident from looking at https://github.com/adamshostack/eop/blob/master/EoP_Card%20Game%20Images.pdf

You should more faithfully try to reproduce the design, as it was initially conceived for the physical cards.
This will lead to some challenges further down the line which could be solved by the idea you proposed as part of your proposal. E.g: How do you make it easier to customise the design for each game presented by the card browser?
This last point is for later.

ayman-art · 2026-07-11T03:14:46Z

@ayman-art, this is a great start. I would like you to take this a step further. The css for copi.owasp.org was never really in line with the original graphics of the EoP card game. F.ex. We are lacking the numbers in the background on the cards. Which is evident from looking at https://github.com/adamshostack/eop/blob/master/EoP_Card%20Game%20Images.pdf

Thanks @sydseter! I'll rework the EoP card styling in this PR to reproduce the original card design as faithfully as possible, focusing on the card sizing and the background numbers that are missing in copi. I'll also keep the CSS structured to make the later customisation work easier.

sydseter · 2026-07-11T07:48:38Z

  end


+  def update_card_urls(path) do


What is the intention behind this new migration method?

What are you trying to do?

Tje existing code alteady handles card migrations.
If you need to import the urls you should simply update the version number of the yaml file.

sydseter · 2026-07-11T07:55:38Z

+
+  def change do
+    update_card_urls(Path.join(:code.priv_dir(:copi), "/repo/cornucopia/eop-cards-5.0-en.yaml"))
+    update_card_urls(Path.join(:code.priv_dir(:copi), "/repo/cornucopia/eop-cards-5.1-en.yaml"))


You are importing the cards twice. Once with v5.0 and once with v5.1. It is worth considering what is happening here. Pay attention to the version number in the meta data in the card yaml file. Does the meta -> version have the correct version number? Is it higher than tje existing number that has been used previously?

You shouldn’t need to import the data twice.

ayman-art added 11 commits July 3, 2026 15:34

updated cards.json to add EoP button, header and description

6555506

registered the EoP deck (version 5.0, en) in deckService and suitCont…

5217ff8

…roller

updated suit/order.ts and card/order.ts to order EoP suits and cards …

09183ce

…as in source files

updated /cards route to browse EoP suits and preview SP2 on version s…

00e0527

…witch as a default card

updated edition/[edition] route to handle the EoP edition

7352fe3

updated cards/[card] route to include EoP cards

fae66d7

added EoP cards to cards_options in edition/[edition]/[card] route an…

104fb24

…d its children ([version]/[lang])

used grey placeholder colors for EoP suits. (To be replaced with styl…

267c0a6

…es from copi)

implemented eopCardMapping and refactored card mappings via a compone…

b6b348e

…nt map

implemented eopCardTaxonomy and refactored taxonomies via a component…

fa287d1

… map

added tests for the EoP edition

f3606fc

sydseter requested a review from Copilot July 3, 2026 15:06

Copilot started reviewing on behalf of sydseter July 3, 2026 15:07 View session

Copilot AI reviewed Jul 3, 2026

View reviewed changes

Comment thread cornucopia.owasp.org/src/lib/components/cardPreview.svelte

Comment thread cornucopia.owasp.org/src/lib/components/cardFound.svelte

ayman-art and others added 11 commits July 8, 2026 17:46

Merge branch 'master' into eop-card-browser/m2-eop-deck-browsing

d71c038

Added Segoe fonts from copi to cornucopia for EoP cards

45a3dbb

Added the EoP png images from copi to cornucopia for EoP cards

d6ced23

Imported css styles from copi to cornucopia for EoP cards

cfef8db

Fixed the double height issue of the card number box on eop cards

fdc9445

Removed the EoP grey placeholder colors after importing the styles

59cdaa2

Added cornucopia card urls to the EoP 5.0 and 5.1 decks in copi.

03e5c30

Added a migration that fills in the cornucopia urls for existing EoP …

db2e56f

…cards in copi

Added the 'Need more info' link to EoP cards in copi

06b1eb7

Updated EoP card order to show the Ace first like the other editions

4543e82

Merge branch 'master' into eop-card-browser/m2-eop-deck-browsing

2fc88b6

ayman-art marked this pull request as ready for review July 9, 2026 04:24

ayman-art requested review from cw-owasp, rewtd and sydseter as code owners July 9, 2026 04:24

ayman-art and others added 3 commits July 9, 2026 07:28

Potential fix for pull request finding

3a6a360

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Potential fix for pull request finding

d795030

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Merge branch 'master' into eop-card-browser/m2-eop-deck-browsing

07f2f39

Merge branch 'master' into eop-card-browser/m2-eop-deck-browsing

1451522

sydseter requested a review from Copilot July 10, 2026 22:51

Copilot started reviewing on behalf of sydseter July 10, 2026 22:51 View session

Copilot AI reviewed Jul 10, 2026

View reviewed changes

Merge branch 'master' into eop-card-browser/m2-eop-deck-browsing

e12e57b

sydseter requested changes Jul 11, 2026

View reviewed changes

sydseter reviewed Jul 11, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Eop card browser/m2 eop deck browsing#3181

Eop card browser/m2 eop deck browsing#3181
ayman-art wants to merge 27 commits into
masterfrom
eop-card-browser/m2-eop-deck-browsing

ayman-art commented Jul 3, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

sydseter commented Jul 7, 2026

Uh oh!

ayman-art commented Jul 10, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

sydseter Jul 11, 2026

Uh oh!

sydseter commented Jul 10, 2026 •

edited

Loading

Uh oh!

ayman-art commented Jul 11, 2026

Uh oh!

sydseter Jul 11, 2026

Uh oh!

sydseter Jul 11, 2026

Uh oh!

sydseter Jul 11, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

		update_card_urls(Path.join(:code.priv_dir(:copi), "/repo/cornucopia/eop-cards-5.0-en.yaml"))
		update_card_urls(Path.join(:code.priv_dir(:copi), "/repo/cornucopia/eop-cards-5.1-en.yaml"))

Uh oh!

Uh oh!

Conversation

ayman-art commented Jul 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Changes

Feature 1: EoP edition in the Card Browser UI

Feature 2: EoP deck and suit registration

Feature 3: Card routes for all 78 EoP cards

Feature 4: EoP card styling imported from copi

Feature 5: STRIDE mappings component

Feature 6: Card taxonomy

Feature 7: Copi cards link to cornucopia card pages

Feature 8: Tests

Notes

AI Tool Disclosure

Affirmation

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

sydseter commented Jul 7, 2026

Uh oh!

ayman-art commented Jul 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

sydseter Jul 11, 2026

Choose a reason for hiding this comment

Uh oh!

sydseter commented Jul 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ayman-art commented Jul 11, 2026

Uh oh!

sydseter Jul 11, 2026

Choose a reason for hiding this comment

Uh oh!

sydseter Jul 11, 2026

Choose a reason for hiding this comment

Uh oh!

sydseter Jul 11, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

ayman-art commented Jul 3, 2026 •

edited

Loading

ayman-art commented Jul 10, 2026 •

edited

Loading

sydseter commented Jul 10, 2026 •

edited

Loading