diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 0000000..9f816af --- /dev/null +++ b/.travis.yml @@ -0,0 +1,4 @@ +language: node_js +node_js: + - 'node' +install: npm install standard \ No newline at end of file diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..39f5be0 --- /dev/null +++ b/LICENSE @@ -0,0 +1,19 @@ +Copyright (c) 2016 Konrad Michalik + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. \ No newline at end of file diff --git a/README.md b/README.md index 8b8e75f..052f793 100644 --- a/README.md +++ b/README.md @@ -4,4 +4,4 @@ Simple menubar application based on Electron with actual weather information and ## Notes Using the [openweathermap](http://openweathermap.org/) API and the [Animate.CSS](https://daneden.github.io/animate.css/) library. -![App Screenplay](/screenshot.gif "App Screenshot") +![App Screenplay](/screenshot.gif "App Screenshot") \ No newline at end of file diff --git a/app.js b/app.js index b41c2fc..d527951 100644 --- a/app.js +++ b/app.js @@ -1,8 +1,14 @@ 'use strict'; -const electron = require('electron'); -const app = electron.app; // Module to control application life. -const BrowserWindow = electron.BrowserWindow; // Module to create native browser window. +var electron = require('electron'); +var app = electron.app; +var BrowserWindow = electron.BrowserWindow; +var globalShortcut = electron.globalShortcut; +var AutoLaunch = require('auto-launch'); +var menubar = require('menubar'); +// var ipc = require('ipc'); +var ipcMain = electron.ipcMain; +// var Tray = require('tray'); // Keep a global reference of the window object, if you don't, the window will // be closed automatically when the JavaScript object is garbage collected. @@ -17,36 +23,11 @@ app.on('window-all-closed', function() { } }); -// This method will be called when Electron has finished -// initialization and is ready to create browser windows. -//app.on('ready', function() { - // Create the browser window. - - // mainWindow = new BrowserWindow({width: 280, height: 500, resizable: false, titleBarStyle: 'hidden'}); - - // and load the index.html of the app. - // mainWindow.loadURL('file://' + __dirname + '/index.html'); - - // Open the DevTools. - //mainWindow.webContents.openDevTools(); - - // Emitted when the window is closed. -// mainWindow.on('closed', function() { -// // Dereference the window object, usually you would store windows -// // in an array if your app supports multi windows, this is the time -// // when you should delete the corresponding element. -// mainWindow = null; -// }); -// }); - - -var menubar = require('menubar'); - var mb = menubar({ index: 'file://' + __dirname + '/index.html', - icon: __dirname + '/IconTemplate.png', + icon: __dirname + '/assets/IconTemplate@2x.png', width: 280, - height: 465, + height: 480, resizable: false, 'show-dock-icon': false, 'preload-window': true, @@ -54,14 +35,38 @@ var mb = menubar({ }); mb.on('ready', function ready () { - console.log('app is ready'); - // your app code here + + mb.window.openDevTools(); + + ipcMain.on('no-title', function(event, args) { + mb.tray.setToolTip('temps'); + mb.tray.setTitle(''); + mb.tray.setImage(__dirname + '/assets/IconTemplate@2x.png') + }); + + ipcMain.on('set-title', function(event, args) { + var temperature = Math.round(args.temperature) + '°'; + mb.tray.setToolTip(args.location + ' - ' + temperature); + mb.tray.setTitle(temperature); + mb.tray.setImage(__dirname + '/assets/icons/' + args.icon + '@2x.png') + }); + + ipcMain.on('close', function(event, args) { + app.quit(); + }); + + mb.window.on('will-navigate', function(e, url) { + e.preventDefault(); + electron.shell.openExternal(url); + }); }); -var AutoLaunch = require('auto-launch'); +mb.on('show', function show () { + mb.window.webContents.send('show'); +}); var appLauncher = new AutoLaunch({ - name: 'My NW.js or Electron app' + name: 'temps' }); appLauncher.isEnabled().then(function(enabled){ diff --git a/assets/IconTemplate.png b/assets/IconTemplate.png new file mode 100644 index 0000000..a4063ae Binary files /dev/null and b/assets/IconTemplate.png differ diff --git a/assets/IconTemplate@2x.png b/assets/IconTemplate@2x.png new file mode 100644 index 0000000..eec616a Binary files /dev/null and b/assets/IconTemplate@2x.png differ diff --git a/assets/background.png b/assets/background.png new file mode 100644 index 0000000..eb0c253 Binary files /dev/null and b/assets/background.png differ diff --git a/assets/icons/01d-1.png b/assets/icons/01d-1.png new file mode 100644 index 0000000..3e279b5 Binary files /dev/null and b/assets/icons/01d-1.png differ diff --git a/assets/icons/01d-2.png b/assets/icons/01d-2.png new file mode 100644 index 0000000..a15be61 Binary files /dev/null and b/assets/icons/01d-2.png differ diff --git a/assets/icons/01d-3.png b/assets/icons/01d-3.png new file mode 100644 index 0000000..da79b03 Binary files /dev/null and b/assets/icons/01d-3.png differ diff --git a/assets/icons/01d-4.png b/assets/icons/01d-4.png new file mode 100644 index 0000000..5721165 Binary files /dev/null and b/assets/icons/01d-4.png differ diff --git a/assets/icons/01d-5.png b/assets/icons/01d-5.png new file mode 100644 index 0000000..2707aa5 Binary files /dev/null and b/assets/icons/01d-5.png differ diff --git a/assets/icons/01d.png b/assets/icons/01d.png new file mode 100644 index 0000000..9b664d7 Binary files /dev/null and b/assets/icons/01d.png differ diff --git a/assets/icons/01d.svg b/assets/icons/01d.svg new file mode 100644 index 0000000..80c5180 --- /dev/null +++ b/assets/icons/01d.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/01d@2x.png b/assets/icons/01d@2x.png new file mode 100644 index 0000000..eaf89f4 Binary files /dev/null and b/assets/icons/01d@2x.png differ diff --git a/assets/icons/01n-1.png b/assets/icons/01n-1.png new file mode 100644 index 0000000..0f08d67 Binary files /dev/null and b/assets/icons/01n-1.png differ diff --git a/assets/icons/01n-2.png b/assets/icons/01n-2.png new file mode 100644 index 0000000..090b364 Binary files /dev/null and b/assets/icons/01n-2.png differ diff --git a/assets/icons/01n-3.png b/assets/icons/01n-3.png new file mode 100644 index 0000000..b4e15f6 Binary files /dev/null and b/assets/icons/01n-3.png differ diff --git a/assets/icons/01n-4.png b/assets/icons/01n-4.png new file mode 100644 index 0000000..c8a346c Binary files /dev/null and b/assets/icons/01n-4.png differ diff --git a/assets/icons/01n.png b/assets/icons/01n.png new file mode 100644 index 0000000..f3f1fed Binary files /dev/null and b/assets/icons/01n.png differ diff --git a/assets/icons/01n.svg b/assets/icons/01n.svg new file mode 100644 index 0000000..c9a4aa9 --- /dev/null +++ b/assets/icons/01n.svg @@ -0,0 +1,11 @@ + + + + + + + diff --git a/assets/icons/01n@2x.png b/assets/icons/01n@2x.png new file mode 100644 index 0000000..8e7e1a5 Binary files /dev/null and b/assets/icons/01n@2x.png differ diff --git a/assets/icons/02d-1.png b/assets/icons/02d-1.png new file mode 100644 index 0000000..fbef342 Binary files /dev/null and b/assets/icons/02d-1.png differ diff --git a/assets/icons/02d-2.png b/assets/icons/02d-2.png new file mode 100644 index 0000000..4e98df9 Binary files /dev/null and b/assets/icons/02d-2.png differ diff --git a/assets/icons/02d-3.png b/assets/icons/02d-3.png new file mode 100644 index 0000000..34a1b85 Binary files /dev/null and b/assets/icons/02d-3.png differ diff --git a/assets/icons/02d-4.png b/assets/icons/02d-4.png new file mode 100644 index 0000000..691bbb3 Binary files /dev/null and b/assets/icons/02d-4.png differ diff --git a/assets/icons/02d.png b/assets/icons/02d.png new file mode 100644 index 0000000..6b12acd Binary files /dev/null and b/assets/icons/02d.png differ diff --git a/assets/icons/02d.svg b/assets/icons/02d.svg new file mode 100644 index 0000000..f33bc49 --- /dev/null +++ b/assets/icons/02d.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/02d@2x.png b/assets/icons/02d@2x.png new file mode 100644 index 0000000..8169631 Binary files /dev/null and b/assets/icons/02d@2x.png differ diff --git a/assets/icons/02n-1.png b/assets/icons/02n-1.png new file mode 100644 index 0000000..bf7b55f Binary files /dev/null and b/assets/icons/02n-1.png differ diff --git a/assets/icons/02n-2.png b/assets/icons/02n-2.png new file mode 100644 index 0000000..1765ae8 Binary files /dev/null and b/assets/icons/02n-2.png differ diff --git a/assets/icons/02n-3.png b/assets/icons/02n-3.png new file mode 100644 index 0000000..d9fa1db Binary files /dev/null and b/assets/icons/02n-3.png differ diff --git a/assets/icons/02n-4.png b/assets/icons/02n-4.png new file mode 100644 index 0000000..1e07d7b Binary files /dev/null and b/assets/icons/02n-4.png differ diff --git a/assets/icons/02n.png b/assets/icons/02n.png new file mode 100644 index 0000000..a035c11 Binary files /dev/null and b/assets/icons/02n.png differ diff --git a/assets/icons/02n.svg b/assets/icons/02n.svg new file mode 100644 index 0000000..9a5f9d5 --- /dev/null +++ b/assets/icons/02n.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + diff --git a/assets/icons/02n@2x.png b/assets/icons/02n@2x.png new file mode 100644 index 0000000..5f9ba0e Binary files /dev/null and b/assets/icons/02n@2x.png differ diff --git a/assets/icons/03d-1.png b/assets/icons/03d-1.png new file mode 100644 index 0000000..b0ea353 Binary files /dev/null and b/assets/icons/03d-1.png differ diff --git a/assets/icons/03d-2.png b/assets/icons/03d-2.png new file mode 100644 index 0000000..051d808 Binary files /dev/null and b/assets/icons/03d-2.png differ diff --git a/assets/icons/03d-3.png b/assets/icons/03d-3.png new file mode 100644 index 0000000..b4898f1 Binary files /dev/null and b/assets/icons/03d-3.png differ diff --git a/assets/icons/03d-4.png b/assets/icons/03d-4.png new file mode 100644 index 0000000..ddad273 Binary files /dev/null and b/assets/icons/03d-4.png differ diff --git a/assets/icons/03d.png b/assets/icons/03d.png new file mode 100644 index 0000000..54cd6bb Binary files /dev/null and b/assets/icons/03d.png differ diff --git a/assets/icons/03d.svg b/assets/icons/03d.svg new file mode 100644 index 0000000..c5cbd82 --- /dev/null +++ b/assets/icons/03d.svg @@ -0,0 +1,16 @@ + + + + + + + + + + diff --git a/assets/icons/03d@2x.png b/assets/icons/03d@2x.png new file mode 100644 index 0000000..b56710f Binary files /dev/null and b/assets/icons/03d@2x.png differ diff --git a/assets/icons/03n-1.png b/assets/icons/03n-1.png new file mode 100644 index 0000000..b0ea353 Binary files /dev/null and b/assets/icons/03n-1.png differ diff --git a/assets/icons/03n-2.png b/assets/icons/03n-2.png new file mode 100644 index 0000000..051d808 Binary files /dev/null and b/assets/icons/03n-2.png differ diff --git a/assets/icons/03n-3.png b/assets/icons/03n-3.png new file mode 100644 index 0000000..b4898f1 Binary files /dev/null and b/assets/icons/03n-3.png differ diff --git a/assets/icons/03n-4.png b/assets/icons/03n-4.png new file mode 100644 index 0000000..ddad273 Binary files /dev/null and b/assets/icons/03n-4.png differ diff --git a/assets/icons/03n.png b/assets/icons/03n.png new file mode 100644 index 0000000..54cd6bb Binary files /dev/null and b/assets/icons/03n.png differ diff --git a/assets/icons/03n.svg b/assets/icons/03n.svg new file mode 100644 index 0000000..a4ff105 --- /dev/null +++ b/assets/icons/03n.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + diff --git a/assets/icons/03n@2x.png b/assets/icons/03n@2x.png new file mode 100644 index 0000000..b56710f Binary files /dev/null and b/assets/icons/03n@2x.png differ diff --git a/assets/icons/04d-1.png b/assets/icons/04d-1.png new file mode 100644 index 0000000..b0ea353 Binary files /dev/null and b/assets/icons/04d-1.png differ diff --git a/assets/icons/04d-2.png b/assets/icons/04d-2.png new file mode 100644 index 0000000..051d808 Binary files /dev/null and b/assets/icons/04d-2.png differ diff --git a/assets/icons/04d-3.png b/assets/icons/04d-3.png new file mode 100644 index 0000000..b4898f1 Binary files /dev/null and b/assets/icons/04d-3.png differ diff --git a/assets/icons/04d-4.png b/assets/icons/04d-4.png new file mode 100644 index 0000000..ddad273 Binary files /dev/null and b/assets/icons/04d-4.png differ diff --git a/assets/icons/04d.png b/assets/icons/04d.png new file mode 100644 index 0000000..54cd6bb Binary files /dev/null and b/assets/icons/04d.png differ diff --git a/assets/icons/04d.svg b/assets/icons/04d.svg new file mode 100644 index 0000000..9f53b34 --- /dev/null +++ b/assets/icons/04d.svg @@ -0,0 +1,18 @@ + + + + + + + + + diff --git a/assets/icons/04n-1.png b/assets/icons/04n-1.png new file mode 100644 index 0000000..b0ea353 Binary files /dev/null and b/assets/icons/04n-1.png differ diff --git a/assets/icons/04n-2.png b/assets/icons/04n-2.png new file mode 100644 index 0000000..051d808 Binary files /dev/null and b/assets/icons/04n-2.png differ diff --git a/assets/icons/04n-3.png b/assets/icons/04n-3.png new file mode 100644 index 0000000..b4898f1 Binary files /dev/null and b/assets/icons/04n-3.png differ diff --git a/assets/icons/04n-4.png b/assets/icons/04n-4.png new file mode 100644 index 0000000..ddad273 Binary files /dev/null and b/assets/icons/04n-4.png differ diff --git a/assets/icons/04n.png b/assets/icons/04n.png new file mode 100644 index 0000000..54cd6bb Binary files /dev/null and b/assets/icons/04n.png differ diff --git a/assets/icons/04n.svg b/assets/icons/04n.svg new file mode 100644 index 0000000..6740eed --- /dev/null +++ b/assets/icons/04n.svg @@ -0,0 +1,19 @@ + + + + + + + + + + diff --git a/assets/icons/04n@2x.png b/assets/icons/04n@2x.png new file mode 100644 index 0000000..b56710f Binary files /dev/null and b/assets/icons/04n@2x.png differ diff --git a/assets/icons/09d-1.png b/assets/icons/09d-1.png new file mode 100644 index 0000000..083f3ac Binary files /dev/null and b/assets/icons/09d-1.png differ diff --git a/assets/icons/09d-2.png b/assets/icons/09d-2.png new file mode 100644 index 0000000..3134286 Binary files /dev/null and b/assets/icons/09d-2.png differ diff --git a/assets/icons/09d-3.png b/assets/icons/09d-3.png new file mode 100644 index 0000000..24eb316 Binary files /dev/null and b/assets/icons/09d-3.png differ diff --git a/assets/icons/09d-4.png b/assets/icons/09d-4.png new file mode 100644 index 0000000..0b5116a Binary files /dev/null and b/assets/icons/09d-4.png differ diff --git a/assets/icons/09d.png b/assets/icons/09d.png new file mode 100644 index 0000000..9a68a04 Binary files /dev/null and b/assets/icons/09d.png differ diff --git a/assets/icons/09d.svg b/assets/icons/09d.svg new file mode 100644 index 0000000..3a93b92 --- /dev/null +++ b/assets/icons/09d.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + diff --git a/assets/icons/09d@2x.png b/assets/icons/09d@2x.png new file mode 100644 index 0000000..24c3088 Binary files /dev/null and b/assets/icons/09d@2x.png differ diff --git a/assets/icons/09n-1.png b/assets/icons/09n-1.png new file mode 100644 index 0000000..083f3ac Binary files /dev/null and b/assets/icons/09n-1.png differ diff --git a/assets/icons/09n-2.png b/assets/icons/09n-2.png new file mode 100644 index 0000000..3134286 Binary files /dev/null and b/assets/icons/09n-2.png differ diff --git a/assets/icons/09n-3.png b/assets/icons/09n-3.png new file mode 100644 index 0000000..24eb316 Binary files /dev/null and b/assets/icons/09n-3.png differ diff --git a/assets/icons/09n-4.png b/assets/icons/09n-4.png new file mode 100644 index 0000000..0b5116a Binary files /dev/null and b/assets/icons/09n-4.png differ diff --git a/assets/icons/09n.png b/assets/icons/09n.png new file mode 100644 index 0000000..63deb03 Binary files /dev/null and b/assets/icons/09n.png differ diff --git a/assets/icons/09n.svg b/assets/icons/09n.svg new file mode 100644 index 0000000..3a93b92 --- /dev/null +++ b/assets/icons/09n.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + diff --git a/assets/icons/09n@2x.png b/assets/icons/09n@2x.png new file mode 100644 index 0000000..24c3088 Binary files /dev/null and b/assets/icons/09n@2x.png differ diff --git a/assets/icons/10d-1.png b/assets/icons/10d-1.png new file mode 100644 index 0000000..d22a2d7 Binary files /dev/null and b/assets/icons/10d-1.png differ diff --git a/assets/icons/10d-2.png b/assets/icons/10d-2.png new file mode 100644 index 0000000..63be085 Binary files /dev/null and b/assets/icons/10d-2.png differ diff --git a/assets/icons/10d-3.png b/assets/icons/10d-3.png new file mode 100644 index 0000000..4294c63 Binary files /dev/null and b/assets/icons/10d-3.png differ diff --git a/assets/icons/10d-4.png b/assets/icons/10d-4.png new file mode 100644 index 0000000..2e89ae5 Binary files /dev/null and b/assets/icons/10d-4.png differ diff --git a/assets/icons/10d.png b/assets/icons/10d.png new file mode 100644 index 0000000..f82c05f Binary files /dev/null and b/assets/icons/10d.png differ diff --git a/assets/icons/10d.svg b/assets/icons/10d.svg new file mode 100644 index 0000000..23391c2 --- /dev/null +++ b/assets/icons/10d.svg @@ -0,0 +1,39 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/10d@2x.png b/assets/icons/10d@2x.png new file mode 100644 index 0000000..61f474a Binary files /dev/null and b/assets/icons/10d@2x.png differ diff --git a/assets/icons/10n-1.png b/assets/icons/10n-1.png new file mode 100644 index 0000000..10ec880 Binary files /dev/null and b/assets/icons/10n-1.png differ diff --git a/assets/icons/10n-2.png b/assets/icons/10n-2.png new file mode 100644 index 0000000..6302ca4 Binary files /dev/null and b/assets/icons/10n-2.png differ diff --git a/assets/icons/10n-3.png b/assets/icons/10n-3.png new file mode 100644 index 0000000..e10fff3 Binary files /dev/null and b/assets/icons/10n-3.png differ diff --git a/assets/icons/10n-4.png b/assets/icons/10n-4.png new file mode 100644 index 0000000..22a98f5 Binary files /dev/null and b/assets/icons/10n-4.png differ diff --git a/assets/icons/10n.png b/assets/icons/10n.png new file mode 100644 index 0000000..08132ff Binary files /dev/null and b/assets/icons/10n.png differ diff --git a/assets/icons/10n.svg b/assets/icons/10n.svg new file mode 100644 index 0000000..3f4560a --- /dev/null +++ b/assets/icons/10n.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/10n@2x.png b/assets/icons/10n@2x.png new file mode 100644 index 0000000..24b7382 Binary files /dev/null and b/assets/icons/10n@2x.png differ diff --git a/assets/icons/11d-1.png b/assets/icons/11d-1.png new file mode 100644 index 0000000..2efaec9 Binary files /dev/null and b/assets/icons/11d-1.png differ diff --git a/assets/icons/11d-2.png b/assets/icons/11d-2.png new file mode 100644 index 0000000..e7f02dd Binary files /dev/null and b/assets/icons/11d-2.png differ diff --git a/assets/icons/11d-3.png b/assets/icons/11d-3.png new file mode 100644 index 0000000..5c77c3d Binary files /dev/null and b/assets/icons/11d-3.png differ diff --git a/assets/icons/11d-4.png b/assets/icons/11d-4.png new file mode 100644 index 0000000..951cfbd Binary files /dev/null and b/assets/icons/11d-4.png differ diff --git a/assets/icons/11d.png b/assets/icons/11d.png new file mode 100644 index 0000000..50c4087 Binary files /dev/null and b/assets/icons/11d.png differ diff --git a/assets/icons/11d.svg b/assets/icons/11d.svg new file mode 100644 index 0000000..61f0ec2 --- /dev/null +++ b/assets/icons/11d.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + diff --git a/assets/icons/11d@2x.png b/assets/icons/11d@2x.png new file mode 100644 index 0000000..7da549f Binary files /dev/null and b/assets/icons/11d@2x.png differ diff --git a/assets/icons/11n-1.png b/assets/icons/11n-1.png new file mode 100644 index 0000000..2efaec9 Binary files /dev/null and b/assets/icons/11n-1.png differ diff --git a/assets/icons/11n-2.png b/assets/icons/11n-2.png new file mode 100644 index 0000000..e7f02dd Binary files /dev/null and b/assets/icons/11n-2.png differ diff --git a/assets/icons/11n-3.png b/assets/icons/11n-3.png new file mode 100644 index 0000000..5c77c3d Binary files /dev/null and b/assets/icons/11n-3.png differ diff --git a/assets/icons/11n-4.png b/assets/icons/11n-4.png new file mode 100644 index 0000000..951cfbd Binary files /dev/null and b/assets/icons/11n-4.png differ diff --git a/assets/icons/11n.png b/assets/icons/11n.png new file mode 100644 index 0000000..728f17b Binary files /dev/null and b/assets/icons/11n.png differ diff --git a/assets/icons/11n.svg b/assets/icons/11n.svg new file mode 100644 index 0000000..1e64e53 --- /dev/null +++ b/assets/icons/11n.svg @@ -0,0 +1,20 @@ + + + + + + + + + diff --git a/assets/icons/11n@2x.png b/assets/icons/11n@2x.png new file mode 100644 index 0000000..8a41df5 Binary files /dev/null and b/assets/icons/11n@2x.png differ diff --git a/assets/icons/12d-1.png b/assets/icons/12d-1.png new file mode 100644 index 0000000..34f257a Binary files /dev/null and b/assets/icons/12d-1.png differ diff --git a/assets/icons/12d-2.png b/assets/icons/12d-2.png new file mode 100644 index 0000000..b196feb Binary files /dev/null and b/assets/icons/12d-2.png differ diff --git a/assets/icons/12d-3.png b/assets/icons/12d-3.png new file mode 100644 index 0000000..bf55c17 Binary files /dev/null and b/assets/icons/12d-3.png differ diff --git a/assets/icons/12d-4.png b/assets/icons/12d-4.png new file mode 100644 index 0000000..838d73a Binary files /dev/null and b/assets/icons/12d-4.png differ diff --git a/assets/icons/12d.png b/assets/icons/12d.png new file mode 100644 index 0000000..ede8be9 Binary files /dev/null and b/assets/icons/12d.png differ diff --git a/assets/icons/12d.svg b/assets/icons/12d.svg new file mode 100644 index 0000000..82a3efe --- /dev/null +++ b/assets/icons/12d.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/12d@2x.png b/assets/icons/12d@2x.png new file mode 100644 index 0000000..2b670d4 Binary files /dev/null and b/assets/icons/12d@2x.png differ diff --git a/assets/icons/12n-1.png b/assets/icons/12n-1.png new file mode 100644 index 0000000..34f257a Binary files /dev/null and b/assets/icons/12n-1.png differ diff --git a/assets/icons/12n-2.png b/assets/icons/12n-2.png new file mode 100644 index 0000000..b196feb Binary files /dev/null and b/assets/icons/12n-2.png differ diff --git a/assets/icons/12n-3.png b/assets/icons/12n-3.png new file mode 100644 index 0000000..bf55c17 Binary files /dev/null and b/assets/icons/12n-3.png differ diff --git a/assets/icons/12n-4.png b/assets/icons/12n-4.png new file mode 100644 index 0000000..838d73a Binary files /dev/null and b/assets/icons/12n-4.png differ diff --git a/assets/icons/12n.png b/assets/icons/12n.png new file mode 100644 index 0000000..e27dfd2 Binary files /dev/null and b/assets/icons/12n.png differ diff --git a/assets/icons/12n.svg b/assets/icons/12n.svg new file mode 100644 index 0000000..82a3efe --- /dev/null +++ b/assets/icons/12n.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/12n@2x.png b/assets/icons/12n@2x.png new file mode 100644 index 0000000..2b670d4 Binary files /dev/null and b/assets/icons/12n@2x.png differ diff --git a/assets/icons/13d-1.png b/assets/icons/13d-1.png new file mode 100644 index 0000000..eb7a59f Binary files /dev/null and b/assets/icons/13d-1.png differ diff --git a/assets/icons/13d-2.png b/assets/icons/13d-2.png new file mode 100644 index 0000000..04d2c47 Binary files /dev/null and b/assets/icons/13d-2.png differ diff --git a/assets/icons/13d-3.png b/assets/icons/13d-3.png new file mode 100644 index 0000000..573a747 Binary files /dev/null and b/assets/icons/13d-3.png differ diff --git a/assets/icons/13d-4.png b/assets/icons/13d-4.png new file mode 100644 index 0000000..663b87a Binary files /dev/null and b/assets/icons/13d-4.png differ diff --git a/assets/icons/13d.png b/assets/icons/13d.png new file mode 100644 index 0000000..cf265bb Binary files /dev/null and b/assets/icons/13d.png differ diff --git a/assets/icons/13d.svg b/assets/icons/13d.svg new file mode 100644 index 0000000..d16d29a --- /dev/null +++ b/assets/icons/13d.svg @@ -0,0 +1,35 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/13d@2x.png b/assets/icons/13d@2x.png new file mode 100644 index 0000000..68731d5 Binary files /dev/null and b/assets/icons/13d@2x.png differ diff --git a/assets/icons/13n-1.png b/assets/icons/13n-1.png new file mode 100644 index 0000000..6f89bcc Binary files /dev/null and b/assets/icons/13n-1.png differ diff --git a/assets/icons/13n-2.png b/assets/icons/13n-2.png new file mode 100644 index 0000000..929637f Binary files /dev/null and b/assets/icons/13n-2.png differ diff --git a/assets/icons/13n-3.png b/assets/icons/13n-3.png new file mode 100644 index 0000000..82e5753 Binary files /dev/null and b/assets/icons/13n-3.png differ diff --git a/assets/icons/13n-4.png b/assets/icons/13n-4.png new file mode 100644 index 0000000..b59ae8a Binary files /dev/null and b/assets/icons/13n-4.png differ diff --git a/assets/icons/13n.png b/assets/icons/13n.png new file mode 100644 index 0000000..4647c2d Binary files /dev/null and b/assets/icons/13n.png differ diff --git a/assets/icons/13n.svg b/assets/icons/13n.svg new file mode 100644 index 0000000..f4329a9 --- /dev/null +++ b/assets/icons/13n.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + diff --git a/assets/icons/13n@2x.png b/assets/icons/13n@2x.png new file mode 100644 index 0000000..ffd3832 Binary files /dev/null and b/assets/icons/13n@2x.png differ diff --git a/assets/icons/50d-1.png b/assets/icons/50d-1.png new file mode 100644 index 0000000..8c62b7f Binary files /dev/null and b/assets/icons/50d-1.png differ diff --git a/assets/icons/50d-2.png b/assets/icons/50d-2.png new file mode 100644 index 0000000..9ba8758 Binary files /dev/null and b/assets/icons/50d-2.png differ diff --git a/assets/icons/50d-3.png b/assets/icons/50d-3.png new file mode 100644 index 0000000..f8f8506 Binary files /dev/null and b/assets/icons/50d-3.png differ diff --git a/assets/icons/50d-4.png b/assets/icons/50d-4.png new file mode 100644 index 0000000..545a8da Binary files /dev/null and b/assets/icons/50d-4.png differ diff --git a/assets/icons/50d.png b/assets/icons/50d.png new file mode 100644 index 0000000..a97decd Binary files /dev/null and b/assets/icons/50d.png differ diff --git a/assets/icons/50d.svg b/assets/icons/50d.svg new file mode 100644 index 0000000..4e84d0b --- /dev/null +++ b/assets/icons/50d.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + diff --git a/assets/icons/50d@2x.png b/assets/icons/50d@2x.png new file mode 100644 index 0000000..0a91b63 Binary files /dev/null and b/assets/icons/50d@2x.png differ diff --git a/assets/icons/50n-1.png b/assets/icons/50n-1.png new file mode 100644 index 0000000..0d2a33b Binary files /dev/null and b/assets/icons/50n-1.png differ diff --git a/assets/icons/50n-2.png b/assets/icons/50n-2.png new file mode 100644 index 0000000..bb3ff00 Binary files /dev/null and b/assets/icons/50n-2.png differ diff --git a/assets/icons/50n-3.png b/assets/icons/50n-3.png new file mode 100644 index 0000000..f8f8506 Binary files /dev/null and b/assets/icons/50n-3.png differ diff --git a/assets/icons/50n-4.png b/assets/icons/50n-4.png new file mode 100644 index 0000000..8c8eb46 Binary files /dev/null and b/assets/icons/50n-4.png differ diff --git a/assets/icons/50n.png b/assets/icons/50n.png new file mode 100644 index 0000000..26b0ca4 Binary files /dev/null and b/assets/icons/50n.png differ diff --git a/assets/icons/50n.svg b/assets/icons/50n.svg new file mode 100644 index 0000000..733b28b --- /dev/null +++ b/assets/icons/50n.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/assets/icons/50n@2x.png b/assets/icons/50n@2x.png new file mode 100644 index 0000000..ff5e295 Binary files /dev/null and b/assets/icons/50n@2x.png differ diff --git a/assets/icons/IconTemplate@02d.png b/assets/icons/IconTemplate@02d.png new file mode 100644 index 0000000..8169631 Binary files /dev/null and b/assets/icons/IconTemplate@02d.png differ diff --git a/assets/icons/dir-E.png b/assets/icons/dir-E.png new file mode 100644 index 0000000..ef69e59 Binary files /dev/null and b/assets/icons/dir-E.png differ diff --git a/assets/icons/dir-N.png b/assets/icons/dir-N.png new file mode 100644 index 0000000..b43014d Binary files /dev/null and b/assets/icons/dir-N.png differ diff --git a/assets/icons/dir-NE.png b/assets/icons/dir-NE.png new file mode 100644 index 0000000..c069f97 Binary files /dev/null and b/assets/icons/dir-NE.png differ diff --git a/assets/icons/dir-NW.png b/assets/icons/dir-NW.png new file mode 100644 index 0000000..00dd4be Binary files /dev/null and b/assets/icons/dir-NW.png differ diff --git a/assets/icons/dir-S.png b/assets/icons/dir-S.png new file mode 100644 index 0000000..0b4f681 Binary files /dev/null and b/assets/icons/dir-S.png differ diff --git a/assets/icons/dir-SE.png b/assets/icons/dir-SE.png new file mode 100644 index 0000000..c1204fe Binary files /dev/null and b/assets/icons/dir-SE.png differ diff --git a/assets/icons/dir-SW.png b/assets/icons/dir-SW.png new file mode 100644 index 0000000..b8a6881 Binary files /dev/null and b/assets/icons/dir-SW.png differ diff --git a/assets/icons/dir-W.png b/assets/icons/dir-W.png new file mode 100644 index 0000000..f43b64c Binary files /dev/null and b/assets/icons/dir-W.png differ diff --git a/assets/icons/humidity.png b/assets/icons/humidity.png new file mode 100644 index 0000000..0543f43 Binary files /dev/null and b/assets/icons/humidity.png differ diff --git a/assets/icons/icon-adjust.png b/assets/icons/icon-adjust.png new file mode 100644 index 0000000..2800071 Binary files /dev/null and b/assets/icons/icon-adjust.png differ diff --git a/assets/icons/rain.png b/assets/icons/rain.png new file mode 100644 index 0000000..d9f57cd Binary files /dev/null and b/assets/icons/rain.png differ diff --git a/assets/icons/refresh.png b/assets/icons/refresh.png new file mode 100644 index 0000000..cd0f89f Binary files /dev/null and b/assets/icons/refresh.png differ diff --git a/assets/icons/sunrise.png b/assets/icons/sunrise.png new file mode 100644 index 0000000..8a11682 Binary files /dev/null and b/assets/icons/sunrise.png differ diff --git a/assets/icons/sunset.png b/assets/icons/sunset.png new file mode 100644 index 0000000..f0b1e71 Binary files /dev/null and b/assets/icons/sunset.png differ diff --git a/assets/icons/wind.png b/assets/icons/wind.png new file mode 100644 index 0000000..8c82e37 Binary files /dev/null and b/assets/icons/wind.png differ diff --git a/assets/screenshot.gif b/assets/screenshot.gif new file mode 100644 index 0000000..b559738 Binary files /dev/null and b/assets/screenshot.gif differ diff --git a/assets/screenshot.png b/assets/screenshot.png new file mode 100644 index 0000000..f9f2d2a Binary files /dev/null and b/assets/screenshot.png differ diff --git a/index.html b/index.html index bc8114b..241dce9 100644 --- a/index.html +++ b/index.html @@ -1,187 +1,92 @@ - + - - + temps - - - + + - - - - - - - - - - - - - - - - - - - - - - - + + + - - -
- -
- - - - -
- + +
+
+
+
+ settings +
+
- -
- +
+
+
+
+
+
+
+
+ + +
+
+
+
- - -
- {{roundTemp(cityData.main.temp)}}°
- {{cityData.weather[0].description}} - - - - - - - - - - - - - - - - - - - - - - - - -
icondata
- {{cityData.weather[0].description}} -
- windspeed - - {{cityData.wind.speed}} m/s wind direction -
- sunrise - - {{getStyledTime(cityData.sys.sunrise)}} -
- - - - - - - - - - - - - - - - - - - - - - - -
icondata
- humidity - - {{roundTemp(cityData.main.humidity)}}% -
- cloudiness - - {{cityData.clouds.all}}% -
- sunset - - {{getStyledTime(cityData.sys.sunset)}} -
- +
- - - - - - - - - - - - - - - - - - - - - - + + +
+
-
- - - - - -
day°Cweather
- - -
{{getStyledDate($index)}}{{roundTemp(item.temp.day)}}° - {{item.weather[0].description}} -
{{getCuttedTime(item.dt_txt)}}{{roundTemp(item.main.temp)}}° - {{item.weather[0].description}} -
- - -
+
+ +
+
+
+
+

+ temps +

+
+ + +
+
+ + + + You need an api key from openweathermap for your weather data. + +
+
+
Format
+ Celcius + Kelvin +
+
+ +
+
+ +
+
+ temps v0.2.0 © 2016 +
+
+
+
\ No newline at end of file diff --git a/package.json b/package.json index 139608e..9d02e4d 100644 --- a/package.json +++ b/package.json @@ -1,25 +1,47 @@ { "name": "temps", - "version": "0.1.0", - "author": "kmi", + "productName": "Temps", + "version": "0.2.0", "main": "app.js", - "dependencies": { - "angular": "^1.5.5", - "angular-animate": "^1.5.5", - "angular-aria": "^1.5.5", - "angular-material": "1.0.6", - "angular-material-data-table": "^0.10.7", - "menubar": "^4.1.0" - }, + "electronVersion": "1.3.5", "keywords": [ "electron", - "angularjs", "temperature", "weather", - "forecast" + "forecast", + "menuar" ], "scripts": { - "start": "electron app.js", - "pack:osx": "./node_modules/.bin/electron-packager . $npm_package_productName --app-version=$npm_package_version --version=0.36.7 --out=builds --ignore='^/builds$' --platform=darwin --arch=x64 --sign='Developer ID Application: My Company Ltd (ABCDEFGH10)' --icon=icon.icns --overwrite" + "start": "electron .", + "dev": "electron . --debug", + "clean:dist": "rm -rf ./dist", + "build": "npm run build:osx && npm run build:win && npm run build:linux", + "build:osx": "electron-packager . $npm_package_productName --out=dist --ignore='^/dist$' --overwrite --prune --asar --arch=all --platform=darwin --version=$npm_package_electronVersion --app-version=$npm_package_version && node js/post-build-mac.js", + "build:win": "electron-packager . $npm_package_productName --out=dist --arch=all --platform=win32 --ignore='^/dist$' --prune --asar --overwrite --version=$npm_package_electronVersion --app-version=$npm_package_version", + "build:linux": "electron-packager . $npm_package_productName --out=dist --arch=all --platform=linux --ignore='^/dist$' --prune --asar --overwrite --version=$npm_package_electronVersion --app-version=$npm_package_version", + "package": "npm run package:win32 && npm run package:win64 && npm run package:osx && npm run package:linux", + "package:win64": "electron-builder dist/Ampersand-win32-x64/ --platform=win --out=dist --config=config.json && mv 'dist/Ampersand Setup.exe' dist/Ampersand_Windows64.exe", + "package:win32": "electron-builder dist/Ampersand-win32-ia32/ --platform=win --out=dist --config=config.json && mv 'dist/Ampersand Setup.exe' dist/Ampersand_Windows32.exe", + "package:osx": "hdiutil create -format UDZO -srcfolder dist/Ampersand-darwin-x64/Ampersand.app dist/Ampersand_Mac.dmg", + "package:linux": "cd dist/ && zip -r Ampersand_Linux_x64.zip Ampersand-linux-x64 && zip -r Ampersand_Linux_ia32.zip Ampersand-linux-ia32 && cd ../" + }, + "author": "Konrad Michalik ", + "license": "MIT", + "devDependencies": { + "devtron": "^1.3.0", + "electron-packager": "^8.0.0", + "electron-prebuilt": "^1.3.5", + "electron-installer-dmg": "0.1.2", + "electron-builder": "6.4.0" + }, + "dependencies": { + "electron": "1.3.5", + "menubar": "^4.1.0", + "jquery": "^3.1.0", + "json-storage": "^2.1.1", + "localStorage": "^1.0.3", + "sugar": "^2.0.1", + "chart.js": "^2.2.2", + "tooltipster": "^4.1.4" } } diff --git a/src/libs/animate.min.css b/src/libs/animate.min.css new file mode 100755 index 0000000..b6f6129 --- /dev/null +++ b/src/libs/animate.min.css @@ -0,0 +1,11 @@ +@charset "UTF-8"; + +/*! + * animate.css -http://daneden.me/animate + * Version - 3.5.1 + * Licensed under the MIT license - http://opensource.org/licenses/MIT + * + * Copyright (c) 2016 Daniel Eden + */ + +.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06)}70%{-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,20%,53%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}40%,43%,70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06)}70%{-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}.headShake{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-name:headShake;animation-name:headShake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:none;transform:none}}@keyframes wobble{0%{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:none;transform:none}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{0%,11.1%,to{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{0%,11.1%,to{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}to{-webkit-transform:none;transform:none}}@keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}to{-webkit-transform:none;transform:none}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}to{-webkit-transform:none;transform:none}}@keyframes bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}to{-webkit-transform:none;transform:none}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:none;transform:none}}@keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:none;transform:none}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotateY(-1turn);transform:perspective(400px) rotateY(-1turn)}0%,40%{-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);transform:perspective(400px) translateZ(150px) rotateY(-190deg)}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);transform:perspective(400px) translateZ(150px) rotateY(-170deg)}50%,80%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95)}to{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) rotateY(-1turn);transform:perspective(400px) rotateY(-1turn)}0%,40%{-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);transform:perspective(400px) translateZ(150px) rotateY(-190deg)}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);transform:perspective(400px) translateZ(150px) rotateY(-170deg)}50%,80%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95)}to{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}0%,40%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg)}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}0%,40%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg)}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}0%,40%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}40%{-webkit-transform:perspective(400px) rotateY(-20deg);transform:perspective(400px) rotateY(-20deg)}60%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateY(-5deg);transform:perspective(400px) rotateY(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}0%,40%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}40%{-webkit-transform:perspective(400px) rotateY(-20deg);transform:perspective(400px) rotateY(-20deg)}60%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateY(-5deg);transform:perspective(400px) rotateY(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateY(-15deg);transform:perspective(400px) rotateY(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateY(-15deg);transform:perspective(400px) rotateY(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg)}60%,80%{opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg)}to{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg)}60%,80%{opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg)}to{-webkit-transform:none;transform:none;opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{transform-origin:center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}0%,to{-webkit-transform-origin:center}to{transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateIn{0%{transform-origin:center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}0%,to{-webkit-transform-origin:center}to{transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownLeft{0%{transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{transform-origin:right bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownRight{0%{transform-origin:right bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpLeft{0%{transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpRight{0%{transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{transform-origin:center;opacity:1}0%,to{-webkit-transform-origin:center}to{transform-origin:center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{transform-origin:center;opacity:1}0%,to{-webkit-transform-origin:center}to{transform-origin:center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{transform-origin:left bottom;opacity:1}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}@keyframes rotateOutDownLeft{0%{transform-origin:left bottom;opacity:1}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{transform-origin:right bottom;opacity:1}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateOutDownRight{0%{transform-origin:right bottom;opacity:1}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{transform-origin:left bottom;opacity:1}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateOutUpLeft{0%{transform-origin:left bottom;opacity:1}0%,to{-webkit-transform-origin:left bottom}to{transform-origin:left bottom;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{transform-origin:right bottom;opacity:1}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{transform-origin:right bottom;opacity:1}0%,to{-webkit-transform-origin:right bottom}to{transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{transform-origin:top left}0%,20%,60%{-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);transform-origin:top left}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{transform-origin:top left}0%,20%,60%{-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);transform-origin:top left}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:none;transform:none}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}@keyframes rollOut{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1}50%{-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%,to{opacity:0}}@keyframes zoomOut{0%{opacity:1}50%{-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%,to{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp} \ No newline at end of file diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..fa67412 --- /dev/null +++ b/src/main.js @@ -0,0 +1,117 @@ +var localStorage = require('localStorage'); +var JsonStorage = require('json-storage').JsonStorage; +var store = JsonStorage.create(localStorage, 'temps', { stringify: true }); + +var $, jQuery = require('jquery'); +var sugar = require("sugar"); +var chart = require("chart.js"); +var ipcRenderer = require('electron').ipcRenderer; + +var wdata = null; +var fdata = null; +var hdata = null; + +var color = null; + +window.onload = function () +{ + + // store.set('format', 'metric'); + // store.set('apikey', '3262d5cec239ea0fc97e9b9ebddf9a10'); + + init(); + + refreshWeather(); + + loadEventListener(); + +}; + +var loadEventListener = function() { + + jQuery('#details .content').click(toggleDetails); + + showDate(); + + jQuery('input#city').keypress(function (e) { + if (e.which == 13) { + setCity(jQuery('input#city').val()); + refreshWeather(); + toggleSettings(); + return false; //<---- Add this line + } + }); + + jQuery('input#apikey').keypress(function (e) { + if (e.which == 13) { + setApiKey(jQuery('input#apikey').val()); + refreshWeather(); + toggleSettings(); + return false; //<---- Add this line + } + }); + + jQuery('input[type="radio"][name="format"]').change(function () { + setFormat(jQuery(this).val()); + refreshWeather(); + }); + + jQuery('input[type="checkbox"][name="mb-info"]').change(function () { + var bool =jQuery('input[type="checkbox"][name="mb-info"]:checked').length > 0; + setMbInfo(bool); + if (getMbInfo()) { + refreshWeather(); + } else { + console.log('send'); + ipcRenderer.send('no-title'); + } + }); + + jQuery('.location').click(function () { + toggleSettings(); + jQuery('input#city').delay(600).focus().select(); + }); + + jQuery('#main:not(div.settings)').click(function () { + refreshWeather(); + }); + + jQuery('#main .settings img').click(function() { + toggleSettings(); + }); + + jQuery('#settings .close').click(function() { + ipcRenderer.send('close'); + }); + + ipcRenderer.on('show', function() { + console.log('show'); + refreshWeather(); + }); +}; + +var init = function() { + if (store.get('actual-city')) { + setCity(store.get('actual-city')); + } else { + setCity('Dresden, DE'); + } + + if (store.get('format')) { + setFormat(store.get('format')); + } else { + setFormat('metric'); + } + + if (store.get('apikey')) { + setApiKey(store.get('apikey')); + } else { + showErrorMessage('No api key.') + } + + if (store.get('mb-info') != null) { + setMbInfo(store.get('mb-info')); + } else { + setMbInfo(true); + } +}; \ No newline at end of file diff --git a/src/style.css b/src/style.css new file mode 100644 index 0000000..fc1db8e --- /dev/null +++ b/src/style.css @@ -0,0 +1,396 @@ +html { + height: 100%; + width: 100%; + overflow: hidden; +} + +body { + height: 100%; + padding: 0; + margin: 0; + font-family: Bariol, sans-serif; + overflow: hidden; + background-color: #FFFFFF; + -webkit-overflow-scrolling: touch; +} + +a { + text-decoration: none; +} + +a:hover { + cursor: pointer; +} + +.no-padding { + padding: 0 !important; +} + +.hidden { + display: none; +} + +h1 { + margin: 0px; + padding: 0; + text-align: center; +} + +h1:after { + content: ' '; + width: 20px; + height: 20px; + background: url('../assets/IconTemplate@2x.png') no-repeat center center; + background-size: cover; + position: absolute; + -webkit-animation-name: spin; + -webkit-animation-duration: 4000ms; + -webkit-animation-iteration-count: infinite; + -webkit-animation-timing-function: linear; + + -moz-animation-name: spin; + -moz-animation-duration: 4000ms; + -moz-animation-iteration-count: infinite; + -moz-animation-timing-function: linear; + + -ms-animation-name: spin; + -ms-animation-duration: 4000ms; + -ms-animation-iteration-count: infinite; + -ms-animation-timing-function: linear; + + animation-name: spin; + animation-duration: 4000ms; + animation-iteration-count: infinite; + animation-timing-function: linear; +} + +.spin { + -webkit-animation-name: spin; + -webkit-animation-duration: 4000ms; + -webkit-animation-iteration-count: infinite; + -webkit-animation-timing-function: linear; + + -moz-animation-name: spin; + -moz-animation-duration: 4000ms; + -moz-animation-iteration-count: infinite; + -moz-animation-timing-function: linear; + + -ms-animation-name: spin; + -ms-animation-duration: 4000ms; + -ms-animation-iteration-count: infinite; + -ms-animation-timing-function: linear; + + animation-name: spin; + animation-duration: 4000ms; + animation-iteration-count: infinite; + animation-timing-function: linear; +} + +@-ms-keyframes spin { + from { + -ms-transform: rotate(0deg); + } to { + -ms-transform: rotate(360deg); + } +} +@-moz-keyframes spin { + from { + -moz-transform: rotate(0deg); + } to { + -moz-transform: rotate(360deg); + } +} +@-webkit-keyframes spin { + from { + -webkit-transform: rotate(0deg); + } to { + -webkit-transform: rotate(360deg); + } +} +@keyframes spin { + from { + transform: rotate(0deg); + } to { + transform: rotate(360deg); + } +} + +.drop { + /*background:-webkit-gradient(linear,0% 0%,0% 100%, from(rgba(13,52,58,1) ), to(rgba(255,255,255,0.6)) ); + background: -moz-linear-gradient(top, rgba(13,52,58,1) 0%, rgba(255,255,255,.6) 100%);*/ + background-color: rgba(255,255,255,0.1); + width:1px; + height:50px; + position: absolute; + bottom:200px; + -webkit-animation: fall .63s linear infinite; + -moz-animation: fall .63s linear infinite; + +} + +/* animate the drops*/ +@-webkit-keyframes fall { + to {margin-top:900px;} +} +@-moz-keyframes fall { + to {margin-top:900px;} +} + +#main { + width: 100%; + height: 300px; + display: block; + overflow: hidden; + background-color: #CCCCCC; + color: #ffffff; + background-image: url('../assets/background.png'); + background-repeat: no-repeat; + background-position: bottom; + background-size: 100%; + + -webkit-transition: all 1s ease-in-out; + -moz-transition: all 1s ease-in-out; + -o-transition: all 1s ease-in-out; + transition: all 1s ease-in-out; +} + +#main .thunder { + width: 100%; + height: 100%; + background-color: rgba(255,255,255,0); + position: relative; + display: block; + top: 0; + animation-name: thunder; + animation-delay: 5s; + animation-duration: 8s; + animation-iteration-count: infinite; +} + +/* The animation code */ +@keyframes thunder { + 1% {background-color: rgba(255,255,255,1);} + 30% {background-color: rgba(255,255,255,0);} + 100% {background-color: rgba(255,255,255,0);} +} + +#main .content { + width: 100%; + height: 100px; + position: absolute; + top: 30%; + z-index: 5; + margin-top: -30px; + text-align: center; +} + +#main .content hr { + width: 24px; + border: none; + height: 2px; + margin-top: 5px; + margin-bottom: 10px; + background-color: #ffffff; +} + +#main .temp { + font-size: 48px; + margin-left: 15px; +} + +#main .temp:after { + font-size: 48px; + content: '°'; +} + +#main .temp-note { + font-size: 18px; + color: rgba(255,255,255,0.5); +} + +#main .header { + z-index: 5; +} + +#main .clock { + width: 40px; + height: 20px; + position: absolute; + top: 10px; + right: 10px; + text-align: right; + font-size: 12px; +} + +#main .settings { + width: 20px; + height: 20px; + top: 10px; + left: 10px; + position: absolute; +} + +#main .settings img:hover { + cursour: pointer; +} + +#main .actual-icon { + width: 80px; + height: 80px; + top: 14%; + left: 8%; + position: absolute; + z-index: 5; +} + +#main .actual-icon svg g { + fill: red; +} + +#details { + width: 100%; + height: 140px; + color: #CCCCCC; + z-index: 5; +} + +#details:hover { + cursor: pointer; +} + +#details .date, #details .location { + width: 50%; + font-size: 14px; + float: left; + padding: 10px; + text-align: center; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box;; +} + +#details .header::after { + content: ""; + clear: both; + display: block; +} + +#details .forecast { + width: 100%; +} + +#details .forecast::after { + content: ""; + clear: both; + display: block; +} + +#details .forecast-item { + width: 25%; + height: auto; + float: left; + text-align: center; + padding: 5px; + box-sizing: border-box; + border-left: 1px solid #f9f9f9; +} + +#details .forecast-item div { + width: 100%; +} + +#details .forecast-item .date { + font-size: 10px; +} + +#details .forecast-item .icon svg path { + -webkit-transition: all 1s ease-in-out; + -moz-transition: all 1s ease-in-out; + -o-transition: all 1s ease-in-out; + transition: all 1s ease-in-out; +} + +#details .forecast-item .temp { + font-size: 14px; +} + +#details .hourly { + margin-top: 10px; +} + +#settings { + z-index: 5; + width: 100%; + height: 0px; + + -webkit-transition: all 1s ease-in-out; + -moz-transition: all 1s ease-in-out; + -o-transition: all 1s ease-in-out; + transition: all 1s ease-in-out; +} + +#settings .content { + display: none; + padding: 10px; + box-sizing: border-box; +} + +#settings .form-item { + padding: 10px 0; +} + +#settings .form-item label, #settings .form-item .label { + display: block; + color: #CCC; +} + +#settings .form-item input[type="text"] { + display: block; + width: 100%; + padding: 5px; + font-size: 16px; + border: none; + border-bottom: 1px solid #CCC; + box-sizing: border-box; +} + +#settings .form-item input[type="text"]:focus { + border-bottom: 1px solid #000; + outline: 0; +} + +#settings .form-item span.help, #settings .footer { + width: 100%; + font-size: 10px; + color: #ccc; +} + +#settings .form-item span.help a, #settings .footer a { + color: #000; +} + +#settings button { + width: 100%; + text-align: center; + border: 1px solid #CCC; + color: #000; + background: #FFF; + box-sizing: border-box; + font-size: 16px; +} + +#settings button:hover { + cursor: pointer; +} + +#settings .footer { + text-align: center; +} +@keyframes pulse { + 0% { opacity: 1; } + 100% { opacity: 0; } +} + +body { + margin: 0; +} \ No newline at end of file diff --git a/src/utils.js b/src/utils.js new file mode 100644 index 0000000..e698577 --- /dev/null +++ b/src/utils.js @@ -0,0 +1,211 @@ +var months = ['jan','feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec']; + +var getTodayDay = function () { + var days = [ + "monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday" + ]; + var date = new Date(); + return days[(date.getDay() - 1 )]; +}; + +var getTodayDate = function () { + var date = new Date(); + return getTodayDay() + ', ' + months[date.getMonth()] + ' ' + date.getDate(); +}; + +var getTime = function() { + var dt = new Date(); + return dt.getHours() + ":" + addZero(dt.getMinutes()); +}; + +var getStyledDate = function (num) { + var days = [ + "mon", "tue", "wed", "thu", "fri", "sat", "sun" + ]; + var date = new Date(); + return days[(date.getDay() + num) % 7]; +}; +var getCuttedTime = function (time) { + return time.substring(11, 16); +}; + +var getStyledTime = function (time) { + var date = new Date(time * 1000); + return date.getHours() + ":" + date.getMinutes(); +}; + +var countNumber = function (i) { + return ((i % 4) + 1); +}; + +var setColor = function (c) { + color = c; + jQuery('#main').css('background-color',c); + jQuery('#details .forecast-item svg path').css('fill',c); +}; + +var colorPalette = function() { + var temp = roundTemp(wdata.main.temp); + var colors = ['#b1695a', '#db9864', '#e3bb88', '#def1c5', '#80bbb2', '#69a5a6']; + if (temp > 30) { + setColor(colors[0]); + } else if (temp > 26) { + setColor(colors[1]); + } else if (temp > 20) { + setColor(colors[2]); + } else if (temp >14) { + setColor(colors[4]); + } else if (temp > 8) { + setColor(colors[4]); + } else { + setColor(colors[5]); + } +}; + +var roundTemp = function (temp) { + return Math.round(temp); +}; + +var toggleSettings = function() { + if (jQuery('#settings .content').is(":visible")) { + jQuery('#main').height('300px'); + jQuery('#main .content').delay(500).fadeIn(); + jQuery('#main .actual-icon').delay(500).fadeIn(); + jQuery('#details').delay(500).fadeIn(); + jQuery('#settings').height('0px'); + jQuery('#settings .content').fadeOut(); + } else { + jQuery('#main').height('120px'); + jQuery('#main .content').fadeOut(); + jQuery('#main .actual-icon').fadeOut(); + jQuery('#details').fadeOut(); + jQuery('#settings').height('340px'); + jQuery('#settings .content').delay(500).fadeIn(); + } + +}; + +var addZero = function(i) { + if (i < 10) { + i = "0" + i; + } + return i; +}; + +var showHourly = function () { + jQuery('#details .hourly').removeClass('hidden'); + jQuery('#details .forecast').addClass('hidden'); +}; + +var showForecast = function () { + jQuery('#details .hourly').addClass('hidden'); + jQuery('#details .forecast').removeClass('hidden'); +}; + +var toggleDetails = function() { + // jQuery('#details .hourly').toggleClass('hidden'); + // jQuery('#details .forecast').toggleClass('hidden'); + if (jQuery('#details .hourly').is(':visible')) { + jQuery('#details .hourly').fadeOut(); + jQuery('#details .forecast').delay(500).fadeIn(); + } else { + jQuery('#details .forecast').fadeOut(); + jQuery('#details .hourly').delay(500).fadeIn(); + showHourlyWeatherData(); + } + +}; + +var showDate = function() { + jQuery('#details .header .date').html(getTodayDate()); + jQuery('#main .clock').html(getTime()); + var clock = setInterval(function() + { + jQuery('#details .header .date').html(getTodayDate()); + jQuery('#main .clock').html(getTime()); + console.log('refresh clock'); + }, 60000); +}; + +var setCity = function(city) { + store.set('actual-city', city); + jQuery('#settings input#city').val(city); +}; + +var setFormat = function(format) { + store.set('format', format); + jQuery('input:radio[value=' + format + ']')[0].checked = true; +}; + +var setApiKey = function(key) { + store.set('apikey', key); + jQuery('#settings input#apikey').val(key); +}; + +var setMbInfo = function(bool) { + store.set('mb-info', bool); + jQuery('input[type="checkbox"]').prop('checked', bool); +}; + +var showErrorMessage = function(message) { + // ToDo + setColor('#444444'); + jQuery('#main .content .temp').html('=('); + jQuery('#main .content .temp-note').html(message); +}; + +var getMbInfo = function() { + if (store.get('mb-info') != null) { + return store.get('mb-info'); + } else { + return true; + } +}; + +var getApiKey = function () { + if (store.get('apikey')) { + return store.get('apikey') + } else { + showErrorMessage('No API Key'); + } +}; + +var getFormat = function() { + if (store.get('format')) { + return store.get('format'); + } else { + return 'metric'; + } +}; + +var getCity = function () { + return store.get('actual-city'); +}; + +// number of drops created. +var nbDrop = 300; + +var showRain = function() { + for( i=1;i
'); + jQuery('#drop'+i).css('left',dropLeft); + jQuery('#drop'+i).css('top',dropTop); + } +}; + +var showThunder = function() { + jQuery('#main').prepend('
'); +}; + +var reset = function() { + jQuery('.drop').remove(); + jQuery('.thunder').remove(); +}; + +// function to generate a random number range. +function randRange( minNum, maxNum) { + return (Math.floor(Math.random() * (maxNum - minNum + 1)) + minNum); +} \ No newline at end of file diff --git a/src/weather.js b/src/weather.js new file mode 100644 index 0000000..24498d8 --- /dev/null +++ b/src/weather.js @@ -0,0 +1,181 @@ +function getWeather (city) { + jQuery.get("http://api.openweathermap.org/data/2.5/weather?q=" + city + "&mode=json&units=" + getFormat() + "&appid=" + getApiKey(), function(weatherdata){ + wdata = weatherdata; + console.log(weatherdata); + }).done(function() { + setCity(city); + showWeatherData(); + }); +} + +function getForecast (city) { + jQuery.get("http://api.openweathermap.org/data/2.5/forecast/daily?q=" + city + "&mode=json&units=" + getFormat() + "&cnt=7&appid=" + getApiKey(), function(weatherdata){ + fdata = weatherdata; + console.log(weatherdata); + }).done(function() { + setCity(city); + showForecastWeatherData(); + }); +} +function getForecastHourly (city) { + jQuery.get("http://api.openweathermap.org/data/2.5/forecast?q=" + city + "&mode=json&units=" + getFormat() + "&cnt=10&appid=" + getApiKey(), function(weatherdata){ + hdata = weatherdata; + console.log(weatherdata); + }).done(function() { + setCity(city); + showHourlyWeatherData(); + }); +} + +var refreshWeather = function () { + reset(); + getWeather(getCity()); + getForecast(getCity()); + getForecastHourly(getCity()); + window.setTimeout(function() { + if (getMbInfo()) { + ipcRenderer.send('set-title', { + temperature: roundTemp(wdata.main.temp), + location: getCity(), + icon: wdata.weather[0].icon + }); + } + }, 500); + + + window.setTimeout( colorPalette, 500 ); +}; + +var showWeatherData = function() { + jQuery('#main .temp').html(roundTemp(wdata.main.temp)); + jQuery('#main .temp-note').html(wdata.weather[0].description); + jQuery('#details .location').html(wdata.name.toLowerCase() + ', ' + wdata.sys.country.toLowerCase()); + jQuery('#main .actual-icon svg').html(''); + + if (wdata.weather[0].main == 'Rain') { + showRain(); + } + + if (wdata.weather[0].icon == '11d' || wdata.weather[0].icon == '11n') { + showThunder(); + } +}; + +var showForecastWeatherData = function() { + jQuery('#details .forecast').html(''); + var html = ''; + for (var i = 0; i < 4; i++) { + html += '
'; + html += '
' + getStyledDate(i) + '
'; + // html += '
' + fdata.list[i].weather[0].description + '
'; + html += '
' + fdata.list[i].weather[0].description + '
'; + html += '
' + roundTemp(fdata.list[i].temp.day) + '°
'; + html += '
'; + } + jQuery('#details .forecast').html(html); + + jQuery('.forecast-item .icon').each(function (el) { + jQuery(this).html(''); + jQuery(this).load('assets/icons/' + jQuery(this).attr('name') + '.svg'); + }); +}; + +var showHourlyWeatherData = function () { + var wrap = jQuery('#details .hourly'); + wrap.html(''); + var c = jQuery('#details .hourly #chart');; + var d = []; + var max = 0; + var min = 50; + for (var i = 0; i < 10; i++) { + var date = hdata.list[i].dt_txt; + var temp = roundTemp(hdata.list[i].main.temp); + var obj = { + x: date, + y: temp + }; + d[i] = obj; + if (temp < min) { + min = temp; + } + if (temp > max) { + max = temp; + } + } + + max += 5; + min -= 5; + + var chart = new Chart(c, { + type: 'line', + data: { + datasets: [{ + data: d, + fill: false, + lineTension: 0.5, + backgroundColor: "rgba(75,192,192,0.4)", + borderColor: color, + borderCapStyle: 'butt', + borderDash: [], + borderDashOffset: 0.0, + borderJoinStyle: 'miter', + pointBorderColor: color, + pointBackgroundColor: color, + pointBorderWidth: 1, + pointHoverRadius: 4, + pointHoverBackgroundColor: color, + pointHoverBorderColor: color, + pointHoverBorderWidth: 2, + pointRadius: 1, + pointHitRadius: 10, + label: '°C' + }], + fill: false, + borderWidth: 1, + borderColor: 'rgba(0,0,0,1)', + responsive: true, + }, + options: { + legend: { + display: false, + labels: { + hidden: true + } + }, + tooltips: { + backgroundColor: 'rgba(255,255,255,0.8)', + titleFontFamily: 'Bariol, sans-serif', + titleFontColor: '#CCC', + titleFontSize: 14, + bodyFontFamily: 'Bariol, sans-serif', + bodyFontColor: '#000', + bodyFontSize: 18, + callbacks: { + yLabel: 'HELLO;' + } + }, + scales: { + xAxes: [{ + type: 'time', + position: 'bottom', + time: { + unit: 'hour', + tooltipFormat: 'ddd - HH:mm', + displayFormats: { + hour: 'MMM D, hA' + } + }, + display: false + }], + yAxes: [{ + display: false, + ticks: { + max: max, + min: min + }, + labelString: 'Value' + }] + } + } + }); +};