Skip to content

Commit

Permalink
Updated README for alpha release.
Browse files Browse the repository at this point in the history
  • Loading branch information
hperrin committed Jan 27, 2018
1 parent d6a5934 commit 77cacc3
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 36 deletions.
47 changes: 13 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,9 @@ PNotify is a JavaScript notification plugin. PNotify can provide [desktop notifi

# Whoa there!

I guarantee **none of this README applies to you!** You want to check out the **[README on the master branch](https://github.com/sciactive/pnotify/blob/master/README.md)**.
Unless you're an alpha tester, **none of this README applies to you!** You want to check out the **[README on the master branch](https://github.com/sciactive/pnotify/blob/master/README.md)**.

This README is for **PNotify v4**. v4 isn't out yet, but it's got some huge changes.
This README is for **PNotify v4**. v4 is only in alpha stage, but it's got some huge changes:

* jQuery is no longer required. v4 doesn't require any libraries, actually.
* It's built using [Svelte](http://svelte.technology), which means it compiles down to vanilla JS.
Expand All @@ -20,25 +20,6 @@ This README is for **PNotify v4**. v4 isn't out yet, but it's got some huge chan
* `insert_brs` option has gone away. (Text and title now have `white-space: pre-line;`.)
* The default width was raised from 300px to 360px.

But v4 isn't even in the alpha stage yet.

Things that work:

* PNotify Core
* Bright Theme styling (CSS)
* Material styling (module)
* Buttons module
* Animate module
* Callbacks module
* NonBlock module
* Mobile module
* History module
* Desktop module
* Confirm module

Things that don't work:
* npm package...

# Getting Started

You can get PNotify using NPM. (You can also use [jsDelivr](https://www.jsdelivr.com/package/npm/pnotify).)
Expand All @@ -49,30 +30,28 @@ npm install pnotify

Inside the pnotify directory in node_modules, you'll find a `src`, `lib`, and `dist` directory.

* `src` contains the actual Svelte source code, and CSS files.
* `lib` contains all the JS files uncompressed.
* `src` contains the Svelte source code, and uncompressed CSS.
* `lib` contains all the compiled JS files uncompressed.
* `dist` contains both JS and CSS files compressed.
* `lib` and `dist` each have subdirectories for the available formats, UMD, IIFE, and ES6 modules.

So if you're not using Webpack or Rollup, here's how you'd include PNotify on your page:

```html
<!-- From an NPM install. -->
<script type="text/javascript" src="node_modules/pnotify/dist/iife/PNotify.js"></script>
<link href="node_modules/pnotify/dist/PNotify.BrightTheme.css" media="all" rel="stylesheet" type="text/css" />
<link href="node_modules/pnotify/dist/PNotifyBrightTheme.css" media="all" rel="stylesheet" type="text/css" />
```

There are also examples of how to use various libraries (like Browserify and RequireJS) in the libtests dir.

Now you can use PNotify like this:

```html
<script type="text/javascript">
function makeNotice() {
PNotify.notice({
title: "Regular Notice",
text: "Check me out! I'm a notice."
});
}
</script>
<button onclick="makeNotice()">Click me for Notice</button>
```js
PNotify.notice({
title: "Regular Notice",
text: "Check me out! I'm a notice."
});
```

## Using a UI Library
Expand Down
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -789,7 +789,7 @@ <h5 class="modal-title">'+button.text()+' - Source</h5>\
<section class="container page-banner">
<div class="intro-section">
<h1>PNotify</h1>
<h3>v4 <abbr title="but it's close">Pre-Alpha</abbr></h3>
<h3>v4 <abbr title="you can use it, if you're daring">Alpha</abbr></h3>
<p id="description">Beautiful JavaScript notifications. Now with <a href="index-nodependencies.html" target="_blank">zero dependencies</a>!</p>
</div>
<div class="intro-section">
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
"src",
"make.js"
],
"main": "dist/umd/index.js",
"main": "dist/iife/PNotify.js",
"directories": {
"lib": "lib/umd"
},
Expand Down

0 comments on commit 77cacc3

Please sign in to comment.