diff --git a/lib/gui/app/components/featured-project/featured-project.jsx b/lib/gui/app/components/featured-project/featured-project.jsx new file mode 100644 index 00000000..b813197b --- /dev/null +++ b/lib/gui/app/components/featured-project/featured-project.jsx @@ -0,0 +1,56 @@ +/* + * Copyright 2016 resin.io + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +'use strict' + +const React = require('react') +const SafeWebview = require('../safe-webview/safe-webview.jsx') +const settings = require('../../models/settings') +const analytics = require('../../modules/analytics') +const endpoint = null + +class FeaturedProject extends React.Component { + constructor (props) { + super(props) + + this.state = { + endpoint + } + } + + componentDidMount () { + return settings.load() + .then(() => { + if (settings.has('featuredProjectEndpoint')) { + this.setState({ endpoint: settings.get('featuredProjectEndpoint') }) + } else { + this.setState({ endpoint: 'https://assets.balena.io/etcher-featured/index.html' }) + } + }) + .catch(analytics.logException) + } + + render () { + return (this.state.endpoint) ? ( + + + ) : null + } +} + +module.exports = FeaturedProject diff --git a/lib/gui/app/components/featured-project/index.js b/lib/gui/app/components/featured-project/index.js new file mode 100644 index 00000000..033edb9e --- /dev/null +++ b/lib/gui/app/components/featured-project/index.js @@ -0,0 +1,34 @@ +/* + * Copyright 2016 resin.io + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +'use strict' + +/** + * @module Etcher.Components.FeaturedProject + */ + +const angular = require('angular') +const { react2angular } = require('react2angular') + +const MODULE_NAME = 'Etcher.Components.FeaturedProject' +const FeaturedProject = angular.module(MODULE_NAME, []) + +FeaturedProject.component( + 'featuredProject', + react2angular(require('./featured-project.jsx')) +) + +module.exports = MODULE_NAME diff --git a/lib/gui/app/components/safe-webview/index.js b/lib/gui/app/components/safe-webview/index.js new file mode 100644 index 00000000..b929587e --- /dev/null +++ b/lib/gui/app/components/safe-webview/index.js @@ -0,0 +1,34 @@ +/* + * Copyright 2018 resin.io + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +'use strict' + +/** + * @module Etcher.Components.SafeWebview + */ + +const angular = require('angular') +const { react2angular } = require('react2angular') + +const MODULE_NAME = 'Etcher.Components.SafeWebview' +const SafeWebview = angular.module(MODULE_NAME, []) + +SafeWebview.component( + 'safeWebview', + react2angular(require('./safe-webview.jsx')) +) + +module.exports = MODULE_NAME diff --git a/lib/gui/app/components/safe-webview.js b/lib/gui/app/components/safe-webview/safe-webview.jsx similarity index 93% rename from lib/gui/app/components/safe-webview.js rename to lib/gui/app/components/safe-webview/safe-webview.jsx index d938df2d..d30d6ba1 100644 --- a/lib/gui/app/components/safe-webview.js +++ b/lib/gui/app/components/safe-webview/safe-webview.jsx @@ -20,17 +20,12 @@ const _ = require('lodash') const electron = require('electron') -const angular = require('angular') const react = require('react') const propTypes = require('prop-types') -const { react2angular } = require('react2angular') -const analytics = require('../modules/analytics') -const store = require('../models/store') -const settings = require('../models/settings') -const packageJSON = require('../../../../package.json') - -const MODULE_NAME = 'Etcher.Components.SafeWebview' -const angularSafeWebview = angular.module(MODULE_NAME, []) +const analytics = require('../../modules/analytics') +const store = require('../../models/store') +const settings = require('../../models/settings') +const packageJSON = require('../../../../../package.json') /** * @summary Electron session identifier @@ -274,6 +269,4 @@ SafeWebview.propTypes = { } -angularSafeWebview.component('safeWebview', react2angular(SafeWebview)) - -module.exports = MODULE_NAME +module.exports = SafeWebview diff --git a/lib/gui/app/pages/main/main.js b/lib/gui/app/pages/main/main.js index 97448c19..62d26acf 100644 --- a/lib/gui/app/pages/main/main.js +++ b/lib/gui/app/pages/main/main.js @@ -40,6 +40,7 @@ const MainPage = angular.module(MODULE_NAME, [ require('../../components/image-selector'), require('../../components/warning-modal/warning-modal'), require('../../components/file-selector'), + require('../../components/featured-project'), require('../../os/open-external/open-external'), require('../../os/dropzone/dropzone'), diff --git a/lib/gui/app/pages/main/templates/main.tpl.html b/lib/gui/app/pages/main/templates/main.tpl.html index b0f220ae..6325e0ff 100644 --- a/lib/gui/app/pages/main/templates/main.tpl.html +++ b/lib/gui/app/pages/main/templates/main.tpl.html @@ -90,6 +90,12 @@ + + +
diff --git a/lib/gui/app/scss/main.scss b/lib/gui/app/scss/main.scss index 3c0df095..adb1116a 100644 --- a/lib/gui/app/scss/main.scss +++ b/lib/gui/app/scss/main.scss @@ -155,7 +155,7 @@ body, bottom: 0; left: 0; width: 100%; - height: 255px; + height: 320px; } } @@ -174,3 +174,22 @@ body, padding-right: 3px; } } + +featured-project { + webview { + flex: 0 1; + height: 0; + width: 0; + } + + &.isFlashing webview { + width: 480px; + height: 360px; + position: absolute; + z-index: 1; + left: 5%; + top: 10%; + border-radius: 7px; + overflow: hidden; + } +} diff --git a/lib/gui/css/main.css b/lib/gui/css/main.css index ac632e73..46f5e808 100644 --- a/lib/gui/css/main.css +++ b/lib/gui/css/main.css @@ -9933,7 +9933,7 @@ body, bottom: 0; left: 0; width: 100%; - height: 255px; } + height: 320px; } .wrapper { height: 100%; @@ -9946,3 +9946,18 @@ body, .section-header > .button { padding-left: 3px; padding-right: 3px; } + +featured-project webview { + flex: 0 1; + height: 0; + width: 0; } + +featured-project.isFlashing webview { + width: 480px; + height: 360px; + position: absolute; + z-index: 1; + left: 5%; + top: 10%; + border-radius: 7px; + overflow: hidden; } diff --git a/lib/gui/etcher.js b/lib/gui/etcher.js index 7b2d1e9a..878dfa02 100644 --- a/lib/gui/etcher.js +++ b/lib/gui/etcher.js @@ -35,7 +35,7 @@ let mainWindow = null const createMainWindow = () => { mainWindow = new electron.BrowserWindow({ width: 800, - height: 380, + height: 480, useContentSize: true, show: false, resizable: Boolean(config.fullscreen),