* Replace all 4 instances of jBox-style modal dialog boxes with HTML dialog element
Notes:
- The Power & Battery (2), OSD, and CLI tabs have been updated accordingly
- HTML default control behavior was used whereever possible
- HTML indent for the dialog tag is deliberately off to minimize diff noise in GitHub
- Layout is not 100% identical, but spiratually the same - in most cases no changes were needed
- OSD’s Font Manager dialog didn’t transition cleanly, so includes some slight restyling
- OSD Font Manager previously had a green background/color for the graphic - that “just works” now
- Specific cleanup (i.e., calling destroy()) does not seem necessary and was removed
- Removal of jBox from setup.js and global scope seems not to affect jBox tooltips
- Replacement of single quotes with double in main.js was done automatically by Prettier
* Fix unclickable "Select custom image..." button in OSD tab due to overlapping layout; replace with CSS grid.
* Update OSD's Font Manager dialog to not have scroll bars by default (PR feedback).
* Update OSD's Font Manager dialog to remove overflow-y:scroll in order to avoid even a disabled scroll bar on some platforms/browsers (PR feedback).
Cordova integration and android platform :
- Added cordova directory with required config
- Added cordova applications generation in gulpfile
- Added cordova development instructions
- Used cordova plugins to simulate missing chrome api plugins (chrome.serial and chrome.fileSystem)
- Added cordova clipboard support
- Added android operating system and Cordova gui mode
- Fixed some css and js files to make them working on Android as well as on computers
- Added --skipdep argument to accelerate cordova build (gulp task)
- Added a webview helper to help people to update the webview app of their device
New options tab :
- Added options tab replacing the options dropdown
- Added option to switch between phones UI and computers UI
Mobile interface and global interface improvements :
- Simplified the structure of the header with flex css
- Made headerbar and tab container responsive (compact headerbar and side menu)
- All tabs are adapted to mobile interface (except firmware flasher)
- The servos and adjustments tabs are not fully adapted but are "usable"
- Improved header bar animation
- Improved log expandation animation
- Added swipe gesture to toggle side menu
Fixes during the development :
- Logo position
- Dark mode
- Auto connection
- Error messages (cordova_chromeapi.js)
- Responsive grid
- Testing
- Disconnection
- Width of boxes inside the OSD tab
- Fixed cli tab
- OSD tab
- Motor stop switch
- White spaces in boxes
- Dialogs size
- Connect button state
- Prevent tablet with a height larger than 575px to switch to computers ui
- Fixed logging tab
- Fixed code smell
- Fixed yarn cordova plugin install issue
- Fixed content_wrapper
- Fixed vibrations when scrolling
- Fixed scrolling bar alignment
- Fixed dialogReportProblem height
- Fixed rates logo
- Fixed auto connection default value (true)
- Fixed D to D max
- Fixed dialogs
Added required messages in locales/en/messages.json file
Requested changes
* separate our styling from a libraries included .css
* update npm packages: bluebird, inflection, jbox, jquery, jquery-ui-npm
* ports and osd tabs needed small javascript changes for the above
* refactored CSS style sheets, in summary Cascading was being ignored
* tweaked colors in dark mode.
* tweaked betaflight logo for dark mode care of frozenskys
* dark mode can also trigger on `(prefers-color-scheme: dark)` signal from the OS when NW.js 0.40.0/Chrome 76 is released.
* changed how `gulp-appdmg` is brought in, mixing yarn and npm was causing trouble
* version.json is now written in a more gulpful manner
Note: this works fine with NW.js 0.40.0-beta1
