playground
/
Ply
mirror of https://github.com/RubaXa/Ply.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

+ Dialogs

modules
RubaXa 11 years ago
parent
c781e52ec8
commit
923a593d1f
2 changed files with 39 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 38
      README.md
  2. 2
      index.html

38
README.md
Unescape View File

@ -2,16 +2,18 @@
Amazing layer/modal/dialog system. Wow! Amazing layer/modal/dialog system. Wow!
## Features ## Features
* Support browsers Chrome 20+, FireFox 20+, Safari 6+, Opera 12+, IE8+ (in progress) * Support browsers Chrome 20+, FireFox 20+, Safari 6+, Opera 12+, IE8+ (in progress)
* [ES6 syntax](https://github.com/termi/es6-transpiler) * [ES6 syntax](https://github.com/termi/es6-transpiler)
* No jQuery (but then need polyfill [Promise](https://gist.github.com/RubaXa/8501359) polyfill) * No jQuery (but then need polyfill [Promise](https://gist.github.com/RubaXa/8501359) polyfill)
* More than 90% [test code coverage](http://rubaxa.github.io/Ply/tests/)
## Base usage ## Base usage
Include [ply.css] in `<head/>` Include [ply.css](ply.css) in `<head/>` (optional)
```html ```html
<link href='./ply.css' rel='stylesheet' type='text/css'/> <link href='./ply.css' rel='stylesheet' type='text/css'/>
``` ```
@ -25,6 +27,40 @@ Ply.dialog("alert", "Wow!").then(function (ui) {
``` ```
---
## Dialogs
```js
Ply.dialog({
"init-state": {
ui: "alert",
data: "Wow!",
next: "other-step"
nextEffect: "3d-flip[180,-180]"
},
"other-step": {
ui: "confirm",
data: {
text: "What's next?",
ok: "Exit", // button text
cancel: "Back"
},
back: "init-state",
backEffect: "3d-flip[-180,180]"
}
}).then(function (ui) {
// ...
})
```
---
## Low-level ## Low-level
```js ```js

2
index.html
Unescape View File

@ -15,6 +15,8 @@
</head> </head>
<body> <body>
<a href="https://github.com/RubaXa/Ply"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
<div style="height: 50px;"></div> <div style="height: 50px;"></div>
<h1 title="Try demo!"><u>Ply</u></h1> <h1 title="Try demo!"><u>Ply</u></h1>

Write Preview
Loading…
Cancel
Save