I'm not sure how this will be achieved. Probably a library.

After running http://jshint.com/ on my site and speaking with Robert, I found a few things:

• Add semi-colons for functions in MICROSTOCKS!
• Ensure ALL variables for use in the function are declared at the top (for loops especially! var i!)
• playerObject["stats"] is better referenced as playerObjects.stats

This is for readability and portability. If I rename a playerObject class, I only have to change it in two places instead of the whole function.

• Add vehicle/boat/train noise when you travel
• Add some background ambient 90s weather channel music
• Also add SFX control if the SFX issue is taken care of
• Ensure this is part of the new gear icon
• Make sure sound files are small to reduce load time/website size.

Make sure to playtest and see what this does.

Javascript Improvements

• Use jQuery ready instead of DOMContentLoaded, because of cross-browser support
• Write a MICROSTOCKS.init function that does all the stuff that's currently in the anonymous function for DOMContentLoaded
• After writing MICROSTOCKS.init, make a lot of the the public methods and variables private in the MICROSTOCKS modules

SCSS Improvements

• Take everything out of body - it doesn't need to be there! The space selector is expensive and we don't want unnecessary specificity!!!

I have to think of the best way to implement this... a modal pop up with a dropdown maybe?

• _I need to make each location have an X,Y vector_: so I can at least roughly calculate length in-between planets and charge for travel accordingly.
• _Change Travel Destinations_: These should probably be planets or even randomly generated planets? 👍
• _Add Dropdown/Travel Modal_
• _Increase Travel Cost_: we don't want people to be able to manipulate the market really easy, and now that resources are going to shift wildly, we can't have travel be cheap! This needs to probably vary from planet to planet, depending on how far each one is from each other; I need to find a way to represent that in the code.

I plan to make an "event log" where things will happen and alter prices of resources temporarily on certain planets.

Either use a notification system like this: http://www.erichynds.com/examples/jquery-notify/ or just the log like I've been using.

The reason for this is to entice players to leave and go to other planets to get good deals on stuff.

The format should follow this:
EVENT happened at PLACE and caused RESOURCE to plummet/raise!

I should also update the planet list to have (XXX +4, YYY -2) or whatever when I figure out the event log stuff, so the player knows at a glance what is going on in that planet.

After I implement this, I should work on issue #38.

I'm thinking resource cost can be an area graph like everything else, with maybe some kind of a composite "entire stock market" graph showing values! That would be so neat!

Also, I'm thinking of making a donut graph to show how much time you've spent in each location, since area chart doesn't really seem like a good way to represent that data.

• _Add gameData tracking for resources_: cost over time
• _Create Resource Cost area graph_
• _Create Mega Stock Market area graph_
• _Add gameData tracking for location_: As in, how long a player has spent as X location out of the total time he's alive. This will be used to generate a graph when the user clicks on a new "History" button in the inventory section. This can be done in the "updateGameData" function.
• _Create Location donut graph_

Also as part of this I'll need to make the dialogue/menu it creates. I'm thinking that it will let you adjust color of the website and dialogues as a baseline.

Also as part of this, I need to implement a "sticky header," so when the user scrolls down to interact with stocks/resources, they can still see the "microstocks" header along the top, and the gear icon to the right or wherever I decide to put it. The height of the header bar shouldn't change, it's just essentially turning into a very stripped down nav. The less animation the better for this one I think,

The resources section is popping with those borders, so I think I want to implement that same style to the buttons in the controls section, and the information in the inventory section (I think eventually the inventory section will be clickable and display your money over time, portfolio over time, etc. as mentioned in issue #7).

• _Research UX/UI for fun clicky games_
• _Controls need touch ups_
• _Inventory section needs touch up_
• _Style Dropdown in Travel Modal_

After speaking with my econ major friend Kyle, he let me know a few things after playing the game.

• _Stick with the slow-growth economy_: so that if you did buy one of everything, you'd slowly succeed. The market is too volatile/stagnant/random as it is. Might as well sit on your portfolio and hope for a huge increase - there is no strategy involved.
• _Make different stocks on different dice rolls_: make some stable, generally (but not always) trending up by $1-$2 dollars. make some volatile(upwards) v(stag) and v(down). make some stable but failing. Currently every stock is treated the same, when really they'd be from different risk companies.
  • Note: I really like this idea, this will probably be the first thing I implement
• _Bankruptcy_: when a stock gets to like value <$1, the stock should be canceled, all of the stock you have in that company nulled, and a new company replaces it.
  • Note: Totally agree, that keeps it fresh too!

• Make the Buy/Sell/Cancel buttons easier to click
• Increase font size
• Increase icon size

I see some bad data when I let prices go. Graphs aren't updating when prices are the same, which is weird.

Should be pretty easy to fix, it's in buySellDialogue in the javascript.

This is to be able to make a bigger market, we can have travel take place between planets, and then resources can deviate based on planet.

In order to change the resources, I'll have to do a couple things:

• _Remove "stock" from website_: Except for the title obviously. I need to replace the verbage on the website to say "resources" instead of "stock".
• _Think of some space resource names_: Or I could just stick the randomly generated ones?
  • Also just found this list of fictional elements, might be useful!
  • I might just end up making a random mineral name generator? Seems like I could take pieces of the fictional (and real) elements, and just mash them up.
  • _I ended up just using my same 3-letter randomly generated names._
• _Make different resource types on different dice rolls_: make some stable, generally (but not always) trending up by $1-$2 dollars. make some volatile(upwards) v(stag) and v(down). make some stable but failing.
  • I probably just need to augment the playerObject["stats"].resources object to have a "trendAmount" or "maxFlux" or something like that (based off of the type of resource it is, whether it be stable-stagnant, volatile-stagnant, stable-down, stable-up, volatile-up, etc.), then instead of just using "variant" in updateResourcePrices() I'll use THAT resource's maxFlux.
  • We're going to need different icons to complete issue #8 anyway, so I'll just leave the notes here on which icons I'm favoring for "types" of resource
    • fa-qrcode for generic resource
    • fa-paw for natural
    • fa-heartbeat for medical
    • fa-diamond for financial or rare
  • Note: I really like this idea, this will probably be the first thing I implement
• _Bankruptcy_: when a resource gets to like value <$1, the resource should be canceled, all of the resource you have is nulled, and a new resource replaces it.
  • Note: Totally agree, that keeps it fresh too!

I need to make the website look good pure HTML, then HTML + CSS, then HTML + CSS + JavaScript.

This will also help me handle when scripts aren't loaded because CDNs are down (rare but definitely a use case).

This issue is for general visual improvements. Please note anything so I can add it to the master list!

Modals for buying and selling:

• Improve title bar and close button
• Improve buttons (eww gradients why)
• Make the font look normal instead of just a little bit bigger for no reason

Actual stock boxes inside the resource section:

• Create multiple spans inside the HTML list element
  • Will probably need an addResourceBox() function that will call addListItem() with special params?
• Need the resource name on it's own line

UX:

• Let the user know to click resources in a better way

I should make the resource plummet after it hits max value. The aim is that the player has to sell it gets too high or they could lose their large investment!

I can probably use the "Location" button for this.

This button will display some information about the planet you are on (this can be done easily by augmenting the objects inside of the locations array). I'll probably add a few properties, like:

• Min Temp
• Max Temp
• Planet Type
  • https://en.wikipedia.org/wiki/Planets_in_science_fiction#Planet_types
• Native Resource (I plan on using this for "resource discovery" later on - the planet will discover more of it's native resource only - making the price of that resource super cheap even though it's worth a lot)
  • This ties in directly with issue #38.

Throwing strings and not catching them is really bad for a website. I need to fix this. I'm killing my program's execution flow when I just throw without catching, as you can see in the throw page for MDN.

It doesn't happen everytime, but on my game i had VOD at -$1 and i bought 100 shares and my cash went up by 100, i gained 100 shares of VOD, and VOD went to $0.

You probably are just missing an abs() somewhere in your code.

Also as part of this I could probably "variable-ize" the $10 you spend to travel, instead of hard coding it.

This button will do a few things:

• Increase the player's money equivalent to the amount of resources they HAD multiplied by the cost of that resource
• Set the player's resource amount for that resource to 0
• Slide the slider all the way to it's maximum

Clicking the "History" button seems superfluous, you should be able to see how the resource is doing as soon as you click on it! This means initing the graph a little sooner, but it shouldn't be too bad!

Probably highlight it, like make it the second thing after the company name and icon/type, but probably on its own line.

Need to look into why this is happening, but more interestingly why this is showing as a decrease instead of an increase. That will probably give me a hint.

The animation should consist of a ship leaving one planet and then space, and then flying in/wrapping around the new one.

To play it, fade the screen out and have it appear in front of everything just for a second.

Don't have any ideas how I'm going to do this - look into animating stuff fullscreen with HTML5 or something probably? Overtake body in javascript maybe? Maybe just have a wrapper-div that only shows when the animation is playing?

For instance, you are on planet XYZ and they have resource ABC as a native resource - so when you are there it's 50% the cost.

Right now I'm just using "cost" for the inventory and math... so I'm going to need to write like a "buyWithSale" or something which will take in a saleAmount then handle all the math that way so the graphs will remain correct (I don't want to mess with the actual cost - or perhaps a "buyStock(salePrice)" function which will take an argument that could be a sale price?)

Dependencies

• Issue #34
• Issue #39

• Remove ability to scroll when modal is out on mobile
• Need to have modals expand to full width on modal (and full-height if possible).

Types of graphs needed:

• _Line:_ Cash, Net Worth, Portfolio, Resource Value
• _Donut:_ Location? (time spent)

Love this library, with the mouse overs with data and such: http://morrisjs.github.io/morris.js/

I'd like to have each resource have a graph visualization of it's cost over time.

The pop up when you click the stock will have a button that says: "Statistics" or "History" that will show a crude graph of where it's been, in addition to the "buy" "sell" and "cancel" button.

• Maybe even drop the "cancel" button in favor of the "X" and make the "X" close the previous modals for buy/sell/stats?
• Also I could attach that pop-up behavior (if I write it as a method) to the "resource-decrease" and "resource-increase" classes in the log (showing when resource prices are falling and rising). If you hover over them (change cursor to pointer!) you will get a graph of their history!
• I'm going to need to have a large "data" module (sort of like the morris library uses) which I will extend anytime updateInventory is called to store historical data, so creating graphs will be easy. I should have measured (not sure where all this info will be present on the website, but I forsee all this data being useful):
  • Cash
  • Portfolio
  • Total Worth
  • Each Resources Value
  • Total Market Value

Maybe even try to forecast future stock prices after I implement the different types in issue #17.

Also:

• Let the user know to click stocks better (Improve UX somehow)
• Look up a library to improve dialogue (don't use alerts you dumbass)
  • Use sliders with locked ranges probably for stock amounts based on how much the user can buy/sell
• Maybe use this library for the gear icon issue?

I'd like to have a high score system that the player can see, consisting of other players and their high scores. I might have to impose a turn limit or perhaps a "done" button to get a final score.

• High Score requirements
  • Name entry
  • Document score
  • Close button
  • Accessible via new gear?

Ugh.