|
|
@ -65,6 +65,15 @@ Ply.dialog({ |
|
|
|
|
|
|
|
|
|
|
|
## Low-level |
|
|
|
## Low-level |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
##### new Ply(el[, options]) |
|
|
|
|
|
|
|
* el:`String|HTMLElement` — content of layer |
|
|
|
|
|
|
|
* options:`Object` — layer options |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
##### new Ply(options) |
|
|
|
|
|
|
|
* options:`Object` — layer options |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```js |
|
|
|
```js |
|
|
|
var ply = new Ply({ |
|
|
|
var ply = new Ply({ |
|
|
|
el: "...", // HTML-content |
|
|
|
el: "...", // HTML-content |
|
|
@ -102,14 +111,14 @@ ply.open().then(function () { |
|
|
|
}); |
|
|
|
}); |
|
|
|
``` |
|
|
|
``` |
|
|
|
|
|
|
|
|
|
|
|
##### open([effect])`:Promise` |
|
|
|
##### open([effect]):`Promise` |
|
|
|
|
|
|
|
|
|
|
|
##### close(effect)`:Promise` |
|
|
|
##### close(effect):`Promise` |
|
|
|
|
|
|
|
|
|
|
|
##### swap(layer[, effect])`:Promise` |
|
|
|
##### swap(layer[, effect]):`Promise` |
|
|
|
Swapping one layer to another |
|
|
|
Swapping one layer to another |
|
|
|
|
|
|
|
|
|
|
|
##### innerSwap(layer[, effect])`:Promise` |
|
|
|
##### innerSwap(layer[, effect]):`Promise` |
|
|
|
Swapping the content of one layer to another |
|
|
|
Swapping the content of one layer to another |
|
|
|
|
|
|
|
|
|
|
|
##### destroy() |
|
|
|
##### destroy() |
|
|
@ -156,27 +165,27 @@ Ply.effects["background-out"] = { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Ply.stack |
|
|
|
## Ply.stack |
|
|
|
* last`:Ply|null` |
|
|
|
* last:`Ply|null` |
|
|
|
* length`:Number` |
|
|
|
* length:`Number` |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
--- |
|
|
|
--- |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Ply.support |
|
|
|
## Ply.support |
|
|
|
* transition`:String|Boolean` |
|
|
|
* transition:`String|Boolean` |
|
|
|
* transform`:String|Boolean` |
|
|
|
* transform:`String|Boolean` |
|
|
|
* perspective`:String|Boolean` |
|
|
|
* perspective:`String|Boolean` |
|
|
|
* transformStyle`:String|Boolean` |
|
|
|
* transformStyle:`String|Boolean` |
|
|
|
* transformOrigin`:String|Boolean` |
|
|
|
* transformOrigin:`String|Boolean` |
|
|
|
* backfaceVisibility`:String|Boolean` |
|
|
|
* backfaceVisibility:`String|Boolean` |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
--- |
|
|
|
--- |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Ply.lang (localization) |
|
|
|
## Ply.lang (localization) |
|
|
|
* ok`:String` — "OK" |
|
|
|
* ok:`String` — "OK" |
|
|
|
* cancel:`String` — "Cancel" |
|
|
|
* cancel:`String` — "Cancel" |
|
|
|
* cross:`String` — "✖" |
|
|
|
* cross:`String` — "✖" |
|
|
|
|
|
|
|
|
|
|
@ -185,14 +194,14 @@ Ply.effects["background-out"] = { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Ply.defaults |
|
|
|
## Ply.defaults |
|
|
|
* layer`:Object` — css |
|
|
|
* layer:`Object` — css |
|
|
|
* overlay`:Object` — style overlay |
|
|
|
* overlay:`Object` — style overlay |
|
|
|
* opacity:Number — default `0.6` |
|
|
|
* opacity:Number — default `0.6` |
|
|
|
* backgroundColor:String — default `rgb(0, 0, 0)'` |
|
|
|
* backgroundColor:String — default `rgb(0, 0, 0)'` |
|
|
|
* flags`:Object` |
|
|
|
* flags:`Object` |
|
|
|
* bodyScroll:Boolean — disable scrollbars, default `false` |
|
|
|
* bodyScroll:Boolean — disable scrollbars, default `false` |
|
|
|
* closeByEsc`:Boolean` — closing the layer by pressing the `esc` key, default `true` |
|
|
|
* closeByEsc:`Boolean` — closing the layer by pressing the `esc` key, default `true` |
|
|
|
* closeByOverlay`:Boolean` — closing the layer by clicking on the overlay, default `true` |
|
|
|
* closeByOverlay:`Boolean` — closing the layer by clicking on the overlay, default `true` |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
--- |
|
|
|
--- |
|
|
@ -200,7 +209,7 @@ Ply.effects["background-out"] = { |
|
|
|
|
|
|
|
|
|
|
|
## Ply.dom |
|
|
|
## Ply.dom |
|
|
|
|
|
|
|
|
|
|
|
##### build(tag`:String|Object`)`:HTMLElement` |
|
|
|
##### build(tag:`String|Object`):`HTMLElement` |
|
|
|
```js |
|
|
|
```js |
|
|
|
Ply.build(); // <div/> |
|
|
|
Ply.build(); // <div/> |
|
|
|
Ply.build("input"); // <input/> |
|
|
|
Ply.build("input"); // <input/> |
|
|
@ -216,13 +225,13 @@ Ply.build({ text: "<i>?</i>" }); // <div><i>?</i></div> |
|
|
|
Ply.build({ html: "<i>!</i>" }); // <div><i>!</i></div> |
|
|
|
Ply.build({ html: "<i>!</i>" }); // <div><i>!</i></div> |
|
|
|
``` |
|
|
|
``` |
|
|
|
|
|
|
|
|
|
|
|
##### append(parent`:HTMLElement`, el`:HTMLElement`) |
|
|
|
##### append(parent:`HTMLElement`, el:`HTMLElement`) |
|
|
|
|
|
|
|
|
|
|
|
##### remove(el`:HTMLElement`) |
|
|
|
##### remove(el:`HTMLElement`) |
|
|
|
|
|
|
|
|
|
|
|
##### addEvent(el`:HTMLElement`, name`:String`, fn`:Function`) |
|
|
|
##### addEvent(el:`HTMLElement`, name:`String`, fn:`Function`) |
|
|
|
|
|
|
|
|
|
|
|
##### removeEvent(el`:HTMLElement`, name`:String`, fn`:Function`) |
|
|
|
##### removeEvent(el:`HTMLElement`, name:`String`, fn:`Function`) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -232,8 +241,8 @@ Ply.build({ html: "<i>!</i>" }); // <div><i>!</i></div> |
|
|
|
## Create a dialog template |
|
|
|
## Create a dialog template |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
##### Ply.ui(name)`:HTMLElement` |
|
|
|
##### Ply.ui(name):`HTMLElement` |
|
|
|
* name`:String` — ui-element name |
|
|
|
* name:`String` — ui-element name |
|
|
|
|
|
|
|
|
|
|
|
```js |
|
|
|
```js |
|
|
|
var el = Ply.ui("btn", { |
|
|
|
var el = Ply.ui("btn", { |
|
|
@ -244,13 +253,13 @@ var el = Ply.ui("btn", { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
##### Ply.ui.factory(name, factory) |
|
|
|
##### Ply.ui.factory(name, factory) |
|
|
|
* name`:String` — ui-element name |
|
|
|
* name:`String` — ui-element name |
|
|
|
* factory`:Function` — callback |
|
|
|
* factory:`Function` — callback |
|
|
|
|
|
|
|
|
|
|
|
```js |
|
|
|
```js |
|
|
|
Ply.ui.factory("btn", function (data, children) { |
|
|
|
Ply.ui.factory("btn", function (data, children) { |
|
|
|
// data`:Object` |
|
|
|
// data:`Object` |
|
|
|
// children`:HTMLElement` |
|
|
|
// children:`HTMLElement` |
|
|
|
|
|
|
|
|
|
|
|
return { |
|
|
|
return { |
|
|
|
"tag": ".btn", |
|
|
|
"tag": ".btn", |
|
|
@ -273,8 +282,8 @@ Ply.ui.factory("btn", function (data, children) { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
##### Ply.factory(name, factory) |
|
|
|
##### Ply.factory(name, factory) |
|
|
|
* name`:String` — template name |
|
|
|
* name:`String` — template name |
|
|
|
* factory`:Function` — callback |
|
|
|
* factory:`Function` — callback |
|
|
|
|
|
|
|
|
|
|
|
```js |
|
|
|
```js |
|
|
|
Ply.factory("subscribe", function (options, data, resolve) { |
|
|
|
Ply.factory("subscribe", function (options, data, resolve) { |
|
|
|