Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multiple fitrep comparison #51

Merged
merged 15 commits into from
Apr 10, 2023
Merged

Multiple fitrep comparison #51

merged 15 commits into from
Apr 10, 2023

Conversation

ChaseWPDEV
Copy link
Collaborator

Implementation of MultiFitrep compairson mode. Alongside some additional fixes with the Redux implementation.

- Enable holding multiple FitReps in memory
- Fixed buggy label on bars
- Added rank dividing line for comparison mode
- Added Name Hovering highlights
- Fixed Table Multi row Editting
- Updated Flatpickr to work with Redux
@ChaseWPDEV ChaseWPDEV linked an issue Mar 9, 2023 that may be closed by this pull request
@twgardner2
Copy link
Owner

I'm getting webpack errors. Have a new laptop and just got everything re-installed and am able to npm install and build everything on main. Any ideas?:

[tom:~/Documents/navy_psr (multipleFitrepComparison)]$ npx webpack --mode development
asset ./dist/app.js 5.2 MiB [compared for emit] (name: app)
asset ./dist/style.min.css 7.28 KiB [compared for emit] (name: style)
asset ./dist/style.js 2.11 KiB [compared for emit] (name: style)
Entrypoint app 5.2 MiB = ./dist/app.js
Entrypoint style 9.39 KiB = ./dist/style.min.css 7.28 KiB ./dist/style.js 2.11 KiB
runtime modules 2.43 KiB 11 modules
orphan modules 10 KiB [orphan] 3 modules
modules by path ./node_modules/ 4.03 MiB
  javascript modules 4.02 MiB 753 modules
  json modules 3.33 KiB
    ./node_modules/pdf2json/package.json 1.38 KiB [built] [code generated]
    ./node_modules/levelup/package.json 1.96 KiB [built] [code generated]
modules by path ./src/ 84.3 KiB (javascript) 6.93 KiB (css/mini-extract)
  modules by path ./src/js/ 79.4 KiB 23 modules
  modules by path ./src/templates/ 4.82 KiB 7 modules
  modules by path ./src/scss/*.scss 50 bytes (javascript) 6.93 KiB (css/mini-extract)
    ./src/scss/styles.scss 50 bytes [built] [code generated]
    css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/scss/styles.scss 6.93 KiB [built] [code generated]
+ 9 modules

ERROR in ./src/js/data/providers/AbstractProvider.js 3:0-58
Module not found: Error: Can't resolve '@karmaniverous/serify-deserify' in '/home/tom/Documents/navy_psr/src/js/data/providers'
 @ ./src/js/data/providers/MultiDataProvider.js 3:0-54 5:39-55
 @ ./src/js/data/providers/DataProvider.js 3:0-56 15:26-43
 @ ./src/js/stores/records.js 4:0-62
 @ ./src/js/view/record-selector.js 3:0-65 10:47-55 10:89-97 12:17-25 46:8-26 47:17-25 52:34-42 56:8-26 57:17-25
 @ ./src/js/scripts.js 3:0-66 25:2-23

ERROR in ./src/js/stores/app-state.js 1:0-50
Module not found: Error: Can't resolve '@reduxjs/toolkit' in '/home/tom/Documents/navy_psr/src/js/stores'
 @ ./src/js/stores/view-settings.js 3:0-39 6:2-19 11:2-19 12:2-19 17:2-19 22:18-35 25:2-19 30:2-19 35:9-26 40:6-23 44:2-19 49:2-19 58:4-21 62:9-26
 @ ./src/js/scripts.js 5:0-57 30:4-16

ERROR in ./src/js/stores/app-state.js 2:0-71
Module not found: Error: Can't resolve '@karmaniverous/serify-deserify' in '/home/tom/Documents/navy_psr/src/js/stores'
 @ ./src/js/stores/view-settings.js 3:0-39 6:2-19 11:2-19 12:2-19 17:2-19 22:18-35 25:2-19 30:2-19 35:9-26 40:6-23 44:2-19 49:2-19 58:4-21 62:9-26
 @ ./src/js/scripts.js 5:0-57 30:4-16

ERROR in ./src/js/stores/slices/record-slice.js 1:0-47
Module not found: Error: Can't resolve '@reduxjs/toolkit' in '/home/tom/Documents/navy_psr/src/js/stores/slices'
 @ ./src/js/stores/app-state.js 3:0-50 8:13-26
 @ ./src/js/stores/view-settings.js 3:0-39 6:2-19 11:2-19 12:2-19 17:2-19 22:18-35 25:2-19 30:2-19 35:9-26 40:6-23 44:2-19 49:2-19 58:4-21 62:9-26
 @ ./src/js/scripts.js 5:0-57 30:4-16

ERROR in ./src/js/stores/slices/view-slice.js 1:0-56
Module not found: Error: Can't resolve '@karmaniverous/serify-deserify' in '/home/tom/Documents/navy_psr/src/js/stores/slices'
 @ ./src/js/stores/view-settings.js 4:0-190 6:20-35 11:20-29 12:20-31 17:20-35 25:20-31 30:20-37 44:20-35 49:20-36 57:64-83 57:88-106
 @ ./src/js/scripts.js 5:0-57 30:4-16

ERROR in ./src/js/stores/slices/view-slice.js 2:0-47
Module not found: Error: Can't resolve '@reduxjs/toolkit' in '/home/tom/Documents/navy_psr/src/js/stores/slices'
 @ ./src/js/stores/view-settings.js 4:0-190 6:20-35 11:20-29 12:20-31 17:20-35 25:20-31 30:20-37 44:20-35 49:20-36 57:64-83 57:88-106
 @ ./src/js/scripts.js 5:0-57 30:4-16

ERROR in ./src/js/stores/view-settings.js 1:0-58
Module not found: Error: Can't resolve '@karmaniverous/serify-deserify' in '/home/tom/Documents/navy_psr/src/js/stores'
 @ ./src/js/scripts.js 5:0-57 30:4-16

7 errors have detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.

webpack 5.76.1 compiled with 7 errors in 4394 ms

@ChaseWPDEV
Copy link
Collaborator Author

@twgardner2 Probably the node version. Use 16.13.2 (forgot to mention that) or 18.15 -- figured we were due to jump to one of the current LTS.

@twgardner2
Copy link
Owner

[tom:~/Documents/navy_psr (multipleFitrepComparison)]$ node -v
v18.15.0

@ChaseWPDEV
Copy link
Collaborator Author

Looks like you're missing some node_modules Have you run npm i recently?

@twgardner2
Copy link
Owner

yeah, I think that's the problem (missing modules, that is). I've run npm install, but had to use some option (--no-dependencies?) earlier just to get it to exit with status 0.

Here is without options:

[tom:~/Documents/navy_psr (multipleFitrepComparison)]$ npm i
npm WARN deprecated core-js-pure@3.20.2: core-js-pure@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js-pure.
npm ERR! code 1
npm ERR! path /home/tom/Documents/navy_psr/node_modules/node-sass
npm ERR! command failed
npm ERR! command sh -c node scripts/build.js
npm ERR! Building: /usr/bin/node /home/tom/Documents/navy_psr/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli   '/usr/bin/node',
npm ERR! gyp verb cli   '/home/tom/Documents/navy_psr/node_modules/node-gyp/bin/node-gyp.js',
npm ERR! gyp verb cli   'rebuild',
npm ERR! gyp verb cli   '--verbose',
npm ERR! gyp verb cli   '--libsass_ext=',
npm ERR! gyp verb cli   '--libsass_cflags=',
npm ERR! gyp verb cli   '--libsass_ldflags=',
npm ERR! gyp verb cli   '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@7.1.2
npm ERR! gyp info using node@18.15.0 | linux | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb find Python Python is not set from command line or npm configuration
npm ERR! gyp verb find Python Python is not set from environment variable PYTHON
npm ERR! gyp verb find Python checking if "python3" can be used
npm ERR! gyp verb find Python - executing "python3" to get executable path
npm ERR! gyp verb find Python - executable path is "/home/tom/.pyenv/versions/3.11.1/bin/python3"
npm ERR! gyp verb find Python - executing "/home/tom/.pyenv/versions/3.11.1/bin/python3" to get version
npm ERR! gyp verb find Python - version is "3.11.1"
npm ERR! gyp info find Python using Python version 3.11.1 found at "/home/tom/.pyenv/versions/3.11.1/bin/python3"
npm ERR! gyp verb get node dir no --target version specified, falling back to host node version: 18.15.0
npm ERR! gyp verb command install [ '18.15.0' ]
npm ERR! gyp verb install input version string "18.15.0"
npm ERR! gyp verb install installing version: 18.15.0
npm ERR! gyp verb install --ensure was passed, so won't reinstall if already installed
npm ERR! gyp verb install version is already installed, need to check "installVersion"
npm ERR! gyp verb got "installVersion" 9
npm ERR! gyp verb needs "installVersion" 9
npm ERR! gyp verb install version is good
npm ERR! gyp verb get node dir target node version installed: 18.15.0
npm ERR! gyp verb build dir attempting to create "build" dir: /home/tom/Documents/navy_psr/node_modules/node-sass/build
npm ERR! gyp verb build dir "build" dir needed to be created? /home/tom/Documents/navy_psr/node_modules/node-sass/build
npm ERR! gyp verb build/config.gypi creating config file
npm ERR! gyp verb build/config.gypi writing out config file: /home/tom/Documents/navy_psr/node_modules/node-sass/build/config.gypi
npm ERR! (node:155098) [DEP0150] DeprecationWarning: Setting process.config is deprecated. In the future the property will be read-only.
npm ERR! (Use `node --trace-deprecation ...` to show where the warning was created)
npm ERR! gyp verb config.gypi checking for gypi file: /home/tom/Documents/navy_psr/node_modules/node-sass/config.gypi
npm ERR! gyp verb common.gypi checking for gypi file: /home/tom/Documents/navy_psr/node_modules/node-sass/common.gypi
npm ERR! gyp verb gyp gyp format was not specified; forcing "make"
npm ERR! gyp info spawn /home/tom/.pyenv/versions/3.11.1/bin/python3
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args   '/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/gyp_main.py',
npm ERR! gyp info spawn args   'binding.gyp',
npm ERR! gyp info spawn args   '-f',
npm ERR! gyp info spawn args   'make',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/home/tom/Documents/navy_psr/node_modules/node-sass/build/config.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/home/tom/Documents/navy_psr/node_modules/node-gyp/addon.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/home/tom/.cache/node-gyp/18.15.0/include/node/common.gypi',
npm ERR! gyp info spawn args   '-Dlibrary=shared_library',
npm ERR! gyp info spawn args   '-Dvisibility=default',
npm ERR! gyp info spawn args   '-Dnode_root_dir=/home/tom/.cache/node-gyp/18.15.0',
npm ERR! gyp info spawn args   '-Dnode_gyp_dir=/home/tom/Documents/navy_psr/node_modules/node-gyp',
npm ERR! gyp info spawn args   '-Dnode_lib_file=/home/tom/.cache/node-gyp/18.15.0/<(target_arch)/node.lib',
npm ERR! gyp info spawn args   '-Dmodule_root_dir=/home/tom/Documents/navy_psr/node_modules/node-sass',
npm ERR! gyp info spawn args   '-Dnode_engine=v8',
npm ERR! gyp info spawn args   '--depth=.',
npm ERR! gyp info spawn args   '--no-parallel',
npm ERR! gyp info spawn args   '--generator-output',
npm ERR! gyp info spawn args   'build',
npm ERR! gyp info spawn args   '-Goutput_dir=.'
npm ERR! gyp info spawn args ]
npm ERR! Traceback (most recent call last):
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/gyp_main.py", line 51, in <module>
npm ERR!     sys.exit(gyp.script_main())
npm ERR!              ^^^^^^^^^^^^^^^^^
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/__init__.py", line 670, in script_main
npm ERR!     return main(sys.argv[1:])
npm ERR!            ^^^^^^^^^^^^^^^^^^
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/__init__.py", line 662, in main
npm ERR!     return gyp_main(args)
npm ERR!            ^^^^^^^^^^^^^^
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/__init__.py", line 629, in gyp_main
npm ERR!     [generator, flat_list, targets, data] = Load(
npm ERR!                                             ^^^^^
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/__init__.py", line 150, in Load
npm ERR!     result = gyp.input.Load(
npm ERR!              ^^^^^^^^^^^^^^^
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/input.py", line 3021, in Load
npm ERR!     LoadTargetBuildFile(
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/input.py", line 411, in LoadTargetBuildFile
npm ERR!     build_file_data = LoadOneBuildFile(
npm ERR!                       ^^^^^^^^^^^^^^^^^
npm ERR!   File "/home/tom/Documents/navy_psr/node_modules/node-gyp/gyp/pylib/gyp/input.py", line 239, in LoadOneBuildFile
npm ERR!     build_file_contents = open(build_file_path, "rU").read()
npm ERR!                           ^^^^^^^^^^^^^^^^^^^^^^^^^^^
npm ERR! ValueError: invalid mode: 'rU' while trying to load binding.gyp
npm ERR! gyp ERR! configure error 
npm ERR! gyp ERR! stack Error: `gyp` failed with exit code: 1
npm ERR! gyp ERR! stack     at ChildProcess.onCpExit (/home/tom/Documents/navy_psr/node_modules/node-gyp/lib/configure.js:351:16)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:513:28)
npm ERR! gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:291:12)
npm ERR! gyp ERR! System Linux 5.19.0-35-generic
npm ERR! gyp ERR! command "/usr/bin/node" "/home/tom/Documents/navy_psr/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd /home/tom/Documents/navy_psr/node_modules/node-sass
npm ERR! gyp ERR! node -v v18.15.0
npm ERR! gyp ERR! node-gyp -v v7.1.2
npm ERR! gyp ERR! not ok 
npm ERR! Build failed with error code: 1

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/tom/.npm/_logs/2023-03-12T21_36_58_465Z-debug-0.log

@ChaseWPDEV
Copy link
Collaborator Author

What's your npm -v ?

@twgardner2
Copy link
Owner

I just installed npm on this new machine this weekend. I think everything is decently up-to-date.

[tom:~/Documents/navy_psr (multipleFitrepComparison)]$ npm -v
9.5.0

@ChaseWPDEV
Copy link
Collaborator Author

Could be that the issue is on python 3.11. Is there an easy way for you to downgrade to 3.10?

@twgardner2
Copy link
Owner

I should be able to do that. I'm using pyenv, so you may see a new config file show up, but if you're not using pyenv, it should be a no-op for you.

@twgardner2
Copy link
Owner

Dude, that was it!

Ok, I have your branch up and running. I see the dashed yellow box, but what does it do?

@ChaseWPDEV
Copy link
Collaborator Author

OK, in parallel, and reviewing the code a bit more I went ahead and ran npm update and that should solve it for any env (removes some of the older libraries).

The dashed yellow box should be around "Sample-I-AM" the name of our sample sailor. Once you start to upload multiple Fitreps, the yellow box(es) become consequential/useful. (Sample gets clobbered on the first upload, assuming no one really cares about the sample)

@ChaseWPDEV
Copy link
Collaborator Author

  • rather than run npm update, you can just pull 1e198e1 and npm i from there to get the latest.

@twgardner2
Copy link
Owner

Ah, I did upload another FITREP expecting it to do something, but I need to upload 2?

@ChaseWPDEV
Copy link
Collaborator Author

yup -- 2 real(ish) ones

@twgardner2
Copy link
Owner

Oh wow, that's doing a lot of stuff! I gotta go eat dinner, but will check it out some more.

@twgardner2
Copy link
Owner

Oh, also looks like a test is failing...

@ChaseWPDEV
Copy link
Collaborator Author

Yeah, that makes sense -- node 12 should probably be dropped from the test list.

@ChaseWPDEV
Copy link
Collaborator Author

Also, If you haven't already, I strongly recommend adding Redux DevTools to your browser. With this latest rev, it will let you monitor the state and its changes as you interact with the app.

@ChaseWPDEV
Copy link
Collaborator Author

@twgardner2 Heads up: found and fixed a bug on this PR -- this branch's head is now at commit 0c03df0

@twgardner2
Copy link
Owner

twgardner2 commented Apr 3, 2023 via email

@ChaseWPDEV
Copy link
Collaborator Author

I tinkered with that -- vertical visual comparison of vertical data doesn't seem to add much value (at least to my eye:
image

@ChaseWPDEV
Copy link
Collaborator Author

@twgardner2 What if, on the overlay comparison mode, I add the associated last name just to the right of the last fitrep bullet? I could also have it fade in/ fade out along with the rest of that individual's graph.

@twgardner2
Copy link
Owner

I think that would help.

I'm basically onboard with merging, but I think I found some buggy behavior, let me know if that's what this is:

Steps to replicate:

  1. Load fresh app, viewing the SAMPLE-I-AM PSR
  2. Load two real PSRs (I'm doing mine and Erin's)
  3. Switch to 'Multi-View'

When I hover over the second PSR's chicklet, it brings its data to the forefront, but hovering over the first one doesn't do so. Is that on purpose?

@ChaseWPDEV
Copy link
Collaborator Author

Bug fixed and tailing last name added.

I also realized it probably not obvious that you can toggle records on/off in the multi-comparison view by clicking on the chicklet (good for quickly moving around between 3 or more), working on a way to make that more obvious.

@ChaseWPDEV
Copy link
Collaborator Author

@twgardner2 Toggle indicator for Multi view added. I think this (might) bring us up to a release candidate on this one.

@twgardner2
Copy link
Owner

Ok, I may have found two more things:

  1. If I load my PSR, then Erin's PSR, then click over to multi-view and have my mouse hovering over nothing (just whitespace on the page, neither chicklet), most of the command/RS bars go away, except for a relic that appears to be from my PSR. It seems to always be there, even when the bars are supposed to be blank. Is that what's going on?

image

  1. I like the checkboxes on the chicklets (those are new, right?), although they seem to be disabled, no? My first impression is that I should toggle the PSR by clicking specifically on the checkbox, but then it doesn't change. What do you think of that? I have found that if I do a lot of toggling, then the chicklets seem to get stuck and stop working. Have you seen this?

-Hide rep_sen_rg_g with other bars
@ChaseWPDEV
Copy link
Collaborator Author

@twgardner2 Right you are:

  • The first one was a missing css rule: added.
  • The whole chicklet is a click space to toggle a record, but the checkbox click events weren't bubbling correctly -- fixed.

-Fix single-multi toggle with hidden records
@ChaseWPDEV
Copy link
Collaborator Author

aaaannnnddd... a fix to the chicklets breaking after a lot of toggling (had to do with trying to recover from an empty data set)

@twgardner2
Copy link
Owner

You're a machine!

@twgardner2 twgardner2 merged commit 2548093 into main Apr 10, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Multiple Record Compairson
2 participants