Emblem Anims

Emblem Anims was created to provide an easy to use resource for comparing animations, downloading them, and providing accurate credit to the Fire Emblem modding community. It utilizes:

• Node.js
• Sequel Removed 7/4/20
• Sequelize Removed 7/4/20
• jQuery
• Bootstrap
• HTML, CSS, Javascript

Table of Contents

• Emblem Anims
• Table of Contents
  • Project Overview
    • Getting Started
    • Classes
    • Anims
      • Main Image
      • Identifier
      • Weapon Row
      • Credit
    • Searching
      • Search Text Submission
      • Search Filters
      • No Results
    • Full Download
  • ToDo

Project Overview

Getting Started

The application is primarily navigated via the navbar. Each of the buttons has a dropdown for classes in that category. Each class name contains data that is used by an Ajax call to search the database for matching animations.

The entire site is mobile friendly. The nav bar switches from text to icons on smaller browsers and anims go from 3-2-1 per line depending on viewport.

Classes

After a class is clicked, the page will populate with a section for that class containing each of the unique anims and their possible weapons. The weapon icons are sorted initially to adhere to a structured order for uniform design. Anims themselves are also sorted such that females all appear first, males are second. A secondary alphabetical sorting is intended to be implemented at a later date. Clicking on the blue class header or the dropdown for the class will hide that section from the screen. Selecting it again will show it again.

Anims

Each anim is comprised of an image, an identifier (gender, description), weapon row, and credit.

All of these fields other than credit may be clicked to change the image section or download the Anim.

Main Image

This is automatically generated for each Anim based on their first weapon and is by default set to the png version. Clicking anywhere on the image causes the image source to swap to the gif or back to the png.

Identifier

The gender icon is a conversion from the anim's sql data to a font-awesome character based on M, F, or U. The description is also pulled from the sql data but is fully flexible. Clicking on any of the identifier text will download the anim and all of its weapons.

Weapon Row

The weapon row is pulled from the weapons array that each anim contains. It is sorted in order from Swords first to Unarmed last. Clicking on a weapon icon results in the image changing weapons and reverting to the still png version.

Credit

The credit row contains all authors that have worked on any weapon or part of the design that the Anim uses. More granular credit can be seen in the downloaded files.

Searching

The search bar is located under the "Home" section. Given at least an author or name input, and optional filters by category, tier, and gender, the database will be searched through and animations produced.

Search Text Submission

Both name and author allow for partial name searches. A search for authors with the name "Yeti" will pull up all results despite it not being the full name of the any authors.

Search Filters

By adding filters, one can narrow results even further.

One can also search by both name and author to be even more precise.

No Results

In the case of search terms without results, a random image out of several will display with a message.

Full Download

This application is synced with a Google Drive repo to enable full downloads of assets. The loading hub has a link to this full download.

The best method of staying up to date on all assets involves adding the repo to your Google Drive folder. It's also possible to only take certain folders if all aren't desired.

ToDo

• Convert to ES6/React
• Add Search Bar done!
  • Add pseudonym/common misspelling corrections
  • Autofill
• Add Newsfeed
• Add Spells done!
• Potentially expand functionality to include other graphics such as map sprites