Restructure front end

[baconbrad]

We had a brief conversation on Facebook this morning about restructuring the front end. Then @mmitton and I discussed it a little in a PM.

The current goal is to make the front end a little more developer friendly. And the end user code bandwidth friendly.

What we are leaning towards is creating a client directory. Our code for the front end will rest in there. In it will be a package.json. This will have all our third party front end dependencies listed, our dev dependencies, etc. Devs who wish to maintain the client will need to install Node.js and run npm install. Running say npm run build or something like it could build the source and put a distribution version in the root of the client. Doing this we can minify the source, make tests, lint, etc. And the source will be restructured to be easier to maintain in an editor and we can have some automated quality control of the client.

Both the source and distribution will be provided on the repo. Minus the node_modules directory which contain the unbuilt dependencies.

The html directory is being untouched for the current time. Until we make this transition completely. Afterwords it will be removed and you would develop out of client/src and your source will build to client directory.

The only changes on the server side would be path changes. And the end users would only notice path/file changes and nothing would be different for them.

If anyone has any objections, suggestions, changes, etc to this plan please feel free to comment.

[baconbrad]

Todo: build.sh

• Check if NPM is installed. If so build client.
• Update version in package.json with given version.

[baconbrad]

Todo: Client Views

• Uniformed views directory.
• Strip html tags, head tags, body tags, scripts and stylesheets from views.
• Make view loader. (SPA application that handles scripts and styles as well)
• Allow views to load in a custom script or stylesheet for view.
• Allow views to be loaded directly from URL as well.
• All views are to be used this way, including controls, root views, views in view folder.

[baconbrad]

Todo: Scripts and Styles

• Fonts directory only contains font files. No style sheets.
• All style sheets will be in the css directory.
• All scripts will be in the js directory.
• Give uniform names to files. (IE windowFunctions.js should be window.js)

[baconbrad]

Todo: Third Party Dependencies

• Drop jQuery UI.
• Drop Colorpicker and Spectrum. (Appear unused and there are lighter alternatives)
• Built versions in the appropriate css and js directories.
• Add Bootstrap 3.X.
• Add Datatables.net (Powerful table plugin for jQuery)
• Add any other dependencies to appropriate css and js directories.
• Drop isjquery plugin. (We assume the property exists. If not they have bigger problems.)
• Drop fileupload plugin. (We assume they are running on a modern browser, we can do better with less code/complication.)