Make transitions smoother between windows
This commit is contained in:
		
							parent
							
								
									a252a29c6b
								
							
						
					
					
						commit
						eafe375144
					
				
							
								
								
									
										6
									
								
								app/html/blank.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										6
									
								
								app/html/blank.html
									
									
									
									
									
										Normal file
									
								
							@ -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",
 | 
			
		||||
      "code": 59398,
 | 
			
		||||
      "src": "elusive"
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "uid": "15739f3032c2aa3df67efc96b3ffef56",
 | 
			
		||||
      "css": "cancel-circle",
 | 
			
		||||
      "code": 59403,
 | 
			
		||||
      "src": "websymbols"
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "uid": "994eaa764b3f30721f3839c64c390ce3",
 | 
			
		||||
      "css": "minus-circle",
 | 
			
		||||
      "code": 59404,
 | 
			
		||||
      "src": "websymbols"
 | 
			
		||||
    }
 | 
			
		||||
  ]
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										14
									
								
								app/html/css/fontello/css/elodie.css
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										14
									
								
								app/html/css/fontello/css/elodie.css
									
									
									
									
										vendored
									
									
								
							@ -1,10 +1,10 @@
 | 
			
		||||
@font-face {
 | 
			
		||||
  font-family: 'elodie';
 | 
			
		||||
  src: url('../font/elodie.eot?43975196');
 | 
			
		||||
  src: url('../font/elodie.eot?43975196#iefix') format('embedded-opentype'),
 | 
			
		||||
       url('../font/elodie.woff?43975196') format('woff'),
 | 
			
		||||
       url('../font/elodie.ttf?43975196') format('truetype'),
 | 
			
		||||
       url('../font/elodie.svg?43975196#elodie') format('svg');
 | 
			
		||||
  src: url('../font/elodie.eot?99803888');
 | 
			
		||||
  src: url('../font/elodie.eot?99803888#iefix') format('embedded-opentype'),
 | 
			
		||||
       url('../font/elodie.woff?99803888') format('woff'),
 | 
			
		||||
       url('../font/elodie.ttf?99803888') format('truetype'),
 | 
			
		||||
       url('../font/elodie.svg?99803888#elodie') format('svg');
 | 
			
		||||
  font-weight: normal;
 | 
			
		||||
  font-style: normal;
 | 
			
		||||
}
 | 
			
		||||
@ -14,7 +14,7 @@
 | 
			
		||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
 | 
			
		||||
  @font-face {
 | 
			
		||||
    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-folder-open:before { content: '\e809'; } /* '' */
 | 
			
		||||
.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="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="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>
 | 
			
		||||
</defs>
 | 
			
		||||
</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 {
 | 
			
		||||
  font-family: 'Lato', 'Helvetica';
 | 
			
		||||
  font-weight: 300;
 | 
			
		||||
@ -23,9 +32,30 @@ body {
 | 
			
		||||
 | 
			
		||||
.titlebar a {
 | 
			
		||||
  font-weight: 300;
 | 
			
		||||
  font-size:.9em;
 | 
			
		||||
  font-size:.7em;
 | 
			
		||||
  padding-top:5px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.titlebar a.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 {
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										
											BIN
										
									
								
								app/html/img/logo@18x22xbw.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								app/html/img/logo@18x22xbw.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 1.2 KiB  | 
@ -10,8 +10,9 @@
 | 
			
		||||
  </head>
 | 
			
		||||
  <body> 
 | 
			
		||||
    <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>
 | 
			
		||||
      <a href="index.html"><i class="icon-media-add"></i></a>
 | 
			
		||||
    </div>
 | 
			
		||||
    <form class="importPhotos" action="" method="post">
 | 
			
		||||
      <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.
 | 
			
		||||
        </p>
 | 
			
		||||
        <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">
 | 
			
		||||
          <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>
 | 
			
		||||
          <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">
 | 
			
		||||
          <button type="submit" class="push">Start Organizing<i></i></button>
 | 
			
		||||
        </div>
 | 
			
		||||
 | 
			
		||||
@ -18,6 +18,10 @@ if(typeof(require) === 'function') {
 | 
			
		||||
    handlers.removeProgressIcons();
 | 
			
		||||
    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) {
 | 
			
		||||
    var response = JSON.parse(args['stdout']);
 | 
			
		||||
    handlers.setSuccessTitle();
 | 
			
		||||
@ -58,17 +62,26 @@ function Handlers() {
 | 
			
		||||
    ev.preventDefault();
 | 
			
		||||
    broadcast.send('launch-finder', tgt);
 | 
			
		||||
  };
 | 
			
		||||
  this.click.quitProgram = function(ev) {
 | 
			
		||||
    //ev.preventDefault();
 | 
			
		||||
    console.log('quit');
 | 
			
		||||
    broadcast.send('program-quit');
 | 
			
		||||
  };
 | 
			
		||||
  // SUBMIT
 | 
			
		||||
  this.submit.importPhotos = function(ev) {
 | 
			
		||||
    var el = ev.target,
 | 
			
		||||
        cls = el.className,
 | 
			
		||||
        params;
 | 
			
		||||
    ev.preventDefault();
 | 
			
		||||
    document.querySelector('button.push i').className = 'icon-spin animate-spin';
 | 
			
		||||
 | 
			
		||||
    params = {};
 | 
			
		||||
    params['source'] = document.querySelector('input[name="source"]').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);
 | 
			
		||||
  };
 | 
			
		||||
  this.submit.updatePhotos = function(ev) {
 | 
			
		||||
 | 
			
		||||
@ -10,8 +10,12 @@
 | 
			
		||||
  </head>
 | 
			
		||||
  <body> 
 | 
			
		||||
    <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>
 | 
			
		||||
      <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>
 | 
			
		||||
    <form class="updatePhotos" action="" method="post">
 | 
			
		||||
      <div class="content">
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										52
									
								
								app/index.js
									
									
									
									
									
								
							
							
						
						
									
										52
									
								
								app/index.js
									
									
									
									
									
								
							@ -1,7 +1,9 @@
 | 
			
		||||
var menubar = require('menubar'),
 | 
			
		||||
    menu = require("menu"),
 | 
			
		||||
    tray = require('tray'),
 | 
			
		||||
    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.
 | 
			
		||||
@ -19,6 +21,7 @@ ipc.on('import-photos', function(event, args) {
 | 
			
		||||
  console.log(args);
 | 
			
		||||
  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');
 | 
			
		||||
    event.sender.send('update-import-no-photos', null);
 | 
			
		||||
    return;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
@ -94,37 +97,60 @@ ipc.on('update-photos', function(event, args) {
 | 
			
		||||
  });
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
ipc.on('launch-finder', function(event, path) {
 | 
			
		||||
  console.log(path);
 | 
			
		||||
  var shell = require('shell');
 | 
			
		||||
  shell.showItemInFolder(path);
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
ipc.on('program-quit', function(event, path) {
 | 
			
		||||
  console.log('program-quit');
 | 
			
		||||
  //mb.tray.destroy();
 | 
			
		||||
  mb.quit();
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
var mb = menubar(
 | 
			
		||||
      {
 | 
			
		||||
        preloadWindow: true,
 | 
			
		||||
        dir: __dirname + '/html',
 | 
			
		||||
        index: 'index.html',
 | 
			
		||||
        pages: {
 | 
			
		||||
          'blank': 'blank.html',
 | 
			
		||||
          'location': 'location.html'
 | 
			
		||||
        },
 | 
			
		||||
        width: 400,
 | 
			
		||||
        height: 500
 | 
			
		||||
        height: 500,
 | 
			
		||||
        'window-position': 'trayCenter'
 | 
			
		||||
      }
 | 
			
		||||
    )
 | 
			
		||||
    );
 | 
			
		||||
 | 
			
		||||
mb.on('ready', function 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.setImage('img/logo.png')
 | 
			
		||||
  this.tray.setImage(mb.getOption('dir') + '/img/logo@18x22xbw.png')
 | 
			
		||||
  this.tray.on('clicked', function clicked () {
 | 
			
		||||
    console.log('tray-clicked')
 | 
			
		||||
  })
 | 
			
		||||
  this.tray.on('drop-files', function dropFiles (ev, files) {
 | 
			
		||||
    mb.showWindow()
 | 
			
		||||
    console.log('window file name ' + mb.window.getRepresentedFilename())
 | 
			
		||||
    mb.window.loadUrl('file://' + mb.getOption('dir') + '/' + mb.getOption('pages')['location'])
 | 
			
		||||
    loadUrl = mb.getOption('pages')['location'];
 | 
			
		||||
    mb.showWindow();
 | 
			
		||||
    //mb.window.openDevTools();
 | 
			
		||||
    mb.window.webContents.on('did-finish-load', function() {
 | 
			
		||||
      mb.window.webContents.send('files', files);
 | 
			
		||||
@ -140,9 +166,14 @@ mb.on('create-window', function createWindow () {
 | 
			
		||||
mb.on('after-create-window', function afterCreateWindow () {
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
var loaded = false;
 | 
			
		||||
mb.on('show', function show () {
 | 
			
		||||
  //this.window.openDevTools();
 | 
			
		||||
  this.window.loadUrl('file://' + this.getOption('dir') + '/' + this.getOption('index'))
 | 
			
		||||
  if(loadUrl === null) {
 | 
			
		||||
    loadUrl = this.getOption('index');
 | 
			
		||||
  }
 | 
			
		||||
  this.window.loadUrl('file://' + this.getOption('dir') + '/' + loadUrl);
 | 
			
		||||
  loadUrl = null;
 | 
			
		||||
  //mb.window.openDevTools();
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
mb.on('after-show', function afterShow () {
 | 
			
		||||
@ -155,4 +186,5 @@ mb.on('hide', function hide () {
 | 
			
		||||
 | 
			
		||||
mb.on('after-hide', function afterHide () {
 | 
			
		||||
  console.log('after-hide')
 | 
			
		||||
  this.window.loadUrl('file://' + this.getOption('dir') + '/' + this.getOption('pages')['blank']);
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user