should read:

 "main": "smart-app-banner.js",

Hi, I want to make the banner always display to change the style. Currently when I close it or click the button, the banner never display again(maybe within one day). How to change it? Thanks

I need to add a logo in the smart banner. Is there an option for that?

In the previous version it showed the banner only for android, now in version 1.3.1 does not show the banner in any version and in the console does not indicate any error.

15 open and active PRs like #80, but no word from @dfcreative. I am worried to use this package.

Hi,
I am trying to see if this library can be used in my application but have one restriction.

IoS works correctly for below kind of URL
https://itunes.apple.com/us/app/id888475991?mt=8
but it fails when there is additional path in the URL for e.g. stearns-bank-n-a-for-ipad
https://itunes.apple.com/us/app/stearns-bank-n-a-for-ipad/id888475991?mt=8

Can this library handle extra path like above?

i am not able to access when i use the app banner on IOS 10 due to some insecured content, can someone help me out with this

Hello, I was hoping you could add a license to this repo. Having no license chosen usually defaults to retaining all rights (http://choosealicense.com/no-license/). Thanks

Is there any way to handle UTM links for Google Play?
It is useful to measure incoming users.

https://developers.google.com/analytics/devguides/collection/android/v4/campaigns#google-play-url-builder

It seems we can use an intent call on android devices to open the app or the store

smart-app-banner does not seem to use this great possibility,

Using the followinf snippet (from http://christopher5106.github.io/mobile/2015/03/26/web-redirection-to-mobile-web-or-app-with-a-modal-box.html)

window.location = 'intent:/'+$("meta[property='al:android:url']").attr("content").split(':/')[1]+'#Intent;package='+$("meta[property='al:android:package']").attr("content")+';scheme='+$("meta[property='al:android:url']").attr("content").split(':/')[0]+';launchFlags=268435456;end;';

As url seem a better way (AND we could use custom Scheme Url to open the app in the appropriate page)

thanks

The logic currently hides the banner for anything on iOS 6+. However a user may be using a browser other than Safari, such as Chrome and will not see the smart banner. Ideally this library would only hide if also using Safari.

The readme.md should provide the all the options that the function can accept.

I get the error : Uncaught TypeError: Cannot read property 'appendChild' of null

Smartbanner.js line: 189 "document.body.appendChild(sb);"

But "sb" does get declared a few lines higher up "var sb = document.createElement('div');"

Any idea what might be the issue?

smartbanner.js

Array.prototype.forEach = function(callback, thisObj) {
for (var i = 0,len = this.length; i < len; i++)
callback.call(thisObj, this[i], i, this);
};

Thanks for a great plugin! Helped solved a need to show a custom banner in our app. When the application boots, it create's the banner, but will only show it under a certain screen. It would be really helpful to be able to pass in an option or a paramater to not call show on construction. Showing could be the default behavior still, so this change wouldn't break the existing API. Could I create a PR for this?

Is there any built-in way to hide the banner when the page is loaded through a native app using webview?

Hi,

Is there an option (or can it be implemented) so that the native iOS banner can be disabled and keep the different styling on the banners on each platform? I'm aware there is a "force" and "theme" option but this forces iOS or Android styles on both whereas I want the plugin banner to display with iOS styles on iOS and Android styles on Android.

The reason why I am asking is partly to get around the issue with the native iOS banner displaying in addition to the plugin banner. Assuming this issue got resolved, one might prefer to display the native banner on iOS however the plugin banner allows flexibility in defining the content of the banner whereas the native one does not.

Hope to hear your thoughts on this soon!

Thanks

Validator returns the following error:
error: Bad value “android-touch-icon” for attribute “rel” on element “link”: The string “android-touch-icon” is not a registered keyword.

Used validator:
https://validator.w3.org/nu/

If you don't plan to change the "rel" attribute, consider changing the following wiki (which the validator uses as a source):
http://microformats.org/wiki/existing-rel-values#HTML5_link_type_extensions

I used the following config:

new SmartBanner({
    daysHidden: 15,   // days to hide banner after close button is clicked (defaults to 15)
    daysReminder: 90, // days to hide banner after "VIEW" button is clicked (defaults to 90)
    //appStoreLanguage: 'us', // language code for the App Store (defaults to user's browser language)
    title: 'Uala',
    author: 'Uala S.r.l.',
    button: 'Scopri',
    store: {
        ios: 'Sull\'App Store',
        android: 'Su Google Play',
        windows: 'Sul Windows Store'
    },
    price: {
        ios: 'GRATIS',
        android: 'GRATIS',
        windows: 'GRATIS'
    }
    //, force: 'ios' // Uncomment for platform emulation (ios, android, windows)
});

It works only if I force iOS

I tried:

npm install --save smart-app-banner

But got the following error:

npm WARN install Refusing to install smart-app-banner as a dependency of itself

Does it actually works with windows phones?

I can see test example with windows phone support, but still don't understand clear picture

If I want to only target android and use the native support in Safari for the apple-itunes-app meta tag Is this possible?

I only put in the android options but when viewing on an iPad I still get the banner with 'undefined' strings displaying.

Could you please explain how you generate the smart-app-banner.js file?

The build command uses ccjs and fails because this tool is not installed as a dev dependency.

browserify index.js -s SmartBanner | ccjs - > smart-app-banner.js

When I click the close button, I see the smartbanner-closed cookie is only a session cookie, not for the default 15 days, even if I explicitly stated it.

Thanks.

In the safari is being shown 2 blocks, the native smart banner and the smart banner of the script.
How to solve this problem?

How can we use it with typescript/ angular2?

Is there a way to specify a certain icon to be used in the banner? I would like to have separate Apple touch icons and app icons.

Hi,
It's maybe a strange question and probably out of scope.
I am using this smart-app-banner also for iOS Safari, because I want the flexibility to style and measure it.

Do you know how to prevent the iOS Safari "Cannot Open Page" popup if the app isn't installed?
I already did a research on it, like: http://stackoverflow.com/questions/19701708/how-to-prevent-ios-safari-alert-when-trying-to-open-non-installed-native-app

But it didn't worked out for me :(

You moved your css files, which is a very, very big breaking change. You need to bump to 2.0.0 if you're going to move public files people have to reference. Your docs even say to reference the css file like so:

<link rel="stylesheet" href="node_modules/smart-app-banner/smart-app-banner.css" type="text/css" media="screen">

So everybody's been referencing it there, not in dist, so this is a breaking change, not a "patch".

Integrated the code into the header.php of my localhost Wordpress site (meta and file links in tag, script code right inside tag). Tested on my iPhone7's Safari browser and banner shows up, but it does not show on Android's Chrome browser. How do I get it to show up on the Android phone?

Yeah, I know, who uses chrome on iOS anyway?
My client does, boo :(

I get a double banner on IOS safari, the native one and the smart banner one. This should be a bug.

Ps. Does it really make sense to have this as NPM package?
What about if ones need just the source unminified?

How to detect the specific app is installed or not on the device. If the app is installed it will open the app and if not it redirect the app download link

There is a statement in minified version, which make it to dissapear in chrome ios:

null===a.match(/iPad|iPhone|iPod/i)&&(null!==a.match(/iPad|iPhone|iPod/i) // always false 

It was transformed from strange if in source

else if (userAgent.match(/iPad|iPhone|iPod/i) !== null) { } else if (userAgent.match(/iPad|iPhone|iPod/i) !== null) {

We need to update the bower.json to the same version as package.json (1.1.3) and create a release into github otherwise we are unable to select the version with bower.

How to display this banner only on android mobile device?

Is there a non obfuscated version of the code. I only found this:

https://github.com/kudago/smart-app-banner/blob/master/smart-app-banner.js

The banner is not large enough on smart phones, defeating its purpose

Hello, how to use it with Angular 1.x, i tried, but without success, i can't initialize it. Can someone help with that?

Currently the "separator" between the "store" option and the "price" option is a hardcoded - (hyphen). I think it should be removed entirely so that the user can add their own in the options or change it to an — (em dash).

For example, if you removed it, you could show that the default settings are:

...
store: {
    ios: '— On the App Store',
    android: '— In Google Play'
},
price: {
    ios: 'GET',
    android: 'FREE'
},
...

Thus allowing the user to decide what kind of dash looks best. Thanks for the great plugin!

Would love to add smart-app-banner to rails-assets. It is requesting that a version number be present for it to use. I believe this is done through making a tag with the version number. Thanks for your work on this!

I think this module should include a minified version of js and css files. It's a great help for if we use this script in production environment.

I have a responsive website that shows a menu icon in the top left of the screen. When I tested this on my android phone with Google Chrome, the banner shows as expected and above main content but users can't dismiss the banner because of the menu icon. Any ideas?

It seems like windows phone 8.1 Update (and spartan) has android in its user agent.
https://msdn.microsoft.com/en-us/library/hh869301(v=vs.85).aspx

// Project Spartan for Windows Phone 
Mozilla/5.0 (Windows Phone 10.0; Android 4.2.1; DEVICE INFO) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Mobile Safari/537.36 Edge/12.0

// Internet Explorer for Windows Phone 8.1 Update 
Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 520) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537

Did I mistake something?

Hi,
I'm trying to implement this on my site.
When I use force: 'ios', I see the banner like I should, but otherwise no banner is appearing :S

I also get no errors

Is this a known issue, or did I do something wrong?

Thanks!