Bower

Overview

End Goals

1. Centralize and organize all front-end assets in one flexible path (ie. can move entire path to the assets without breaking scripts).
   • Use bower to collect and organize the front-end assets.
2. Migrate all the front-end assets(of which there are multiple versions of many of the front-end assets) to most current version.
3. Ability to install all front assets via bower (if ever decide to not include them in the codebase).

More Details

Assets that are collected via bower are stored at public/assets; note this location is flexible since we are not sure where we will be storing these in the future as migrate to MVC architecture.

• The path is set to a global ($GLOBALS['assets_static_relative']) here in the codebase(so the path will be easy to change in the future) and also would need to be changed in the .bowerrc file):

• https://github.com/openemr/openemr/commit/b63b0da6a5eae6f8051234bff104a06cb37db167
• (also see above commit for a example on using the global/path)

• Incorporating the versions in the paths of the libraries.

ignoredDependencies setting in .bowerrc file.

Using "ignoredDependencies" in .bowerrc file to ignore sub-dependencies which makes things messy(would bring in paths without versions of which would be a redundant library).

• bootstrap
• datatables
• datatables.net-jqui
• datatables.net-scroller
• datatables.net
• jquery
• imagesloaded
• react

scripts that required hard-coded path to the assets

These are scripts where was unable to use the globals path for the assets directory(thus if move the assets directory, then would need to adjust these scripts).

• acknowledge_license_cert.html
• setup.php

Add New Asset

Bower Method (preferred)

1. Add entry to the bower.json file.
2. 'bower install' command
3. Remove .gitignore and .gitattributes files(if they are present) from the installed package.
   • This is now automated via Composer and the build.xml script.
4. Remove test scripts or anything that may cause a vulnerability (such as example scripts that allow file uploading; note this is very unlikely to be the case, but good to check).
   • This is now automated via Composer and the build.xml script.
5. Add to below list of assets.

Manual Method (only if bower method is not supported by package)

1. If there is no bower support and package is not a supported git repo, then will need to bring in manually into the manual-added-packages sub-directory. See below shortcut.js-2-01-B asset for example.
2. Remove .gitignore and .gitattributes files(if they are present) from the installed package.
   • This is now automated via Composer and the build.xml script.
3. Remove test scripts or anything that may cause a vulnerability (such as example scripts that allow file uploading; note this is very unlikely to be the case, but good to check).
   • This is now automated via Composer and the build.xml script.
4. Add to below list of assets (and document there if removed any files).

Current Assets

ckeditor-4-7-0 (Sherwin plans to use to modernize forms)

• Brought in 'full' version

datatables.net-bs-1-10-13

• This is the bootstrap styling for datatables-1-10-13.

datatables.net-dt-1-10-13

• This is the generic styling for datatables-1-10-13.

datatables.net-jqui-1-10-13

• This is the jquery-ui styling for datatables-1-10-13.

datatables.net-colreorder-1-3-2

• This is an extension for datatables-1-10-13.

datatables.net-colreorder-dt-1-3-2

• This is the generic styling for datatables.net-colreorder-dt-1-3-2.

datatables.net-scroller-1-4-2

• This is an extension for datatables-1-10-13.

datatables.net-scroller-jqui-1-4-2

• This is the jquery-ui styling for datatables.net-scroller-1-4-2.

emodal-1-2-65

• To support modern jquery versions, we needed to make the following changes in this asset:

• https://github.com/openemr/openemr/commit/0e86d7eb147bf65166f58a6e0c702f4f56591a8a

• In future, when a new version is out that addresses this issue, will bring in the new version. And if there is not a new version that addresses this issue, then plan to fork it and maintain it.

jquery-datetimepicker-2-5-4

Use the files in build directory (and do NOT use build/jquery.datetimepicker.min.js)

jquery-min-*

• Contain the jquery library files. This is brought in via bower by direct html download since the old versions are not available in repo (need to be built) and only 1 file is needed for these numerous different versions of jquery.
• jquery-min-1-10-2 is used by datatables.net-1-10-13

jscolor-1-4-5

• Need to keep this version until update where it is used (not compatible with more recent jscolor version).

modernizr-3-5-0

After collect via bower, need to do the following to create the dist/modernizr-build.js script:

• cd public/assets/modernizr-3-5-0
• npm install
• grunt build
• rm -fr node_modules

shortcut.js-2-01-B

• Not supported by bower, so brought in manually to the manual-added-packages sub-directory.
• In future, can likely bring this in via bower via http method.

summernote-0-8-2

• Note this has a plugin system that is not supported by bower and need to manually copy in the plugins into the asset. Here are the plugin(s) that were placed manually:

• The Nugget plugin was placed at summernote-0-8-2/dist/plugin/nugget/*

Questions

Development is ongoing for this project:

• Ideal directory for this stuff (this is why we have made it flexible so can easily change this in the future)
• Ideal syntax of the bower openemr package

Forum

• assets directory