October 2020

31OCT20

• Quiz App: Added more styles for results dialog
• Quiz App: Added social sharing functionality to the social sharing dialog with custom meta data
• Quiz App: Added quiz timer
• Quiz App: Fixed some more broken symbols and added a few missing ones

30OCT20

• Quiz App: Added more styles and media queries
• Quiz App: Fixed 30 broken symbols with invalid SVG data

29OCT20

• Quiz App: Added a radio select box that allows the users to select how many questions they want to take
• Quiz App: Added a custom meme image on the results page using the canvas element

28OCT20

• Quiz App: Finished Tactical Mission Task - Effects on Enemy Forces symbols
• Quiz App: Finished Tactical Mission Task - Actions by Friendly Forces symbols
• Quiz App: Finished Graphic Control Measures - Fortification symbols
• Quiz App: Finished Graphic Control Measures - Mines symbols
• Quiz App: Finished Graphic Control Measures - Mobility and Countermobility symbols
• Quiz App: Finished Graphic Control Measures - Target Control Measures symbols
• Quiz App: Finished Graphic Control Measures - Observation Posts symbols
• Quiz App: Finished Graphic Control Measures - Movement and Maneuver symbols
• Quiz App: Finished Graphic Control Measures - Points symbols

22OCT20

• Quiz App: Finished Sector 1 Modifiers for Installation Symbols
• Quiz App: Finished Sector 2 Modifiers for Installation Symbols

21OCT20

• Quiz App: Finished Installation symbols
• Quiz App: Finished Equipment symbols
• Quiz App: Finished Transportation mode indicators for equipment symbols
• Quiz App: Finished Sector 1 Modifiers for Equipment Symbols

19OCT20

• Quiz App: Finished Activity symbols
• Quiz App: Finished Main Icons for Units - Full Example Symbols
• Quiz App: Finished Reinforced and Reduced Amplifiers
• Quiz App: Finished Task Force Amplifiers
• Quiz App: Finished Command Post Amplifiers

15OCT20

• Quiz App: Finished Main Icons for Units - Sector 2 Modifiers
• Quiz App: Added SVG Compression script

14OCT20

• Quiz App: Finished Main Icons for Units - Sector 1 Modifiers
• Quiz App: Added symbol validation to check for duplicates
• Quiz App: Fixed eslint and question error handling
• I finally bought a house 😛

8OCT20

• Quiz App: Finished Main Icons for Units - Special Ops
• Quiz App: Finished Main Icons for Units - Sustainment
• Quiz App: Finished Main Icons for Units - Protection
• Quiz App: Finished Main Icons for Units - Movement and Maneuver
• Quiz App: Finished Main Icons for Units - Intelligence
• Quiz App: Finished Main Icons for Units - Fires
• Quiz App: Finished Echelon symbols

7OCT20

• Quiz App: Added Material Design Circular Progress component
• Quiz App: Added 100 questions

6OCT20

• Quiz App: Added functionality to Top App Bar
• Quiz App: Added bottom app bar
• Quiz App: Fixed Ripple effect for Material Design buttons

5OCT20

• Fixed broken transportation modifiers for equipment symbols
• Began working on the Military Symbols Quiz application

August 2020

28AUG20

• Added blog articles sidebar
• Cleaned up some links on the Surface Menu for the Top App Bar.
• Added blog preview images for all 4 posts
• Added facebook og:image and twitter card meta tags with images
• Added Other Posts in this Series links to each blog post
• Thinking of adding Hyvor Talk to the blog for a commenting system
• Last commit from Court street. It's been a crazy year but now I have to go buy a house. I wanted to get the blog up and running before I moved out but I have new commitments to deal with and a new full time job which takes up a lot of my time (this is not a bad thing).

27AUG20

• Added Top App Bar template for blog

21AUG20

• Refactored Webpack build for blog
• Fixed media queries on blog

14AUG20

• Finished Graphic Control Measure minefields for blog
• Finished Graphic Control Measure CBRN events for blog
• Finished Tactical Mission Tasks for blog

9AUG20

• Finished Graphic Control Measure Points for blog
• Finished Graphic Control Measure Movement and Maneuver for blog
• Finished Graphic Control Measures for airspace for blog
• Finished Graphic Control Measure Observation Points for blog

8AUG20

• Added Graphic Control Measures for points

6AUG20

• Split main blog post into 4 pages

4AUG20

• Added Graphic Control Measures for areas

June 2020

29JUN20

• Added environment to Sentry init call
• Implemented 3D Secure and subscriptions cancellation

26JUN20

• Wired up privacy policy to the templating engine

24JUN20

• Fixed bug with Leaflet.DumbMGRS that caused the map to freeze and the grids to fail at redrawing.
• Fixed a potentially app breaking bug. When a user scrolls a leaflet map across the world, it will continuously regenerate. This will cause lots of problems with getting accurate grid locations. By setting 'worldCopyJump' to true in L.Map() you can avoid this issue.
• Fixed bug where a user was prevented from dropping a symbol into the boundaries of a drawn item
• Fixed a bug where if a user edits a drawn item on the map it would not update in local storage.
• Added material design inspired tooltips for the leaflet controls. This gives much better user feedback if they don't know what these icons are
• Added changes to the Free App from this one.
• Fixed a bug where if a user chooses a symbol that is flight capable, and then goes to select a command post, the Flying switch would be disabled.
• Added a flightCapable attribute to the MainMS class
• Fixed favicons
• Implemented privacy policy page
• Fixed login page after user signs up

22JUN20

• Fixed a lot of bugs with LocalStorage. Now the map is saving symbols and users center location/zoom level
• Fixed LocalStorage bug where zooming onto the symbols would cause the 100K grids to "double draw".
• Giving up on the LocalStorage feature. I can get the text, symbols and drawn items to successfully store itself in LocalStorage. I can even get them to all redraw on the map after page load. There is however a bug that causes the grid overlays to fail to draw. It crashes the entire app. This is really upsetting because I was looking forward to using this
• Fixed broken icon links in server and free app

19JUN20

• Changed the default colors for Leaflet.Draw from light blue to black.
• iOS does not listen to click events. I am concerned that the Add Text To Map control will not work on mobile devices. Logic for this should be in moveSymbol.js under "addTextToMapSubmitButton"
• Added hover state background color on Screenshot control and Add Text to Map control
• Added a custom leaflet control that lets a user select a color for use with Leaflet.Draw
• Added hover state for Screenshotter control and Add Text to Map control. This is good for UX
• Changed CSS properties on the edit layer and trash icon for Leaflet.Draw. Previously if these controller buttons were disabled there was no color differentiation. I darked the background color and changed the cursor. This is good for UX
• Added an opacity slider for the leaflet.draw plugin. (All in all, messing around with a color control for Leaflet.draw cost me 9 hours today)
• FIXED issue with info window popups not appearing on symbols loaded from LocalStorage
• BUG: LocalStorage can store symbols and refresh on page load, however the entries keep duplicating and the symbols keep appearing on top of each other
• 27,178 total lines of CSS/HTML/JS I have written

17JUN20

• FIXED menuSurface button on the Top App Bar that would not toggle properly if the user clicks off the menu. For instance previously if you clicked the "Open Menu" button and then clicked the map, the menu would close but the button text would still read "Close Menu"
• FIXED issue where the affiliation outline would appear on the Mod1/2 dropdowns
• FIXED issue when a flight capable symbol has flying enabled and then turned off, the rest of the inputs are kept reenabled. This is a bug because if you toggle "Unit is Flying" on a UAV and then toggle it off the user could add things like Reinforced/reduced/installation.
• FIXED CSS issue where Save Symbol buttons were not centered on mobile devices
• Changed the LinkedIn and Website icons in the pushbar to Instagram and Twitter
• Added 500 meter grids and 100 meter grids
• FIXED issue where the symbol list would lose its alphabetical order when a user searches for an icon and clicks the trashcan button or removes all text from the search field
• FIXED issue where the popup div would clip over other symbols on the map. This was a z-index issue that I resolved in the biggestNumberInArray() function in moveSymbol.js (ADD THIS TO THE FREE APP!!!!)
• FIXED issue where the last item in the Frequently Used Symbols list would cause an overflow in the x-axis by swapping the Field Artillery icon with the Infantry icon. Kind of a hack but it works (ADD THIS TO THE FREE APP!!!!)
• Added a feature that changed the affiliation of the Most Popular Symbols depending on what affiliation the user selects. This is good for UX. (ADD THIS TO THE FREE APP!!!!)
• Fixed incorrect names of 2 mine symbols
• Added some functionality that will add all symbols on the map to local storage. Furthermore I added the ability to retrieve markers from LocalStorage and add them onto the map. There is however an issue with getting the popup div to appear on these symbols.
• Finished Sales Page!!
• Implemented Docker build and setup Docker Compose

16JUN20

• Integrated Sentry
• Integrated Sales page

15JUN20

• Established proper async to sync error handling in passport.js

11JUN20

• Fixed social media authentication

9JUN20

• Implemented basic integration of free app with web server
• Added free app to the repo and made it work as part of the server

8JUN20

• Started actual integration of paid app and server
• Updated ESLint
• Put server and paid app side by side and made paid app work as part of the entire Webpack build

06JUN20

• BUG: When a user searches for a symbol and then clicks the trash icon, the symbol list is no longer alphabetized
• BUG: Z-Index problem for the symbol popups. Whenever the users mouse goes outside the bounding box the the popup div the markers on the map will start clipping over it
• BUG: Top App Bar- when a user clicks the Open Menu button and clicks out of it by clicking on the map, the button text does not update. The button text will only update when it is clicked. It needs to listen for that surface menu to close (eg- 'MDCMenuSurface:closed')
• BUG: Symbol Mods still have the affiliation box on them. Even when the affiliation is anything other than friendly it still shows a friendly land unit outline on them. The current production site does not have this issue.
• BUG: When hovering over the Field Artillery icon in the Frequently Used Symbols it causes the horizontal scroll bar to show. Really minor but kinda annoying
• Created MGRS Mapper YouTube Account https://www.youtube.com/channel/UC1_dDdUSPtYH7WeLhgehEzw (mgrsmapper@gmail.com)
• Created MGRS Mapper Twitter Account https://twitter.com/MGRSMapper (mgrsmapper@gmail.com)
• IOT have a custom YouTube URL your channel needs to be 30 days old and have at least 100 subscribers
• Finished the MGRS Mapper Sales Page
• Added: Fixed a bug in the download SVG buttons where the symbol would not center or scale properly. This fix now works well for both SVG and PNG files

5JUN20

• Implemented CSRF protection for forms
• Ensured app responsiveness
• Implemented production Webpack build on frontend
• Worked on Sales Page media queries
• Worked on Sales Page introduction video

4JUN20

• Implemented Web Components Webpack build

3JUN20

• Updated Google Maps API keys in the free app
• Added Webpack dev middleware to dev server
• Added Webpack hot middleware to dev server
• Finalized password reset feature by integrating SendGrid

2JUN20

• Added Stripe webhooks setup
• Fixed issue with incorrect sign in attempts

1JUN20

• Introduced first basic version of frontend Webpack based build
• Implemented password recovery feature

April 2020

26APR20

• Moved loadScreen.js to its own entry point in WebPack. The load screen will now fire off before index.js
• Removed calls to the symbol objects file and instead simulated the files loading in the exampleSymbols array. I iterated over the array and filled it with copies of each element in the array so it would match the totalSymbolCount value (715).
• Created a STYLES.HEADLINE5 object IOT mimic the mdc-typography--headline5 class. This is important because I now have the loadScreen firing off on document.readyState === 'loading', which at that point the CSS is still loading.
• Fixed the setStyles function in loadScreen.js so that the for-in loop was replaced by Object.keys. This is a performance upgrade since the for-in loop will iterate all over the prototype chain.
• Fixed the .hasOwnProperty() method in setStyles since eslint was freaking out about it
• Removed all warnings from eslint on loadScreen.js, now contains valid ES6 code (this whole file took about 4.5 hours to tweak)
• Fixed some issues with the loading screen and mobile browsers (including tablets)
• Fixed app breaking bug where newSVG div borders will spill outside of the symbol panel. This was caused by the transform prop in .newSVG being set to scale(1.5). I moved this property to .newSVG > svg and it worked
• Fixed app breaking bug that froze the leaflet map when the user goes to a zoom level > 17. This was due to the switch statements in getPaddingOnZoomLevel() not containing cases for those zoom levels.
• Fixed pushbar select boxes on ipad and small screen sizes
• Adjusted CSS in the selectSymbols menu surface so it looks nice on mobile
• Fixed bug where activity icons were not getting viewBox settings, so they looked all jacked up in the symbol panel
• Fixed symbol search results covering up the input field on mobile
• Fixed the symbol info popup on mobile phone so it is no longer going outside of the page
• Enabled the pushbar to be closed when a user searches for an address and clicks on the result on mobile. This is a UX improvement because before the pushbar would cover up the entire screen on mobile and the user wouldn't know if they searched for something or not
• Tons of minor adjustments and media queries for tablet and phone users
• Adjusted the deletePopupButton for Firefox users
• Added a function that will Alphabetize the symbols
• Added an if statement that will only add symbols on affiliation change that are NOT a Tactical Mission Task or Graphic Control Measure. This reduced the time to open the selectSymbol list from ~900ms to ~600ms
• Added the isVisible() function to further optimize load speeds for the selectSymbol menu. The menu will now pop up within ~120ms
• Removed the FBCLID query string parameter from the URL
• Added screenshot plugin and configured the styles for mobile and Firefox. This ideally should be morphed into a "save to PDF" functionality. But for now this is the best plugin that exists because it captures the page and the symbols on it.

18APR20

• Struggled with enabling the use of touch events when dragging a symbol on a mobile device. The issue lies with HTML5's API not listening to TouchEvents. It will only listen to DragEvents. I have wasted about 20 hours on this issue so I decided to just have the symbol placed directly in the center of the map when it is touched on a mobile device.
• Fixed the styling of the Leaflet plugin for adding text to the map. This functioned fine on mobile but the styles were missing. Probably due to the janky way I created the plugin.
• Fixed the color selectors in the Leaflet plugin for adding text to map. Issues between mobile and desktop have been resolved
• Fixed viewbox inconsistencies on Graphic Control Measures. They were using a static value and the clickable viewbox did not always envelop the symbol in the panel. Setting this to a dynamic value fixed this.
• Added Tactical Mission Tasks to the setViewBox function in app.js. Since Graphic Control Measures and these do not take any modifiers I don't need to worry about how modifiers will fit within the symbol. This might be inefficient since I am running a function each time they are added. YOLO
• Added a loading screen. Note sure if I like it since it's adding so much junk, but it looks cool
• UI Improvements
  • Closed the Top App Bar's surface menu when a user changes a map. Better UI experience on mobile
  • Fixed spacing on bottom app bar sections, added media queries for iPad in portrait & landscape
  • Enabled cursor coordinates to update on touchstart event
  • Removed some extra text on bottom app bar section 3 (beneath the pushbar)
  • Adjusted absolute position of the menu surface so it is not covering the menuSurfaceButton
  • Added 'OPEN MENU' and 'CLOSE MENU' text on menuSurfaceButton in the Top App Bar
  • Added a ripple effect in SCSS to the menu surface button in the Top App Bar. For some reason the ripple effect fires off once successfully but then it won't fire off again. Manually created a ripple effect in SCSS to fix this issue
  • Centered the site logo in the Top App Bar
  • Worked on mobile styles and media queries
• Added loading screen constructor function to it's own file
• APP BREAKING BUG ALERT: When a user zooms in all the way on the map the console throws a ton of errors. This will in turn lock the map from panning anywhere. This happens on the Secondary Base Map. This is probably a maxZoom level error
• APP BREAKING BUG ALERT: The newSVG div spills outside of the pushbar. Any symbols that are dropped onto the map are actually not clickable because of the invisible boundaries of .newSVG

10APR20

• I have a 2 day break from State Active Duty for the Coronavirus...
• There is an issue with the Google Geocode API that prevents it from being used when referrer restrictions are enabled. Did a quick fix by just removing that restriction. Will need to look deeper into this before production.
• Removed unnecessary grid layouts in the Pushbar. In total it removed about 80 lines of HTML but it helped simplify the layout so the content gets painted quicker.
• Fixed Pushbar layout on smaller screen sizes. Works well in my 27 inch monitor and 15 inch laptop. Still requires more testing
• Spent the rest of the day spinning my tires. Could not figure out how to get the drag-and-drop symbol to respond to touch events.

February 2020

29FEB20

• Created new project structure
• Added new webpack configs
• Merged code from mdcComponents into index.js
• Fixed bugs with marker popups
• Updated most Material Design Components to 4.0
• Updated babel from 6.26.3 to 7.8.4
• Updated all other babel plugins
• Updated eslint
• Updated webpack from 4.0.0 to 4.41.6
• Look into merging app.js and index.js and go through your eslint errors
• Clicking on a symbol will sometimes cause the map to zoom in. This is highly annoying

28FEB20

• Tried and failed to move this project over to Parcel
• Tried and failed to create a new webpack config. Some large errors occurred because I was updating all of MDC packages and apparently node-sass cannot use the @use module in sass files... Yeah idk
• Tried and failed to move this project over to Snowpack
• Fixed error in most popular symbols where if the search field has text in it, it would crash the app. I did this by adding clearSearchField() to the event listener
• Added toggle switches for GZD, 100K, and 1000M labels and grids
• Added a switch validator for grids and labels based on map zoom

15FEB20

• After 3 months and 340.33 hours I have finished the MGRS overlay plugin.
• Updated leaflet dependency to 1.6
• Updated node-sass to 4.13 (4.9 did not support Node version 13)
• Created folders for JS files based on the theme
  • map: Deals with Leaflet and its plugins
  • symbolObjects: Deals with the logic behind creating symbols. Also removed the word "object" from each of their file names.
  • ui: Deals with Material Design components, pushbar, or generally anything else UI related
• Moved DisableInputs and addSymbolsAndModsToList from helperFunctions into mdcComponents
• Tweaked the settings for Fuse.js for more accurate searches
• Moved TransformModifiersOnEquipment from helperFunctions into placeSymbol
• Removed leaflet-textpath dependency
• Removed the esm dependency. No idea why I even had it in the first place
• Added the map.locate method to automatically center the map on the users location
• Added "transform-object-rest-spread" to webpack plugins because for some dumbass reason it isn't enabled by default
• Added my Leaflet.DumbMGRS plugin!
• Added coordinate info box in the bottom app bar
• Removed geodesy dependency
• Added Grid Overlay menu surface
• Spent too much time messing around with imports/exports and global vars. This app is a total mess and I'm at the point where I think I just need to put that on a low priority list and just finish this app.
• TODO: Add in the grid overlay toggle buttons on the menu
• TODO: Consider moving easting/northing to bottom app bar section 3 and reduce the bottom app bar back to 80px height.
• TODO: Convert bottom app bar into an MDC grid? This would probably be a lot nicer to work with
• TODO: Remove menu surface button in exchange for a series of switches?
• TODO: When the app first loads it asks for your location, when the user agrees the map kind of "hangs" and does not set the view properly

14FEB20

• I finished Leaflet.DumbMGRS.js!!
• Fixed 1000m grids on special zones in Norway and Svalbard
• Optimized polylines with L.LineUtil.clipSegment
• merged gzdObject and tree shook mgrs.js

11FEB20

• Working on Leaflet.DumbMGRS.js
• Fixed 100k labels
• Refactored genLabels function
• Configured 100k grid/labels switches
• Converted GZD into a proper leaflet plugin class
• Removed old 1000m grid dictionary

4FEB20

• Working on Leaflet.DumbMGRS.js
• Converted 100k grids to leaflet plugin
• configured GitHub pages and Heroku deployment for this plugin

2FEB20

• Working on Leaflet.DumbMGRS.js
• Noted huge 100k error in Grid Zone Designator rows 30 and 31

1FEB20

• Working on Leaflet.DumbMGRS.js
• Fixed issue with grid labels on southern hemisphere latitudes
• Added 1000m grids label switch
• Added 1000m grids switch

December 2019

30DEC19

• Working on Leaflet.DumbMGRS.js
• Completed 100K grid data

27DEC19

• Working on Leaflet.DumbMGRS.js boilerplate

21DEC19

• Made very little progress on the fucking grids. I got the 1000m SORT OF working. But this whole plugin is a total embarrassment

18DEC19

• Fixed issues with the 100km grid square not generating when the map bounds contains 2 GZDs. Now I just need to implement this into a proper leaflet plugin

15DEC19

• Got the 1000m grid squares to partially generate on a split GZD. Right now I have it generating for the left side of a GZD, there is a Promise function on the combinedIntervals() class method. I am thinking that I could possibly run the class again to generate the right side. If this works then I can definitely see this becoming an open source plugin.

13DEC19

• Got a rough copy of the 1000 meter grid square generator. The problem with it is it will not generate grids when the map bounds contain 2 grid square designators. This is due to the eastingIntervals() and northingIntervals() methods. Since adjacent GZDs have vastly different UTM values, the eastingIterator/northingIterator is not always less than this.endCoordEasting.easting. It is recommended that you go back into your class function in the leaflet-mgrs-layer-pages-gh project and find out how to incorporate this
• BUG: The 10k grid squares are not accurate. Scrape that whole idea and work on building the grid generator

4DEC19

• Fixed missing 100K grid squares in the generator (was missing grids for over 250 GZDs!)
• Fixed IndexedDB not logging the right data
• Created a web worker to load the 100K grid square data in the background
• Web Worker now posts data from IndexedDB
• Created dynamic 1000 meter grid squares

2DEC19

• Worked all day on fixing the grid generator. I have a working copy now but I'm too exhausted to add it. Look for the gridGeneratorExample.js file
• Finally got all the corner grids for all 100k grid squares. Putting them in the CORRECTCORNERGRIDS.js file to look at later. It's 4:04am and I'm exhausted

October 2019

30OCT19

• Had way too many issues with MapBox and decided to revert back to where I left off on the 28th. Moved the modified webpack.config and package.json files to the ./old folder and pushed the changes to a new branch "7bitSignedAscii".
• Centered the dropped symbol on the mouse cursor
• Since a user's symbol orientation is unknown I think we need to combine Tactical Mission Tasks into the general militarySymbolsObject file.
• Created a Facebook page
• DisableInputs should be refactored to accept an object as params. It is unreadable as it stands
• Added site logo but to be honest I am not happy with it and it should probably be removed.
• Tooltip inspiration Tippy.js

28OCT19

• Got tied up in JS Perf testing out better implementations of the Resizer class. Found that converting it to a function yields with an array that stores values yields a +4,000% performance increase. Check the data out here and here
• Online SVG Editor this might be useful when adding symbols

• Fixed the bug where the symbolSelect unordered list wasn't mating to the bottom of it's dropdown select box. This was due to an idiotic mistake on my part by manually setting the style value to this:

  selectSymbol.menu*.root*.attributes.style.value = `transform-origin: center top; top: ${selectSymbol.root_.getBoundingClientRect().bottom}px; max-height: 714.375px; right: 33.3438px;`;
                 

• Fixed overflow-x problem for select boxes in FireFox.

• Moved JSON preview to Menu Surface IOT prepare for the map
• MapBox is a bloated piece of shit software that fucks with Moveable.js. Consider going back to Google Maps. Spent over 13 hours on it today and got no where

25OCT19

• Created a grid for all the list item elements in the select boxes. Now the symbol description sits on top of the type and everything is aligned properly without having to use that ugly padStart() method. Decided to code my own CSS grid instead of using MDCs built in Layout Grid (didn't feel like generating tons of extra divs).
• Fixed a bug when selecting a GCM it would remove the first indexed item in the select boxes for Mod1/2, CPs and TMTs. This was an issue with DisableInputs and the way MDC listens for events. I was setting "selectMod1.selectedIndex = 0" which was causing a change event that then triggered placeSymbol(). So when a GCM was selected it would run placeSymbol() 5 separate times. By setting "selectMod1.setEnhancedSelectedIndex_(0);" this "silently" changes the index of the select box and the event listeners don't pick it up.
• Added mdc-typography--headline6 to all non-generated list items for uniformity.
• Got stuck on adding a map. I think I am going to go with MapBox and load in some vector and raster maps. I have a semi-working version on codepen here
• TODO: Implement the MGRS overlay!!!!
• BUG: Scroll down on the pushbar and then select a symbol. Notice how the list does not append to the bottom of the select box? That needs to be fixed. It's also not resizing the selectSymbols items. The symbols in firefox are also jacked up. In Chrome all you need to do is hover over them and they will resize but in Firefox this does not happen. Upon further inspection this looks like the default behavior of MDC. Look into locking the scroll position when a menu is open. Putting a setTimeout on the Resizer class seems to fix the issue on Chrome but it still persists on Firefox... fml

23OCT19

• TransformModifiersOnEquipment() is being imported into mdcComponents but only being used in app.js
• Tried fixing the bounceIn animation for equipment modifiers but got stuck. Settled on a zoom in animation that I got from Animate.css
• Added semi-dynamic viewBoxes on symbols via the setViewBox arrow function
• Fixed a bug that appended empty divs to the symbol. For instance, a select box with generated content would automatically set the value to "None" which caused my placeSymbol method to append that div even though it was empty. I added a ternary operator in the symbolValues function expression that would return the value undefined if it was set to "None"
• Added a dynamic block of code in a

   tag that displayed data-symbol-info in a readable format. More info here

• Fixed bug that appended the wrong information into 'data-symbol-info'.
• Fixed animation bug that prevented the drop down animation for Equipment and GCMs
• Added About Section on the bottom of the Pushbar
• Moved ES Lint rules from top of file to eslintrc
• BUG: When removing TransformModifiersOnEquipment from the window and into imports it throws an error... No clue.
• Fully removed graphicControlMeasuresObject and integrated it with militarySymbolsObject. Since users tend to search for GCMs as much as symbols it made more sense to incorporate them into the main symbols object
• Fixed a bug when clearing the search field. It was looking for dataset-symbol-name, which I removed earlier
• Added bottom-about section on Pushbar
• Added scroll bar styling in Chrome
• Fixed scroll bar bug in Firefox by setting the .symbolSelectors height statically to 911px
• Fixed the fadeInAndSlideOut animation bug on Firefox with an 'animationend' event listener on the window.
• Added bounceInAnimation to Command Post and Tactical Mission Tasks
• BUG: Choose a GCM, then go back to a normal land unit, now check Mod1 or Mod2 -> The first item is missing???? This is an issue with the Resizer class

21OCT19

• Integrated the Drag-and-Drop functionality. (this took 14 hours).
• Noted bug in Firefox on the placeSymbol() method. For some reason setting the height and width via getBBox() causes the app to fail. Setting the values statically fixes this issue. Although I don't like it.
• BUG: Graphic Control Measures do not work with clone-and-drag. IMO this whole feature needs to be incorporated into the main military symbols object. In the long term this will be more beneficial since people tend to search for GCMs just as much as regular symbols
• Feature: Need a clear symbol button. I have the feeling if a user has selected a piece of equipment, they won't know how to escape the disabled menus.

17OCT19

• Added extra data to package.json
• Moved all Pushbar logic to pushbar.js. Since Pushbar is not an Material Design Component, it does not belong in mdcComponents.js
• Consider: Loading Overlays
• Consider: How to get mid point of SVG
• Consider: Webpack and Lazy Loading
• Consider: Material Theming
• Consider: 33 JS Concepts

16OCT19

• Added MPL 2.0 license.
• Finally removed the default text in the package.json file... Only took me half a year
• Potential bug. The dropzone restriction works when you drop the symbol down but once it is dropped it can be moved anywhere outside the yellow background. Need to set the container for the symbol.

14OCT19

• Noticed that a lot of search strings in the old MGRS site include things like checkpoints and TRPs. Need a way to search both object files...
• Added clone to Moveable
• Added cloneAndDrag.html. You will need to go through it and manually insert what you need into moveSymbol.js. But everything works with it... Thank god
• Good website for learning about viewBox here
• Check out this old pen you wrote about multiple conditions for switches here This is less than 30 lines of JS and could potentially replace the needless complexity of RRSwitches class

10OCT19

• Fixed a bug with the animateSymbol class. Previously when a user changed a symbol and then hovered over it the zoom in animation would work. But when they hover-out the '.animateSymbol' class would run the drop in animation. This was fixed by adding the addAndRemoveSymbolPanelAnimation function.

• Fixed a potential performance bug in the addSymbolsAndModsToList function. For some reason 'selectSymbol.foundation_.setSelectedIndex(0)' was running again and again depending on the number of elements in the selectSymbol dropdown. This was fixed by replacing it with the following following:

  >

    selectSymbol.foundation_.adapter_.floatLabel(true);
                 selectSymbol.setEnhancedSelectedIndex_(0);
                 

• Added a Bottom App Bar in HTML and SCSS. I kind of just copied the CSS for the Top App Bar but added a property of bottom: 0; I made a CodePen of a more intricate bottom app bar here I am not sure if this is even worth incorporating but it looks nice.

• Added moveable.js. Huge issues with this one:
  • The hover animation on the symbol panel lags the shit out of the resize/scale/drag/rotate functions. Disabling it is a temporary fix.
  • The bounding box is off center on the symbol
  • The symbol should be cloned and then the target is attached to it
  • When selecting a new symbol the entire functionality fails
  • 92k file size (wtf)
  • Only works when I put a setTimeout function on it (total hack)
  • When placing the symbol down, if you minimize the pushbar, the symbol moves along with it (note: this does not happen when I set it to work on the red ball. I think cloning the dom node is what will fix these issues)
  • I think if I clone the symbol in the panel, I won't have to worry about the animations lagging, or the pushbar fucking things up...
  • https://codepen.io/pistell/pen/ExxPYom is a good resource that shows how to drag and clone an object. However it requires an additional dependency called Scene.js
  • At this point you need to start looking into tree-shaking because Moveable+Scene is about 125k in size.
• Added bounceInAnimation() to Activity, Installation and Task Force.
• Also noted that Moveable.js requires SceneJs to run certain tasks like clone-and-drag.

8OCT19

• Added menu open and closed icons for top app bar
• Added more files to gitignore
• Separated JS and CSS files into their own folders
• Fixed bug with GCMs not showing up. This was due to an extra parameter in DisableInputs (because I moved the flying param logic to MilSym class)
• Set symbol viewBox to new fixed attributes which should contain all elements in the panel
• Added 50px to padding-bottom and reduced padding-top by 5px in the symbol panel
• Reduced all command post flag staffs to a max length of 240
• Fixed bug with Unique and Higher Formation text
• Mathematically centered the unique identifier text >

  uniqueDesignationText.setAttribute('y', '107.493');
                 svg.getBBox().height + (24.5 - 2) * 0.333
                 // height = 100
                 // 24.5 = font size in pixels, 2 = half of the strokeWidth, 0.333 = 1/3rd of the symbol size; which gives you 7.493
                 

• Cleaned up and organized CSS files
• Added hover animations to symbol panel and dismissible drawer icon
• Added select menu icons and adjusted CSS styles
• Fixed a bug where if a user types in the search field for an icon, the selectSymbol dropdown would compress. It wasn't an elegant fix but it technically works >

    selectSymbol.menu_.root_.attributes.style.value = 'transform-origin: center top; top: 591.625px; max-height: 714.375px; right: 33.3438px;';
                 // Test this before production
                 

• Fixed CSS issues on switches
• Added Surface Menu component to Top App Bar

6OCT19

• Refactored DisableInputs
• Smashed bugs with GCMs overriding DisableInputs (This took like 6 hours)
• Refactored enableTaskForce, enableInstallation, enableActivity
• Fixed bug where if you enabled Activity, Installation, and Task Force and THEN enabled flying, the amplifier switches wouldn't disappear. This was fixed inside adjustSymbolOutlineForFlying()
• Would static methods on MilSym be a more efficient way to go about this? The purpose of static methods is that you can access generic properties on a class without having to create a class instance. Static methods don't have access to the this class instance, and therefore are really only there as utility functions and properties.
• Added Pushbar.js
• Added Top App Bar
• Incorporated old Pushbar logic
• Smashed bugs with flying switch. Previously if you enabled a flying symbol then switched to a non flying symbol it would keep the flying outline. This was fixed by adding this._flying = false in the flightCapable if statement in MilSym
• Added z-elevation and other styles to elements to complete the skeleton

3OCT19

• Messed around with async/await in MilSym
• changed TransformModifiersOnEquipment from a class to a async function
• Attempted to fix the bounceIn animation function for equipment icons but ran into roadblocks. Minor issue, will look again later
• Refactored DisableInputs class into function IOT abide by ESLint "Disallow new for side effects"
• Added a boolean switch to compare old and new affiliation values when the selectSymbol dropdown is clicked. If the old value and new value don't match up, then run a "new MilSym" if that dropdown is open IOT change the symbol outlines to the currently selected affiliation. This is a huge performance boost because previously I was creating all new symbols no matter if the dropdown was opened or if the current affiliation was not changed.
• Bugs Smashed: Pending outline on equipment in the symbol dropdown not showing, Task Force button not working on page load, disableInputs not working, When Task Force amp is selected it was preventing users from searching for equipment (made the symbol panel go blank), Fixed an issue when a symbol is in flight and it was throwing Mod2 off center when a user switched affiliations, fixed a bug where the flying switch was disabled when activated, fixed a bug where if a user checks and unchecks flying they couldn't add a task force.
• Cleaned up app.js and mdcComponents.js and moved some functions to helperFunctions.js
• Reduced taskForceObject.js from 8.48 kb to 3.11 kb!
• Added tacticalMissionTaskObject and all its related functions
• Added graphicControlMeasuresObject and most of its related functions

1OCT19

• Added the new MilSym class
• Added setSelectBoxTextContent function on page load
• Fixed inputDesignationFields()
• Fixed Equipment Outline for friendly units
• Fixed Task Force switch
• Fixed Installation Switch
• Fixed Activity Switch
• Fixed equipment outline...again

August 2019

August (entire month)

• Worked on symbol generating class
• Added icon transitions
• Added icon search field
• Optimized search function
• Added Equipment icon logic
• Added unit echelon sizes
• Added MilSym class for object construction
• Imported all files into WebPack

June 2019

June (entire month)

• Worked on symbol generating class

April 2019

April (entire month)

• Worked on symbol generating class

February 2019

February (entire month)

• Giving up on MilSymbol.js. I don't know how it works nor how to add upon it. I'm going to create my own class that generates symbols

September 2018

September

• Added icon size lock (beta)
• Stopped development for the rest of the year. Started thinking about redoing this entire application