diff --git a/components/configuration/VFBToolbar/vfbtoolbarHTML.js b/components/configuration/VFBToolbar/vfbtoolbarHTML.js index 6cf644186..c0dcb920f 100644 --- a/components/configuration/VFBToolbar/vfbtoolbarHTML.js +++ b/components/configuration/VFBToolbar/vfbtoolbarHTML.js @@ -355,4 +355,15 @@ var contribute + " " + " "; -module.exports = { about, feedback, contribute }; +var quickHelp += "
" + + "
" + + "
Quick Help for : Virtual Fly Brain
" + + "
" + + "" + + "" + + "
" + + "
" + + "
"; + +module.exports = { about, feedback, contribute, quickHelp}; diff --git a/components/configuration/VFBToolbar/vfbtoolbarMenuConfiguration.js b/components/configuration/VFBToolbar/vfbtoolbarMenuConfiguration.js index b0622d4a1..4a48cdcad 100644 --- a/components/configuration/VFBToolbar/vfbtoolbarMenuConfiguration.js +++ b/components/configuration/VFBToolbar/vfbtoolbarMenuConfiguration.js @@ -457,6 +457,14 @@ var toolbarMenu = { handlerAction: "clickFeedback", parameters: [] } + }, + { + label: "Click Help", + icon: "fa fa-book", + action: { + handlerAction: "clickQuickHelp", + parameters: [] + } } ] } diff --git a/components/interface/VFBToolbar/VFBToolBar.js b/components/interface/VFBToolbar/VFBToolBar.js index b5fd3ac2d..8061642f8 100644 --- a/components/interface/VFBToolbar/VFBToolBar.js +++ b/components/interface/VFBToolbar/VFBToolBar.js @@ -72,12 +72,14 @@ export default class VFBToolBar extends React.Component { this.aboutHTML = require('../../configuration/VFBToolbar/vfbtoolbarHTML').about; this.feedbackHTML = require('../../configuration/VFBToolbar/vfbtoolbarHTML').feedback; this.contributeHTML = require('../../configuration/VFBToolbar/vfbtoolbarHTML').contribute; + this.quickHelpHTML = require('../../configuration/VFBToolbar/vfbtoolbarHTML').quickHelp; this.clickAbout = this.clickAbout.bind(this); this.menuHandler = this.menuHandler.bind(this); this.clickFeedback = this.clickFeedback.bind(this); this.clickContribute = this.clickContribute.bind(this); + this.clickQuickHelp = this.clickQuickHelp.bind(this); } componentWillMount () { @@ -213,6 +215,12 @@ export default class VFBToolBar extends React.Component { this.props.htmlOutputHandler(htmlContent); window.ga('vfb.send', 'pageview', (window.location.pathname + '?page=Contribute')); } + + clickQuickHelp () { + var htmlContent = this.quickHelpHTML; + this.props.htmlOutputHandler(htmlContent); + window.ga('vfb.send', 'pageview', (window.location.pathname + '?page=Tutorial')); + } menuHandler (click) { switch (click.handlerAction) { @@ -234,6 +242,9 @@ export default class VFBToolBar extends React.Component { case 'clickContribute': this.clickContribute(); break; + case 'clickQuickHelp': + this.clickQuickHelp(); + break; default: return this.props.menuHandler(click); } diff --git a/images/splash.png b/images/splash.png new file mode 100644 index 000000000..98c63f493 Binary files /dev/null and b/images/splash.png differ diff --git a/tests/jest/vfb/menu-component-tests.js b/tests/jest/vfb/menu-component-tests.js index 7a13f2718..f098f3af8 100644 --- a/tests/jest/vfb/menu-component-tests.js +++ b/tests/jest/vfb/menu-component-tests.js @@ -82,9 +82,9 @@ describe('VFB Menu Component Tests', () => { await page.evaluate(async () => document.getElementById("Help").click()); // Wait for drop down menu of 'Help' to show await wait4selector(page, "ul.MuiList-root", { visible: true, timeout : 120000 }) - // Check there's three elements in the drop down menu of 'Help' + // Check there's four elements in the drop down menu of 'Help' const dropDownMenuItems = await page.evaluate(async () => document.getElementsByClassName("MuiListItem-root").length); - expect(dropDownMenuItems).toEqual(3); + expect(dropDownMenuItems).toEqual(4); }) it('Help Modal FAQ Tab Opened', async () => { diff --git a/webpack.config.js b/webpack.config.js index a64c30143..c01fadecb 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -3,6 +3,8 @@ var webpack = require('webpack'); var HtmlWebpackPlugin = require('html-webpack-plugin'); var CopyWebpackPlugin = require('copy-webpack-plugin'); var MiniCssExtractPlugin = require("mini-css-extract-plugin"); +var fs = require('fs'); + /* *var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; * <%=htmlWebpackPlugin.options.GEPPETTO_CONFIGURATION._webapp_folder%> @@ -28,6 +30,17 @@ var availableExtensions = []; availableExtensions.push({ from: path.resolve(__dirname, geppetto_client_path, "static/*"), to: 'static', flatten: true }); availableExtensions.push({ from: 'tutorials/*', to: './', flatten: true }); availableExtensions.push({ from: 'model/*', to: './', flatten: true }); + +const splashLoadingImage = 'images/splash.png'; + +try { + if (fs.existsSync(splashLoadingImage)) { + availableExtensions.push({ from: splashLoadingImage, to: './', flatten: true }); + } +} catch (err) { + console.error(err) +} + console.log(availableExtensions); module.exports = function (env){