https://github.com/astronomersiva/ember-display-in-browser

An Ember addon to display browser specific content.
https://github.com/astronomersiva/ember-display-in-browser

ember-addon emberjs

Last synced: 3 days ago
JSON representation

An Ember addon to display browser specific content.

• Host: GitHub
• URL: https://github.com/astronomersiva/ember-display-in-browser
• Owner: astronomersiva
• License: mit
• Created: 2018-05-29T05:43:53.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-01-08T17:33:10.000Z (over 5 years ago)
• Last Synced: 2024-09-26T11:40:47.374Z (7 days ago)
• Topics: ember-addon, emberjs
• Language: JavaScript
• Homepage: https://astronomersiva.github.io/ember-display-in-browser/
• Size: 315 KB
• Stars: 2
• Watchers: 3
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# ember-display-in-browser [![Build Status](https://travis-ci.org/astronomersiva/ember-display-in-browser.svg?branch=master)](https://travis-ci.org/astronomersiva/ember-display-in-browser)

Display browser specific content.

You can see a demo [here](https://astronomersiva.github.io/ember-display-in-browser/).

### Why? 🤔

Say you are developing an application that makes use of features that are not available

in IE. You can make use of this addon to display a message asking the user to use a browser

other than IE.

### This is a bad idea! 😠

This addon has some valid use cases(like I explained in the `why` section). However, you should

prefer to **make use of feature checks** instead of relying on the User Agent.

Even though this addon lets you specify several browsers alone, please do not develop an app that supports

Chrome(or Safari) alone. **Compatibility matters**.

### Installation 🔧

`ember install ember-display-in-browser`

### Usage 💻

* To display only in one or a set of browsers,

```handlebars

  {{!-- arrayOfBrowsers = ["Chrome", "firefox"] --}}

  {{#display-in-browser only=arrayOfBrowsers}}

    
This will be visible only in Chrome and Firefox

  {{/display-in-browser}}

```


```handlebars

  {{#display-in-browser only="ie"}}

    
This will be visible only in Internet Explorer

  {{/display-in-browser}}

```


* To display in browsers other than one or more browsers,

```handlebars

  {{!-- arrayOfBrowsers = ["Chrome", "firefox"] --}}

  {{#display-in-browser except=arrayOfBrowsers}}

    
This will not be visible in Chrome and Firefox

  {{/display-in-browser}}

```


```handlebars

  {{!-- arrayOfBrowsers = ["ie", "mobile"] --}}

  {{#display-in-browser except=arrayOfBrowsers}}

    
This will not be visible in IE and Mobile browsers

  {{/display-in-browser}}


  {{#display-in-browser except="ie"}}

    
This will not be visible in IE.

  {{/display-in-browser}}

```


* To display in all browsers,

```handlebars

  {{#display-in-browser all=all}}

    
This will be visible in all browsers

  {{/display-in-browser}}


  {{!-- You can also pass as a string, if needed --}}

  {{#display-in-browser all="true"}}

    
This will be visible in all browsers

  {{/display-in-browser}}

```


* To display in no browser,

```handlebars

  {{#display-in-browser none="true"}}

    
This will not be visible in any browser

  {{/display-in-browser}}

```


Supported browsers - `'chrome', 'firefox', 'safari', 'opera', 'ie', 'edge', 'blink', 'mobile'`(case-insensitive).

Inspired by [react-render-in-browser](https://github.com/flexdinesh/react-render-in-browser).

### License

MIT @[Sivasubramanyam A](https://sivasubramanyam.me)