Skip to content

Commit

Permalink
Added check for showWindowControls 'left'
Browse files Browse the repository at this point in the history
  • Loading branch information
@moso
moso committed Mar 9, 2018
1 parent a729cfa commit 301aeec
Showing 1 changed file with 279 additions and 0 deletions.
279 changes: 279 additions & 0 deletions index.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,279 @@
'use strict'

const isWin = process.platform === 'win32';
let dirname = __dirname;
const remote = require('electron').remote;

// Windows needs a regex because reasons
if (isWin == true) {
dirname == dirname.replace(/\\/g, '/');
}

exports.decorateConfig = (config) => {
const controlLeft = config.showWindowControls;

if(controlLeft == 'left') {
return Object.assign({}, config, {
css: `
${config.css || ''}
.hyper_main {
border-top: 1px solid #565a67 !important;
}
.header_header {
display: flex;
flex-direction: row-reverse;
top: 1px !important;
left: 1px !important;
right: 1px !important;
}
.header_windowHeader {
width: calc(100% - 89px);
height: 35px;
margin-left: 89px;
background-color: #383c4a;
border: 0 !important;
border-top: 1px solid #565a67;
}
.header_windowHeader .header_hamburgerMenuLeft,
.header_windowHeader .header_hamburgerMenuRight {
width: 40px;
height: 35px;
padding: 0 15px;
}
.tabs_nav {
width: 100%;
top: 35px;
}
.header_windowControls {
display: none;
}
.header_appTitle {
margin-left: -89px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, Roboto, Oxygen, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: 700;
color: #fff;
}
.pocillo_header {
position: absolute;
right: auto !important;
left: 0 !important;
width: 89px;
height: 35px;
padding-right: 0 !important;
padding-left: 5px !important;
background-color: #383c4a;
}
.pocillo_actions {
display: flex;
flex-direction: row-reverse !important;
align-items: center;
justify-content: space-between;
height: 35px;
margin: 0;
padding: 0;
list-style-type: none;
}
.pocillo_actions > li {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
border-radius: 50%;
}
.pocillo_actions > li > svg {
width: 24px;
height: 24px;
}
.pocillo_actions > li > svg path {
fill: #afb1b7 !important;
}
.pocillo_actions > li:hover,
.pocillo_actions > li:active {
background-color: #565965;
}
.pocillo_actions > li:hover > svg path,
.pocillo_actions > li:active > svg path {
fill: #fff !important;
}
.pocillo_actions > li.pocillo_close {
background-color: #a34f6d;
}
.pocillo_actions > li.pocillo_close:hover,
.pocillo_actions > li.pocillo_close:active {
background-color: #b16983;
}
.pocillo_actions > li.pocillo_close > svg path,
.pocillo_actions > li.pocillo_close:hover > svg path,
.pocillo_actions > li.pocillo_close:active > svg path {
fill: #fff !important;
}
`
})
}

return Object.assign({}, config, {
css: `
${config.css || ''}
.hyper_main {
border-top: 1px solid #565a67 !important;
}
.header_header {
display: flex;
top: 1px !important;
left: 1px !important;
right: 1px !important;
}
.header_windowHeader {
width: calc(100% - 89px);
height: 35px;
background-color: #383c4a;
border: 0 !important;
}
.header_windowHeader .header_hamburgerMenuLeft,
.header_windowHeader .header_hamburgerMenuRight {
width: 40px;
height: 35px;
padding: 0 15px;
}
.tabs_nav {
width: 100%;
top: 35px;
}
.header_windowControls {
display: none;
}
.header_appTitle {
margin-left: 89px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, Roboto, Oxygen, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: 700;
color: #fff;
}
.pocillo_header {
position: absolute;
right: 0;
width: 89px;
height: 35px;
padding-right: 5px;
background-color: #383c4a;
}
.pocillo_actions {
display: flex;
align-items: center;
justify-content: space-between;
height: 35px;
margin: 0;
padding: 0;
list-style-type: none;
}
.pocillo_actions > li {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
border-radius: 50%;
}
.pocillo_actions > li > svg {
width: 24px;
height: 24px;
}
.pocillo_actions > li > svg path {
fill: #afb1b7 !important;
}
.pocillo_actions > li:hover,
.pocillo_actions > li:active {
background-color: #565965;
}
.pocillo_actions > li:hover > svg path,
.pocillo_actions > li:active > svg path {
fill: #fff !important;
}
.pocillo_actions > li.pocillo_close {
background-color: #a34f6d;
}
.pocillo_actions > li.pocillo_close:hover,
.pocillo_actions > li.pocillo_close:active {
background-color: #b16983;
}
.pocillo_actions > li.pocillo_close > svg path,
.pocillo_actions > li.pocillo_close:hover > svg path,
.pocillo_actions > li.pocillo_close:active > svg path {
fill: #fff !important;
}
`
})
};

exports.decorateHeader = (Hyper, { React }) => {
return class extends React.Component {
constructor(props) {
super(props);

this.state = {
window: null,
maximized: false
}

this.closeApp = this.closeApp.bind(this);
this.minimizeApp = this.minimizeApp.bind(this);
this.maximizeApp = this.maximizeApp.bind(this);
}

closeApp() {
this.state.window.close();
}

minimizeApp() {
this.state.window.minimize();
this.state.maximized = false;
}

maximizeApp() {
if (this.state.maximized == true) {
this.state.window.unmaximize();
this.state.maximized = false;
} else {
this.state.window.maximize();
this.state.maximized = true;
}
}

render() {
return (
React.createElement(Hyper, Object.assign({}, this.props, {
customChildren: React.createElement('div', { className: 'pocillo_header' },
React.createElement('ul', { className: 'pocillo_actions' },
React.createElement('li', { onClick: this.minimizeApp },
React.createElement('svg', { xmlns: 'http://www.w3.org/2000/svg', width: '24', height: '24', viewBox: '0 0 24 24' },
React.createElement('path', { d: 'm8 14h8v2h-8z' })
)
),

// As this is from the Faba icon theme, this needs its '<g>' element
React.createElement('li', { onClick: this.maximizeApp },
React.createElement('svg', { xmlns: 'http://www.w3.org/2000/svg', width: '24', height: '24', viewBox: '0 0 24 24' },
React.createElement('g', { transform: 'matrix(1,0,0,1,-537,60.0034)' },
React.createElement('path', { d: 'M548,-52.003L549.781,-50.222L548.281,-48.722L546.781,-47.222L545,-49.003L545,-44.003L550,-44.003L548.219,-45.785L549.719,-47.285L551.219,-48.785L553,-47.003L553,-52.003L548,-52.003Z' })
)
)
),

React.createElement('li', { className: 'pocillo_close', onClick: this.closeApp },
React.createElement('svg', { xmlns: 'http://www.w3.org/2000/svg', width: '24', height: '24', viewBox: '0 0 24 24' },
React.createElement('path', { d: 'm9.41 8l-1.41 1.41 2.59 2.59-2.59 2.59 1.41 1.41 2.59-2.59 2.59 2.59 1.41-1.41-2.59-2.59 2.59-2.59-1.41-1.41-2.59 2.59-2.59-2.59z' })
)
)
)
)
}))
)
}

componentDidMount() {
this.state.window = remote.getCurrentWindow();
}
}
}

0 comments on commit 301aeec

Please sign in to comment.