From de856ea6b0c2bba1bd4c660e1dcd8947609248f9 Mon Sep 17 00:00:00 2001 From: Mark Street Date: Sun, 26 Nov 2023 20:12:06 +0000 Subject: [PATCH 1/8] Add FAQ --- frontend/src/app/(navfooter)/faq/page.tsx | 84 +++++++++++++++++++++++ frontend/src/components/Footer.tsx | 4 ++ 2 files changed, 88 insertions(+) create mode 100644 frontend/src/app/(navfooter)/faq/page.tsx diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx new file mode 100644 index 000000000..00c31c556 --- /dev/null +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -0,0 +1,84 @@ +import Link from "next/link" + +import Frog from "../../../components/Nav/frog.svg" + +const subtitle = "mt-8 text-xl font-semibold tracking-tight text-gray-11" + +export const metadata = { + title: "Frequently Asked Questions", +} + +function FaqLink({children, href}: { children: ReactNode, href?: string }) { + return + {children} + +} + +export default function Page() { + return
+

+ Frequently Asked Questions +

+ +

What is decomp.me?

+

+ decomp.me is a platform that allows users to upload assembly code snippets and write code in an attempt to match them, all within their browser. +

+

+ It is an open source project run by volunteers in their free time. +

+ +

What do you mean by 'match them'?

+

+ decomp.me is designed for users who are working on matching decompilation projects, where the goal is to write high level (e.g. C or C++) code that, when compiled, matches the original binary perfectly. +

+

+ This is a time and labour intensive process and requires the correct compiler, assembler, with correct options selected in addition to the correct code! +

+ +

What's a 'scratch'?

+

+ A 'scratch' consists of the target assembly, input source code, and input context code. + Most scratches contain a single function - i.e. the function that you are trying to match. + Each scratch has a unique link that can be shared. +

+ +

What's the 'context' for?

+

+ The context is a separate section of code that is passed to the decompiler when your target assembly is uploaded. + It's used to give context to the decompiler, for example adding variables, struct definitions, function signatures and type definitions. +

+ +

How does decomp.me work?

+

+ The code from your scratch is submitted to the decomp.me server where it is compiled, objdump'ed and then compared against the target assembly. + As you modify your code in the editor, the changes will be sent to the backend and compiled, so you'll see the results of your change in near real-time. +

+ +

Where do I start?

+

+ You can work on existing scratches on the site, if you make progress you can save your scratch which will result in a 'fork' of the original. + If you match the scratch, the original scratch will display a banner to notify visitors that the code is matched. +

+

+ If you want to start your own scratch you will need the assembly code for a the function you are targetting in GNU assembly format. +

+ +

Can you add 'X' platform? e.g. PlayStation 3

+

+ The platforms that decomp.me supports are driven by the support for those platforms in the underlying tools that make up decomp.me. + If these tools support the architecture for the new platform, and you have the compiler available, it is a straightforward process to add it to decomp.me. +

+ +

How do I report bugs?

+

+ If you come across a bug, please reach out to us on our Discord server and/or raise a GitHub issue containing the steps necessary to replicate the bug. +

+ +

Why frog?

+

+ +

+ +
+} diff --git a/frontend/src/components/Footer.tsx b/frontend/src/components/Footer.tsx index e14d51eb8..0066f59bd 100644 --- a/frontend/src/components/Footer.tsx +++ b/frontend/src/components/Footer.tsx @@ -31,6 +31,10 @@ export default function Footer() { Credits + + FAQ + + Source code From a3247a4c950b22ef3811cde8ad6b939ee5dcb4aa Mon Sep 17 00:00:00 2001 From: Ethan Roseman Date: Tue, 28 Nov 2023 17:57:49 +0900 Subject: [PATCH 2/8] eth changes --- backend/libraries/download.py | 4 +-- frontend/src/app/(navfooter)/faq/page.tsx | 38 ++++++++++++++++------- 2 files changed, 28 insertions(+), 14 deletions(-) diff --git a/backend/libraries/download.py b/backend/libraries/download.py index 5160fed27..31cd07529 100755 --- a/backend/libraries/download.py +++ b/backend/libraries/download.py @@ -103,7 +103,7 @@ def download_libraries(args, libraries_config): libraries_downloaded = len(list(filter(lambda x: x, results))) logger.info( - "Updated %i / %i compiler(s) in %.2f second(s)", + "Updated %i / %i libraries in %.2f second(s)", libraries_downloaded, len(to_download), (end - start).total_seconds(), @@ -114,7 +114,7 @@ def main(): parser = argparse.ArgumentParser() parser.add_argument( "--force", - help="Force (re)downloading of compilers", + help="Force (re)downloading of libraries", action="store_true", ) parser.add_argument( diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index 00c31c556..7d938a8a5 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -8,7 +8,7 @@ export const metadata = { title: "Frequently Asked Questions", } -function FaqLink({children, href}: { children: ReactNode, href?: string }) { +function FaqLink({ children, href }: { children: ReactNode, href?: string }) { return {children} @@ -22,7 +22,7 @@ export default function Page() {

What is decomp.me?

- decomp.me is a platform that allows users to upload assembly code snippets and write code in an attempt to match them, all within their browser. + decomp.me is a platform that allows people to upload assembly code snippets and write code in an attempt to match them, all within their browser.

It is an open source project run by volunteers in their free time. @@ -33,35 +33,49 @@ export default function Page() { decomp.me is designed for users who are working on matching decompilation projects, where the goal is to write high level (e.g. C or C++) code that, when compiled, matches the original binary perfectly.

- This is a time and labour intensive process and requires the correct compiler, assembler, with correct options selected in addition to the correct code! + This is a time and labor-intensive process. To produce matching assembly, one usually needs the original compiler, assembler, and flags that were used to produce the original binary. Most importantly, the code has to be written in such a way that the compiler will generate assembly that is identical to what is being compared against. Writing matching code is a skill that takes time to learn, but it can be very rewarding and addicting.

-

What's a 'scratch'?

+

What's a scratch?

- A 'scratch' consists of the target assembly, input source code, and input context code. + A scratch is a workspace for exploring a compiler's codegen. + A scratch consists of the target assembly, input source code, and input context code, as well as additional settings and metadata. Most scratches contain a single function - i.e. the function that you are trying to match. - Each scratch has a unique link that can be shared. + Each scratch has a unique link that can be shared with others. Scratches have a 'family' of forks, which are copies of the original scratch.

-

What's the 'context' for?

+

What's the context for?

- The context is a separate section of code that is passed to the decompiler when your target assembly is uploaded. - It's used to give context to the decompiler, for example adding variables, struct definitions, function signatures and type definitions. + The context is a separate section of code that usually contains definitions and declarations, such as structs, externs, function declarations, and things of that nature. The context is passed to the compiler along with the code, so it's a good way to organize a scratch's functional code from its definitions and macros. +

+ +

+ Context is also given to the decompiler to assist with typing information and more accurate decompilation.

How does decomp.me work?

- The code from your scratch is submitted to the decomp.me server where it is compiled, objdump'ed and then compared against the target assembly. + The code from your scratch is submitted to the decomp.me server where it is compiled, run through objdump, and then compared against the target assembly. As you modify your code in the editor, the changes will be sent to the backend and compiled, so you'll see the results of your change in near real-time. + The similarity between the compiled code's assembly and the target assembly is represented by a score, which is displayed in the editor. +

+ +

+ The score is calculated by comparing the assembly instructions in the compiled code to the target assembly, and a penalty of different size is applied based on the kind of difference present among assembly instructions.

Where do I start?

- You can work on existing scratches on the site, if you make progress you can save your scratch which will result in a 'fork' of the original. + Currently, this website is meant to be used as a supplementary tool along with an existing decompilation project. Eventually, we hope to make the website a little more friendly to complete newcomers who aren't involved with any specific project. In the meantime, feel free to explore recent scratches and get a feel for how matching decomp works! +

+ +

Someone sent me a scratch. What do I do?

+

+ Any scratch on the site can be played with. If you save a scratch that you don't own, your scratch will become a "fork" of the original. If you match the scratch, the original scratch will display a banner to notify visitors that the code is matched.

- If you want to start your own scratch you will need the assembly code for a the function you are targetting in GNU assembly format. + If you want to start your own scratch, you will need the assembly code for the function you are targetting in GNU assembly format.

Can you add 'X' platform? e.g. PlayStation 3

From fcc17f62872247c3ea2707a6e4a73e2d34a53fe6 Mon Sep 17 00:00:00 2001 From: Mark Street Date: Thu, 30 Nov 2023 21:01:22 +0000 Subject: [PATCH 3/8] info about adding presets and compilers --- frontend/src/app/(navfooter)/faq/page.tsx | 26 +++++++++++++++++++---- 1 file changed, 22 insertions(+), 4 deletions(-) diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index 7d938a8a5..268a83a96 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -33,7 +33,9 @@ export default function Page() { decomp.me is designed for users who are working on matching decompilation projects, where the goal is to write high level (e.g. C or C++) code that, when compiled, matches the original binary perfectly.

- This is a time and labor-intensive process. To produce matching assembly, one usually needs the original compiler, assembler, and flags that were used to produce the original binary. Most importantly, the code has to be written in such a way that the compiler will generate assembly that is identical to what is being compared against. Writing matching code is a skill that takes time to learn, but it can be very rewarding and addicting. + This is a time and labor-intensive process. To produce matching assembly, one usually needs the original compiler, assembler, and flags that were used to produce the original binary. + Most importantly, the code has to be written in such a way that the compiler will generate assembly that is identical to what is being compared against. + Writing matching code is a skill that takes time to learn, but it can be very rewarding and addictive.

What's a scratch?

@@ -46,7 +48,8 @@ export default function Page() {

What's the context for?

- The context is a separate section of code that usually contains definitions and declarations, such as structs, externs, function declarations, and things of that nature. The context is passed to the compiler along with the code, so it's a good way to organize a scratch's functional code from its definitions and macros. + The context is a separate section of code that usually contains definitions and declarations, such as structs, externs, function declarations, and things of that nature. + The context is passed to the compiler along with the code, so it's a good way to organize a scratch's functional code from its definitions and macros.

@@ -66,7 +69,9 @@ export default function Page() {

Where do I start?

- Currently, this website is meant to be used as a supplementary tool along with an existing decompilation project. Eventually, we hope to make the website a little more friendly to complete newcomers who aren't involved with any specific project. In the meantime, feel free to explore recent scratches and get a feel for how matching decomp works! + Currently, this website is meant to be used as a supplementary tool along with an existing decompilation project. + Eventually, we hope to make the website a little more friendly to complete newcomers who aren't involved with any specific project. + In the meantime, feel free to explore recent scratches and get a feel for how matching decomp works!

Someone sent me a scratch. What do I do?

@@ -78,7 +83,19 @@ export default function Page() { If you want to start your own scratch, you will need the assembly code for the function you are targetting in GNU assembly format.

-

Can you add 'X' platform? e.g. PlayStation 3

+

Can you add a preset for a game I'm working on?

+

+ Absolutely we can, either raise a GitHub issue or drop us a message in the Discord server. +

+ +

Can you add a compiler for a game I'm working on?

+

+ This is something that you are able to do yourself. + The compilers used by decomp.me can be found in our compilers repository. + Once the compiler has been added to that repo, it is very simple to add it to decomp.me, see this PR for an example. +

+ +

Can you add 'X' platform, e.g. PlayStation 3?

The platforms that decomp.me supports are driven by the support for those platforms in the underlying tools that make up decomp.me. If these tools support the architecture for the new platform, and you have the compiler available, it is a straightforward process to add it to decomp.me. @@ -87,6 +104,7 @@ export default function Page() {

How do I report bugs?

If you come across a bug, please reach out to us on our Discord server and/or raise a GitHub issue containing the steps necessary to replicate the bug. + We will gladly accept bug-squashing PRs if you are able to fix the issue yourself!

Why frog?

From 1cf34faf2ec97f6bcff9b44377cfe5c9fdc9d8ee Mon Sep 17 00:00:00 2001 From: Mark Street Date: Thu, 30 Nov 2023 21:07:20 +0000 Subject: [PATCH 4/8] appease linter --- frontend/src/app/(navfooter)/faq/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index 268a83a96..f10bcf370 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -1,6 +1,6 @@ import Link from "next/link" -import Frog from "../../../components/Nav/frog.svg" +import Frog from "@/components/Nav/frog.svg" const subtitle = "mt-8 text-xl font-semibold tracking-tight text-gray-11" From 9469c1e561b2635817fb268c269307566272dd28 Mon Sep 17 00:00:00 2001 From: Mark Street Date: Thu, 30 Nov 2023 21:13:22 +0000 Subject: [PATCH 5/8] fix vercel deploy --- frontend/src/app/(navfooter)/faq/page.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index f10bcf370..b35ed16db 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -1,3 +1,4 @@ +import { ReactNode } from "react" import Link from "next/link" import Frog from "@/components/Nav/frog.svg" From 319d0db1c6059c2c3edec0bd55f9db120cf2fda5 Mon Sep 17 00:00:00 2001 From: Mark Street Date: Thu, 30 Nov 2023 21:17:02 +0000 Subject: [PATCH 6/8] fix lint properly? --- frontend/src/app/(navfooter)/faq/page.tsx | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index b35ed16db..0ddffd3fd 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -1,20 +1,21 @@ import { ReactNode } from "react" + import Link from "next/link" import Frog from "@/components/Nav/frog.svg" const subtitle = "mt-8 text-xl font-semibold tracking-tight text-gray-11" -export const metadata = { - title: "Frequently Asked Questions", -} - function FaqLink({ children, href }: { children: ReactNode, href?: string }) { return {children} } +export const metadata = { + title: "Frequently Asked Questions", +} + export default function Page() { return

From 7454ee0eaa35b4fc7c9fcdacaac4539482a89896 Mon Sep 17 00:00:00 2001 From: Ethan Roseman Date: Fri, 1 Dec 2023 16:05:46 +0900 Subject: [PATCH 7/8] giraffe wording --- frontend/src/app/(navfooter)/faq/page.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index 0ddffd3fd..b1630c1e7 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -24,15 +24,15 @@ export default function Page() {

What is decomp.me?

- decomp.me is a platform that allows people to upload assembly code snippets and write code in an attempt to match them, all within their browser. + decomp.me is an interactive web-based platform where users can collaboratively decompile assembly code snippets by writing matching code.

It is an open source project run by volunteers in their free time.

-

What do you mean by 'match them'?

+

What do you mean by 'matching'?

- decomp.me is designed for users who are working on matching decompilation projects, where the goal is to write high level (e.g. C or C++) code that, when compiled, matches the original binary perfectly. + decomp.me is designed for users who are working on matching decompilation projects, where the goal is to produce high-level code like C or C++ that perfectly replicates the original assembly upon compilation.

This is a time and labor-intensive process. To produce matching assembly, one usually needs the original compiler, assembler, and flags that were used to produce the original binary. @@ -103,7 +103,7 @@ export default function Page() { If these tools support the architecture for the new platform, and you have the compiler available, it is a straightforward process to add it to decomp.me.

-

How do I report bugs?

+

How do I report a bug?

If you come across a bug, please reach out to us on our Discord server and/or raise a GitHub issue containing the steps necessary to replicate the bug. We will gladly accept bug-squashing PRs if you are able to fix the issue yourself! From d91d42ba6cc3e2e5ff6ee23450f460252f2cfa04 Mon Sep 17 00:00:00 2001 From: Mark Street Date: Sun, 3 Dec 2023 17:50:09 +0000 Subject: [PATCH 8/8] colour links, one more question --- frontend/src/app/(navfooter)/faq/page.tsx | 30 +++++++++++++++-------- 1 file changed, 20 insertions(+), 10 deletions(-) diff --git a/frontend/src/app/(navfooter)/faq/page.tsx b/frontend/src/app/(navfooter)/faq/page.tsx index b1630c1e7..fcc027ef5 100644 --- a/frontend/src/app/(navfooter)/faq/page.tsx +++ b/frontend/src/app/(navfooter)/faq/page.tsx @@ -7,11 +7,15 @@ import Frog from "@/components/Nav/frog.svg" const subtitle = "mt-8 text-xl font-semibold tracking-tight text-gray-11" function FaqLink({ children, href }: { children: ReactNode, href?: string }) { - return + return {children} } +function DiscordLink() { + return Discord Server +} + export const metadata = { title: "Frequently Asked Questions", } @@ -27,25 +31,25 @@ export default function Page() { decomp.me is an interactive web-based platform where users can collaboratively decompile assembly code snippets by writing matching code.

- It is an open source project run by volunteers in their free time. + It is an open-source project run by volunteers in their free time.

-

What do you mean by 'matching'?

+

What do you mean by "matching"?

decomp.me is designed for users who are working on matching decompilation projects, where the goal is to produce high-level code like C or C++ that perfectly replicates the original assembly upon compilation.

- This is a time and labor-intensive process. To produce matching assembly, one usually needs the original compiler, assembler, and flags that were used to produce the original binary. + This is a time- and labor-intensive process. To produce matching assembly, one usually needs the original compiler, assembler, and flags that were used to produce the original binary. Most importantly, the code has to be written in such a way that the compiler will generate assembly that is identical to what is being compared against. Writing matching code is a skill that takes time to learn, but it can be very rewarding and addictive.

What's a scratch?

- A scratch is a workspace for exploring a compiler's codegen. + A scratch is a workspace for exploring a compiler's codegen, similar to Compiler Explorer. A scratch consists of the target assembly, input source code, and input context code, as well as additional settings and metadata. Most scratches contain a single function - i.e. the function that you are trying to match. - Each scratch has a unique link that can be shared with others. Scratches have a 'family' of forks, which are copies of the original scratch. + Each scratch has a unique link that can be shared with others. Scratches have a "family" of forks, which are copies of the original scratch.

What's the context for?

@@ -67,6 +71,7 @@ export default function Page() {

The score is calculated by comparing the assembly instructions in the compiled code to the target assembly, and a penalty of different size is applied based on the kind of difference present among assembly instructions. + The lower the score, the better!

Where do I start?

@@ -82,12 +87,17 @@ export default function Page() { If you match the scratch, the original scratch will display a banner to notify visitors that the code is matched.

- If you want to start your own scratch, you will need the assembly code for the function you are targetting in GNU assembly format. + If you want to start your own scratch, you will need the assembly code for the function you are targeting in GNU assembly format. +

+ +

Can you help me match a scratch?

+

+ You are welcome to ask for help in the #general-decompilation channel of our .

Can you add a preset for a game I'm working on?

- Absolutely we can, either raise a GitHub issue or drop us a message in the Discord server. + Absolutely we can, either raise a GitHub Issue or drop us a message in our .

Can you add a compiler for a game I'm working on?

@@ -97,7 +107,7 @@ export default function Page() { Once the compiler has been added to that repo, it is very simple to add it to decomp.me, see this PR for an example.

-

Can you add 'X' platform, e.g. PlayStation 3?

+

Can you add "X" platform, e.g. PlayStation 3?

The platforms that decomp.me supports are driven by the support for those platforms in the underlying tools that make up decomp.me. If these tools support the architecture for the new platform, and you have the compiler available, it is a straightforward process to add it to decomp.me. @@ -105,7 +115,7 @@ export default function Page() {

How do I report a bug?

- If you come across a bug, please reach out to us on our Discord server and/or raise a GitHub issue containing the steps necessary to replicate the bug. + If you come across a bug, please reach out to us on our and/or raise a GitHub Issue containing the steps necessary to replicate the bug. We will gladly accept bug-squashing PRs if you are able to fix the issue yourself!