coteh / mcu-rewatch Goto Github PK

One way this can be done is by generating a unique string that can be appended to the URL.
The URL string can be formatted as the concatenation of a 22-character binary string comprising of 1s or 0s depending on watch status, with a number character representing the ordering.

Example: 21111111010001011111010 (the '2' representing release order with Infinity War last)

The binary string portion can also be converted to hex string format to reduce URL length.

Example (based on above example): 23FA2FA

Accessing the path denoted by the unique string will tell the server to return some data along with the regular page response that it'll then use to replace all currently set options on the frontend with the results it got from the server. The loaded movie progress will not overwrite LocalStorage, nor will any modifications to the movie statuses save anything to LocalStorage in this state (we can also lock any changes from being made while viewing a sharable link).

Add ability to divide movies into subgroups such as phases, Infinity Saga, etc.

This effect can currently be achieved by removing movie indices from orderings.json, but this ticket can be used to evaluate whether it would be necessary to add a subgroup mapping object despite this.

https://github.com/monounity/karma-typescript/

Something I took a look at during development and unfortunately did not get around to. Assess what this module does and the benefits this will provide to the Karma setup.

Currently, using indices does make it easier to get the movies from the movies array, but it should be investigated whether it's possible to use movie ids instead for the ordering data.
The immediate benefit from switching over to using ids, since I just use numbers starting from 1 (1-based indexing) currently for the ids, would be more intuitive human input. However, if at some point I start using a different system for ids and have a back-end crunch movie and ordering data (and store in a database), it'll make much more sense to use ids instead for the ordering data.

To Reproduce

• Select "release", then click Spider-Man Far From Home to mark it
• Select "release-to-iw"
• Select "release" again, Spider-Man Far From Home is no longer selected

If you refresh the page, you'll see that Far From Home's progress is in fact saved.
If you click on poster before refreshing page, it seems to toggle the current state, not the actual saved state.
This leads me to believe that it's a problem with updating current state in memory. It can potentially be solved by propagating updates to watched field within MCUMovieList component whenever movie is toggled.

Also add tests:

• toggle should persist when movie is removed from ordering and added back

Based on "Marvel Cinematic Universe in Timeline Order" section seen here:
https://www.disneyplus.com/brand/marvel

• Thor: The Dark World should be before Iron Man 3
• Black Panther should be before Doctor Strange

https://github.com/sagalbot/vue-select

Improve the script and possibly use a webpack plugin for this as well.

Despite the fact that FFH is going to be the last movie of Phase 3, Avengers: Endgame to me is the final MCU movie. I will still be seeing FFH, but not on release like most MCU movies I've seen in theaters.

With that said, if you want FFH to be included in mcu-rewatch, submit a PR and I'll happily include it in the roster.

Some of these may require learning new tricks to stub/mock out the parts of tests that need to be isolated out. Some of these tests may require redefining error cases of certain methods (ie. gracefully handling situations when something does not give us result we want).

Does not cause a compilation issue when building with webpack but TypeScript compiler will complain about it. This is evident when running vuetype to generate the type declaration files for the Vue components.

Tried adding a typings.d.ts file with this general declaration:

declare module "*.json" {
    const value: any;
    export default value;
}

I put this file in both root and in site/ in case vuetype selected site/ as the root directory.

Also tried setting resolveJsonModule and esModuleInterop to true.

'sinonTest.configureTest is deprecated and will be removed from the public API in a future version of sinon-test'

Replace all calls to sinonTest.configureTest to simply sinonTest.

Image formats can be traditional PNG, JPEG, or BMP.

https://github.com/vuejs/vue-class-component

Replace all Vue component definitions with class definitions using this library. I hypothesize that this will give our Vue components type definitions for tests, allowing for access of component-specific props, methods, etc. without compile error.

Two warnings came in when building for prod:

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
  assets/js/main.bundle.js (883 KiB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  main (883 KiB)
      assets/js/main.bundle.js


WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

ModuleConcatenation bailout: Module is not an ECMAScript module

See what can be done to optimize build and fix these warnings.

These tests fail when mode: "production" in webpack.config.js:

1) should not have 'grayscale' class if movie has been watched
     MCUMovie
     AssertionError: expected [ 'movie', 'grayscale' ] to not include 'grayscale'
    at Context.<anonymous> (webpack:///test/MCUMovie.spec.ts:46:41 <- assets/js/test/MCUMovie.spec.bundle.js:580:1011511)

2) should appear if both loaded and available to show
     MCUMovie
     AssertionError: expected 'none' to not equal 'none'
    at Context.<anonymous> (webpack:///test/MCUMovie.spec.ts:59:53 <- assets/js/test/MCUMovie.spec.bundle.js:580:1011701)

3) should populate the dropdown with options
     MCUSelector
     AssertionError: expected 0 to equal 2
    at Context.<anonymous> (webpack:///test/MCUSelector.spec.ts:44:36 <- assets/js/test/MCUSelector.spec.bundle.js:588:2970)

4) should invoke save operation for correct ordering preference when selected
     MCUSelector
     AssertionError: did not invoke save for the correct ordering: expected undefined to equal 'test2'
    at Context.<anonymous> (webpack:///test/MCUSelector.spec.ts:63:36 <- assets/js/test/MCUSelector.spec.bundle.js:588:3348)
    at s (webpack:///node_modules/sinon-test/dist/sinon-test.js:146 <- assets/js/test/MCUSelector.spec.bundle.js:588:1293)
    at Context.<anonymous> (webpack:///node_modules/sinon-test/dist/sinon-test.js:166 <- assets/js/test/MCUSelector.spec.bundle.js:588:1578)

Investigate and fix.

Source: https://www.salon.com/2019/07/22/four-lessons-from-marvels-infinity-saga-the-mcu-should-take-into-phase-4

Although I personally don't consider it part of the Infinity Saga, Feige said during SDCC this year that it is.

• Include FFH in Infinity Saga ordering
• Possibly include another Infinity Saga ordering without FFH

Noticed this after I merged in #17 but may very well have existed before then. Investigate why movie poster transition effect still seems to go before all the images have loaded.

For a cleaner separation of concerns. We can instead have a separate method that merges them together. Related tests will need to be updated as well.