diff --git a/README.md b/README.md index b118ccd..a50e26a 100644 --- a/README.md +++ b/README.md @@ -126,45 +126,6 @@ projectRoot ``` -### Android Quirks - -In your `config.xml`, you need to add the following preferences: - -```xml - - - -``` - -The first parameter represents how long the splashscreen will appear in milliseconds. It defaults to 3000 ms. - -"SplashMaintainAspectRatio" preference is optional. If set to true, splash screen drawable is not stretched to fit screen, but instead simply "covers" the screen, like CSS "background-size:cover". This is very useful when splash screen images cannot be distorted in any way, for example when they contain scenery or text. This setting works best with images that have large margins (safe areas) that can be safely cropped on screens with different aspect ratios. - -The plugin reloads splash drawable whenever orientation changes, so you can specify different drawables for portrait and landscape orientations. - -"SplashShowOnlyFirstTime" preference is also optional and defaults to `true`. When set to `true` splash screen will only appear on application launch. However, if you plan to use `navigator.app.exitApp()` to close application and force splash screen appear on next launch, you should set this property to `false` (this also applies to closing the App with Back button). - -### Browser Quirks - -You can use the following preferences in your `config.xml`: - -```xml - - - - - - - - -``` - -__Note__: `SplashScreen` value should be absolute in order to work in a sub-page. The `SplashScreen` value is used only for the browser platform. The value will be ignored for other platforms. - -### Android and iOS Quirks - -- In iOS, the splashscreen images are called launch images. These images are mandatory on iOS. - - `FadeSplashScreen` (boolean, defaults to `true`): Set to `false` to prevent the splash screen from fading in and out when its display state changes. @@ -206,6 +167,58 @@ window.setTimeout(function () { ``` +### Android Quirks + +In your `config.xml`, you need to add the following preferences: + +```xml + + + +``` + +The first parameter represents how long the splashscreen will appear in milliseconds. It defaults to 3000 ms. + +"SplashMaintainAspectRatio" preference is optional. If set to true, splash screen drawable is not stretched to fit screen, but instead simply "covers" the screen, like CSS "background-size:cover". This is very useful when splash screen images cannot be distorted in any way, for example when they contain scenery or text. This setting works best with images that have large margins (safe areas) that can be safely cropped on screens with different aspect ratios. + +The plugin reloads splash drawable whenever orientation changes, so you can specify different drawables for portrait and landscape orientations. + +"SplashShowOnlyFirstTime" preference is also optional and defaults to `true`. When set to `true` splash screen will only appear on application launch. However, if you plan to use `navigator.app.exitApp()` to close application and force splash screen appear on next launch, you should set this property to `false` (this also applies to closing the App with Back button). + +### Browser Quirks + +You can use the following preferences in your `config.xml`: + +```xml + + + + + + + + +``` + +__Note__: `SplashScreen` value should be absolute in order to work in a sub-page. The `SplashScreen` value is used only for the browser platform. The value will be ignored for other platforms. + +### iOS Quirks + +- In iOS, the splashscreen images are called launch images. These images are mandatory on iOS. + +### Windows Quirks + +- `SplashScreenSpinnerColor` (string, defaults to system accent color): hash, rgb notation or CSS color name. + + + + + +- `SplashScreenBackgroundColor` (string, defaults to #464646): hex notation. + + + + ## Methods - splashscreen.show diff --git a/package.json b/package.json index 0abdcab..d577ef7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "cordova-plugin-splashscreen", - "version": "3.2.3-dev", + "version": "4.0.0", "description": "Cordova Splashscreen Plugin", "cordova": { "id": "cordova-plugin-splashscreen", @@ -38,12 +38,17 @@ "test": "npm run jshint", "jshint": "node node_modules/jshint/bin/jshint www && node node_modules/jshint/bin/jshint src && node node_modules/jshint/bin/jshint tests" }, - "engines": [ - { - "name": "cordova-android", - "version": ">=3.6.0" + "engines": { + "cordovaDependencies": { + "2.0.0": { + "cordova-android": ">=3.6.0" + }, + "4.0.0": { + "cordova-android": ">=3.6.0", + "cordova-windows": ">=5.0.0" + } } - ], + }, "author": "Apache Software Foundation", "license": "Apache-2.0", "devDependencies": { diff --git a/plugin.xml b/plugin.xml index 655ce94..c1d9293 100644 --- a/plugin.xml +++ b/plugin.xml @@ -20,7 +20,7 @@ + version="4.0.0"> Splashscreen Cordova Splashscreen Plugin Apache 2.0 @@ -30,6 +30,7 @@ + diff --git a/www/windows/SplashScreenProxy.js b/www/windows/SplashScreenProxy.js index 1c54883..1003f06 100644 --- a/www/windows/SplashScreenProxy.js +++ b/www/windows/SplashScreenProxy.js @@ -20,56 +20,15 @@ */ /*jslint sloppy:true */ -/*global WinJS */ -var cordova = require('cordova'); - -var isPhone = (cordova.platformId == "windows") && WinJS.Utilities.isPhone; -var isHosted = window.location.protocol.indexOf('http') === 0; -var localSplash = null, localSplashImage = null; -var bgColor = "#464646"; // default backgrond color; TDOO - read it from .appxmanifest -var splashImageSrc = (isHosted ? "ms-appx-web" : "ms-appx") + ":///images/" + - (isPhone ? "splashscreenphone.png" : "splashscreen.png"); +var splash = require('cordova/splashscreen'); var SplashScreen = { - setBGColor: function (cssBGColor) { - bgColor = cssBGColor; - if (localSplash) { - localSplash.style.backgroundColor = bgColor; - } - }, show: function () { - if (localSplash) { - return; // already showed - } - - localSplash = document.createElement("div"); - localSplash.style.backgroundColor = bgColor; - localSplash.style.position = "fixed"; - localSplash.style.top = "0"; - localSplash.style.width = "100%"; - localSplash.style.height = "100%"; - - localSplashImage = document.createElement("img"); - localSplashImage.src = splashImageSrc; - localSplashImage.style.maxWidth = "100%"; - localSplashImage.style.maxHeight = "100%"; - // center horizontally - localSplashImage.style.margin = "0 auto"; - localSplashImage.style.display = "block"; - // center vertically - localSplashImage.style.position = "relative"; - localSplashImage.style.top = "50%"; - localSplashImage.style.transform = "translateY(-50%)"; - - localSplash.appendChild(localSplashImage); - document.body.appendChild(localSplash); + splash.show(); }, hide: function () { - if (localSplash) { - document.body.removeChild(localSplash); - localSplash = null; - } + splash.hide(); } };