Make transitions smoother between windows
This commit is contained in:
parent
a252a29c6b
commit
eafe375144
|
@ -0,0 +1,6 @@
|
||||||
|
<html>
|
||||||
|
<head></head>
|
||||||
|
<body>
|
||||||
|
<div style="width:100%; height:100%; background-color:#fff;"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -71,6 +71,18 @@
|
||||||
"css": "calendar",
|
"css": "calendar",
|
||||||
"code": 59398,
|
"code": 59398,
|
||||||
"src": "elusive"
|
"src": "elusive"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uid": "15739f3032c2aa3df67efc96b3ffef56",
|
||||||
|
"css": "cancel-circle",
|
||||||
|
"code": 59403,
|
||||||
|
"src": "websymbols"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uid": "994eaa764b3f30721f3839c64c390ce3",
|
||||||
|
"css": "minus-circle",
|
||||||
|
"code": 59404,
|
||||||
|
"src": "websymbols"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
|
@ -1,10 +1,10 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'elodie';
|
font-family: 'elodie';
|
||||||
src: url('../font/elodie.eot?43975196');
|
src: url('../font/elodie.eot?99803888');
|
||||||
src: url('../font/elodie.eot?43975196#iefix') format('embedded-opentype'),
|
src: url('../font/elodie.eot?99803888#iefix') format('embedded-opentype'),
|
||||||
url('../font/elodie.woff?43975196') format('woff'),
|
url('../font/elodie.woff?99803888') format('woff'),
|
||||||
url('../font/elodie.ttf?43975196') format('truetype'),
|
url('../font/elodie.ttf?99803888') format('truetype'),
|
||||||
url('../font/elodie.svg?43975196#elodie') format('svg');
|
url('../font/elodie.svg?99803888#elodie') format('svg');
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
@ -14,7 +14,7 @@
|
||||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'elodie';
|
font-family: 'elodie';
|
||||||
src: url('../font/elodie.svg?43975196#elodie') format('svg');
|
src: url('../font/elodie.svg?99803888#elodie') format('svg');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
*/
|
*/
|
||||||
|
@ -65,3 +65,5 @@
|
||||||
.icon-media-add:before { content: '\e808'; } /* '' */
|
.icon-media-add:before { content: '\e808'; } /* '' */
|
||||||
.icon-folder-open:before { content: '\e809'; } /* '' */
|
.icon-folder-open:before { content: '\e809'; } /* '' */
|
||||||
.icon-folder-closed:before { content: '\e80a'; } /* '' */
|
.icon-folder-closed:before { content: '\e80a'; } /* '' */
|
||||||
|
.icon-cancel-circle:before { content: '\e80b'; } /* '' */
|
||||||
|
.icon-minus-circle:before { content: '\e80c'; } /* '' */
|
|
@ -17,6 +17,8 @@
|
||||||
<glyph glyph-name="media-add" unicode="" d="m573 350q21 0 36-15t16-37-16-36-36-15l-104 0 0-105q0-22-16-37t-37-15-36 15-15 37l0 105-105 0q-21 0-36 15t-15 36 15 37 36 15l105 0 0 104q0 21 15 37t36 16 37-16 16-37l0-104 104 0z m245 245q16-16 16-36l0-521q0-65-46-111t-110-46l-522 0q-65 0-110 46t-46 111l0 625q0 65 46 110t110 46l417 0q22 0 37-15z m-110-36l-135 134 0-56q0-32 23-55t55-23l57 0z m-30-574q21 0 36 16t15 37l0 469-78 0q-53 0-92 38t-38 92l0 78-365 0q-21 0-37-15t-15-37l0-625q0-21 15-37t37-16l522 0z" horiz-adv-x="834" />
|
<glyph glyph-name="media-add" unicode="" d="m573 350q21 0 36-15t16-37-16-36-36-15l-104 0 0-105q0-22-16-37t-37-15-36 15-15 37l0 105-105 0q-21 0-36 15t-15 36 15 37 36 15l105 0 0 104q0 21 15 37t36 16 37-16 16-37l0-104 104 0z m245 245q16-16 16-36l0-521q0-65-46-111t-110-46l-522 0q-65 0-110 46t-46 111l0 625q0 65 46 110t110 46l417 0q22 0 37-15z m-110-36l-135 134 0-56q0-32 23-55t55-23l57 0z m-30-574q21 0 36 16t15 37l0 469-78 0q-53 0-92 38t-38 92l0 78-365 0q-21 0-37-15t-15-37l0-625q0-21 15-37t37-16l522 0z" horiz-adv-x="834" />
|
||||||
<glyph glyph-name="folder-open" unicode="" d="m994 330q0 20-30 20h-607q-22 0-48-12t-39-29l-164-203q-11-13-11-22 0-20 30-20h607q22 0 48 13t40 29l164 203q10 12 10 21z m-637 91h429v90q0 22-16 38t-38 15h-321q-23 0-38 16t-16 38v36q0 22-15 38t-38 15h-179q-22 0-38-15t-16-38v-476l143 175q25 30 65 49t78 19z m708-91q0-34-25-66l-165-203q-24-30-65-49t-78-19h-607q-51 0-88 37t-37 88v536q0 51 37 88t88 37h179q51 0 88-37t37-88v-18h303q51 0 88-37t37-88v-90h107q30 0 56-13t37-40q8-17 8-38z" horiz-adv-x="1071.4" />
|
<glyph glyph-name="folder-open" unicode="" d="m994 330q0 20-30 20h-607q-22 0-48-12t-39-29l-164-203q-11-13-11-22 0-20 30-20h607q22 0 48 13t40 29l164 203q10 12 10 21z m-637 91h429v90q0 22-16 38t-38 15h-321q-23 0-38 16t-16 38v36q0 22-15 38t-38 15h-179q-22 0-38-15t-16-38v-476l143 175q25 30 65 49t78 19z m708-91q0-34-25-66l-165-203q-24-30-65-49t-78-19h-607q-51 0-88 37t-37 88v536q0 51 37 88t88 37h179q51 0 88-37t37-88v-18h303q51 0 88-37t37-88v-90h107q30 0 56-13t37-40q8-17 8-38z" horiz-adv-x="1071.4" />
|
||||||
<glyph glyph-name="folder-closed" unicode="" d="m857 118v393q0 22-15 38t-38 15h-393q-23 0-38 16t-16 38v36q0 22-15 38t-38 15h-179q-22 0-38-15t-16-38v-536q0-22 16-38t38-16h679q22 0 38 16t15 38z m72 393v-393q0-51-37-88t-88-37h-679q-51 0-88 37t-37 88v536q0 51 37 88t88 37h179q51 0 88-37t37-88v-18h375q51 0 88-37t37-88z" horiz-adv-x="928.6" />
|
<glyph glyph-name="folder-closed" unicode="" d="m857 118v393q0 22-15 38t-38 15h-393q-23 0-38 16t-16 38v36q0 22-15 38t-38 15h-179q-22 0-38-15t-16-38v-536q0-22 16-38t38-16h679q22 0 38 16t15 38z m72 393v-393q0-51-37-88t-88-37h-679q-51 0-88 37t-37 88v536q0 51 37 88t88 37h179q51 0 88-37t37-88v-18h375q51 0 88-37t37-88z" horiz-adv-x="928.6" />
|
||||||
|
<glyph glyph-name="cancel-circle" unicode="" d="m1000 349q0-136-67-251t-182-182-251-67-251 67-182 182-67 251 67 251 182 182 251 67 251-67 182-182 67-251z m-339-232l71 71-161 161 161 161-71 71-161-161-161 161-71-71 161-161-161-161 71-71 161 161z" horiz-adv-x="1000" />
|
||||||
|
<glyph glyph-name="minus-circle" unicode="" d="m1000 349q0-136-67-251t-182-182-251-67-251 67-182 182-67 251 67 251 182 182 251 67 251-67 182-182 67-251z m-794-58h589v118h-589v-118z" horiz-adv-x="1000" />
|
||||||
</font>
|
</font>
|
||||||
</defs>
|
</defs>
|
||||||
</svg>
|
</svg>
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 6.2 KiB |
|
@ -1,3 +1,12 @@
|
||||||
|
body {
|
||||||
|
-webkit-animation: fadein 1s;
|
||||||
|
}
|
||||||
|
/* Safari, Chrome and Opera > 12.1 */
|
||||||
|
@-webkit-keyframes fadein {
|
||||||
|
from { opacity: 0; }
|
||||||
|
to { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
*, body, div {
|
*, body, div {
|
||||||
font-family: 'Lato', 'Helvetica';
|
font-family: 'Lato', 'Helvetica';
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
|
@ -23,9 +32,30 @@ body {
|
||||||
|
|
||||||
.titlebar a {
|
.titlebar a {
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
font-size:.9em;
|
font-size:.7em;
|
||||||
|
padding-top:5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titlebar a.right {
|
||||||
float:right;
|
float:right;
|
||||||
padding-top:3px;
|
}
|
||||||
|
|
||||||
|
.titlebar a.left {
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titlebar a.quit i {
|
||||||
|
color: #ff4136 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titlebar a.minus i {
|
||||||
|
color: #ffba00 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.x-titlebar em {
|
||||||
|
padding-right: 28px;
|
||||||
|
background: url("../img/logo@18x22.png") no-repeat right 4px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.content, .content-index {
|
.content, .content-index {
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 1.2 KiB |
|
@ -10,8 +10,9 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="titlebar">
|
<div class="titlebar">
|
||||||
|
<!--<a href="" class="left quit quitProgram"><i class="icon-cancel-circle"></i></a>
|
||||||
|
<a href="" class="left minus minimizeProgram"><i class="icon-minus-circle"></i></a>-->
|
||||||
How can I help you? <em>-- Elodie</em><i></i>
|
How can I help you? <em>-- Elodie</em><i></i>
|
||||||
<a href="index.html"><i class="icon-media-add"></i></a>
|
|
||||||
</div>
|
</div>
|
||||||
<form class="importPhotos" action="" method="post">
|
<form class="importPhotos" action="" method="post">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
|
@ -19,12 +20,12 @@
|
||||||
Let me know where your photos are and where you'd like me to put them as I sort them.
|
Let me know where your photos are and where you'd like me to put them as I sort them.
|
||||||
</p>
|
</p>
|
||||||
<div>
|
<div>
|
||||||
<label for="source"><i class="icon-folder-open"></i> Choose the folder your photos are in</label>
|
<label for="source"><i class="icon-folder-open"></i> What folder are your photos in now?</label>
|
||||||
<input type="text" name="source" id="source" placeholder="Path to your photos folder">
|
<input type="text" name="source" id="source" placeholder="Path to your photos folder">
|
||||||
<small><em>Hint: Right clicking on your folder in Finder, pressing option and clicking "Copy as Pathname" will put the full path on your clipboard</em></small>
|
<small><em>Hint: Right clicking on your folder in Finder, pressing option and clicking "Copy as Pathname" will put the full path on your clipboard</em></small>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<label for="destination"><i class="icon-folder-closed"></i> Choose a destination folder</label>
|
<label for="destination"><i class="icon-folder-closed"></i> Where would you like me to organize them to?</label>
|
||||||
<input type="text" name="destination" id="destination" placeholder="Path to your photos folder">
|
<input type="text" name="destination" id="destination" placeholder="Path to your photos folder">
|
||||||
<button type="submit" class="push">Start Organizing<i></i></button>
|
<button type="submit" class="push">Start Organizing<i></i></button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -18,6 +18,10 @@ if(typeof(require) === 'function') {
|
||||||
handlers.removeProgressIcons();
|
handlers.removeProgressIcons();
|
||||||
handlers.addSuccessImportMessage(args);
|
handlers.addSuccessImportMessage(args);
|
||||||
});
|
});
|
||||||
|
ipc.on('update-import-no-photos', function(args) {
|
||||||
|
//var response = JSON.parse(args['stdout']);
|
||||||
|
handlers.removeProgressIcons();
|
||||||
|
});
|
||||||
ipc.on('update-photos-success', function(args) {
|
ipc.on('update-photos-success', function(args) {
|
||||||
var response = JSON.parse(args['stdout']);
|
var response = JSON.parse(args['stdout']);
|
||||||
handlers.setSuccessTitle();
|
handlers.setSuccessTitle();
|
||||||
|
@ -58,17 +62,26 @@ function Handlers() {
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
broadcast.send('launch-finder', tgt);
|
broadcast.send('launch-finder', tgt);
|
||||||
};
|
};
|
||||||
|
this.click.quitProgram = function(ev) {
|
||||||
|
//ev.preventDefault();
|
||||||
|
console.log('quit');
|
||||||
|
broadcast.send('program-quit');
|
||||||
|
};
|
||||||
// SUBMIT
|
// SUBMIT
|
||||||
this.submit.importPhotos = function(ev) {
|
this.submit.importPhotos = function(ev) {
|
||||||
var el = ev.target,
|
var el = ev.target,
|
||||||
cls = el.className,
|
cls = el.className,
|
||||||
params;
|
params;
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
document.querySelector('button.push i').className = 'icon-spin animate-spin';
|
|
||||||
|
|
||||||
params = {};
|
params = {};
|
||||||
params['source'] = document.querySelector('input[name="source"]').value
|
params['source'] = document.querySelector('input[name="source"]').value
|
||||||
params['destination'] = document.querySelector('input[name="destination"]').value
|
params['destination'] = document.querySelector('input[name="destination"]').value
|
||||||
|
if(params['destination'].length === 0 || params['source'].length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector('button.push i').className = 'icon-spin animate-spin';
|
||||||
broadcast.send('import-photos', params);
|
broadcast.send('import-photos', params);
|
||||||
};
|
};
|
||||||
this.submit.updatePhotos = function(ev) {
|
this.submit.updatePhotos = function(ev) {
|
||||||
|
|
|
@ -10,8 +10,12 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="titlebar">
|
<div class="titlebar">
|
||||||
|
<div class="left">
|
||||||
|
<!--<a href="" class="left quit quitProgram"><i class="icon-cancel-circle"></i></a>
|
||||||
|
<a href="" class="left minus minimizeProgram"><i class="icon-minus-circle"></i></a>-->
|
||||||
|
</div>
|
||||||
How can I help you? <em>-- Elodie</em><i></i>
|
How can I help you? <em>-- Elodie</em><i></i>
|
||||||
<a href="index.html"><i class="icon-media-add"></i></a>
|
<a href="index.html" class="right"><i class="icon-media-add"></i></a>
|
||||||
</div>
|
</div>
|
||||||
<form class="updatePhotos" action="" method="post">
|
<form class="updatePhotos" action="" method="post">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
|
|
52
app/index.js
52
app/index.js
|
@ -1,7 +1,9 @@
|
||||||
var menubar = require('menubar'),
|
var menubar = require('menubar'),
|
||||||
|
menu = require("menu"),
|
||||||
tray = require('tray'),
|
tray = require('tray'),
|
||||||
ipc = require('ipc'),
|
ipc = require('ipc'),
|
||||||
exec = require('child_process').exec;;
|
exec = require('child_process').exec,
|
||||||
|
loadUrl = null;
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* The main process listens for events from the web renderer.
|
* The main process listens for events from the web renderer.
|
||||||
|
@ -19,6 +21,7 @@ ipc.on('import-photos', function(event, args) {
|
||||||
console.log(args);
|
console.log(args);
|
||||||
if(typeof(args['source']) === 'undefined' || args['source'].length === 0 || typeof(args['destination']) === 'undefined' || args['destination'].length === 0) {
|
if(typeof(args['source']) === 'undefined' || args['source'].length === 0 || typeof(args['destination']) === 'undefined' || args['destination'].length === 0) {
|
||||||
console.log('no source or destination passed in to import-photos');
|
console.log('no source or destination passed in to import-photos');
|
||||||
|
event.sender.send('update-import-no-photos', null);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -94,37 +97,60 @@ ipc.on('update-photos', function(event, args) {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
ipc.on('launch-finder', function(event, path) {
|
ipc.on('launch-finder', function(event, path) {
|
||||||
console.log(path);
|
console.log(path);
|
||||||
var shell = require('shell');
|
var shell = require('shell');
|
||||||
shell.showItemInFolder(path);
|
shell.showItemInFolder(path);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
ipc.on('program-quit', function(event, path) {
|
||||||
|
console.log('program-quit');
|
||||||
|
//mb.tray.destroy();
|
||||||
|
mb.quit();
|
||||||
|
});
|
||||||
|
|
||||||
var mb = menubar(
|
var mb = menubar(
|
||||||
{
|
{
|
||||||
preloadWindow: true,
|
preloadWindow: true,
|
||||||
dir: __dirname + '/html',
|
dir: __dirname + '/html',
|
||||||
index: 'index.html',
|
index: 'index.html',
|
||||||
pages: {
|
pages: {
|
||||||
|
'blank': 'blank.html',
|
||||||
'location': 'location.html'
|
'location': 'location.html'
|
||||||
},
|
},
|
||||||
width: 400,
|
width: 400,
|
||||||
height: 500
|
height: 500,
|
||||||
|
'window-position': 'trayCenter'
|
||||||
}
|
}
|
||||||
)
|
);
|
||||||
|
|
||||||
mb.on('ready', function ready () {
|
mb.on('ready', function ready () {
|
||||||
console.log('app is ready')
|
console.log('app is ready')
|
||||||
|
var template = [{
|
||||||
|
label: "Application",
|
||||||
|
submenu: [
|
||||||
|
{ label: "Quit", accelerator: "Command+Q", click: function() { app.quit(); }}
|
||||||
|
]}, {
|
||||||
|
label: "Edit",
|
||||||
|
submenu: [
|
||||||
|
{ label: "Undo", accelerator: "CmdOrCtrl+Z", selector: "undo:" },
|
||||||
|
{ label: "Redo", accelerator: "Shift+CmdOrCtrl+Z", selector: "redo:" },
|
||||||
|
{ label: "Cut", accelerator: "CmdOrCtrl+X", selector: "cut:" },
|
||||||
|
{ label: "Copy", accelerator: "CmdOrCtrl+C", selector: "copy:" },
|
||||||
|
{ label: "Paste", accelerator: "CmdOrCtrl+V", selector: "paste:" },
|
||||||
|
{ label: "Select All", accelerator: "CmdOrCtrl+A", selector: "selectAll:" }
|
||||||
|
]}
|
||||||
|
];
|
||||||
|
menu.setApplicationMenu(menu.buildFromTemplate(template));
|
||||||
|
|
||||||
this.tray.setToolTip('Drag and drop files here')
|
this.tray.setToolTip('Drag and drop files here')
|
||||||
//this.tray.setImage('img/logo.png')
|
this.tray.setImage(mb.getOption('dir') + '/img/logo@18x22xbw.png')
|
||||||
this.tray.on('clicked', function clicked () {
|
this.tray.on('clicked', function clicked () {
|
||||||
console.log('tray-clicked')
|
console.log('tray-clicked')
|
||||||
})
|
})
|
||||||
this.tray.on('drop-files', function dropFiles (ev, files) {
|
this.tray.on('drop-files', function dropFiles (ev, files) {
|
||||||
mb.showWindow()
|
loadUrl = mb.getOption('pages')['location'];
|
||||||
console.log('window file name ' + mb.window.getRepresentedFilename())
|
mb.showWindow();
|
||||||
mb.window.loadUrl('file://' + mb.getOption('dir') + '/' + mb.getOption('pages')['location'])
|
|
||||||
//mb.window.openDevTools();
|
//mb.window.openDevTools();
|
||||||
mb.window.webContents.on('did-finish-load', function() {
|
mb.window.webContents.on('did-finish-load', function() {
|
||||||
mb.window.webContents.send('files', files);
|
mb.window.webContents.send('files', files);
|
||||||
|
@ -140,9 +166,14 @@ mb.on('create-window', function createWindow () {
|
||||||
mb.on('after-create-window', function afterCreateWindow () {
|
mb.on('after-create-window', function afterCreateWindow () {
|
||||||
})
|
})
|
||||||
|
|
||||||
|
var loaded = false;
|
||||||
mb.on('show', function show () {
|
mb.on('show', function show () {
|
||||||
//this.window.openDevTools();
|
if(loadUrl === null) {
|
||||||
this.window.loadUrl('file://' + this.getOption('dir') + '/' + this.getOption('index'))
|
loadUrl = this.getOption('index');
|
||||||
|
}
|
||||||
|
this.window.loadUrl('file://' + this.getOption('dir') + '/' + loadUrl);
|
||||||
|
loadUrl = null;
|
||||||
|
//mb.window.openDevTools();
|
||||||
})
|
})
|
||||||
|
|
||||||
mb.on('after-show', function afterShow () {
|
mb.on('after-show', function afterShow () {
|
||||||
|
@ -155,4 +186,5 @@ mb.on('hide', function hide () {
|
||||||
|
|
||||||
mb.on('after-hide', function afterHide () {
|
mb.on('after-hide', function afterHide () {
|
||||||
console.log('after-hide')
|
console.log('after-hide')
|
||||||
|
this.window.loadUrl('file://' + this.getOption('dir') + '/' + this.getOption('pages')['blank']);
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue