adaptive-evil-blocks-rails 0.1.2 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +45 -8
- data/lib/adaptive-evil-blocks.coffee +6 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 764b881c4fae57e99ea97b7fb73c15a2ea41ae8c
|
|
4
|
+
data.tar.gz: c6f5e1a8dd6c357abe406114238a4735980b7108
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 2cba94a31bd130a86718ce90dc86ab73ba4925d7befd21cb60f9dddb28cf75e6d22d53b60f77acdbb34b4909d2726ab3d69cd082f7086dd8d144694f999a54c6
|
|
7
|
+
data.tar.gz: 78465010b1e4339f9d37ccc77d084c9a02f5e205d1adb9deedc934cd15b3083a687f9ed68ca0f000fd3fe0e5d125a8df305bed9b6681ca3c6b569500e145ec77
|
data/README.md
CHANGED
|
@@ -10,10 +10,38 @@ The [matchMedia.js] polyfill is used for old browsers.
|
|
|
10
10
|
The adaptivity is provided by the `@media` method powered by underlying
|
|
11
11
|
matchMedia API. So you can use [media queries] syntax.
|
|
12
12
|
|
|
13
|
-
##
|
|
13
|
+
## Installation
|
|
14
|
+
|
|
15
|
+
### Ruby on Rails
|
|
16
|
+
|
|
17
|
+
Add the `adaptive-evil-blocks-rails` gem to `Gemfile`:
|
|
18
|
+
|
|
19
|
+
```ruby
|
|
20
|
+
gem "adaptive-evil-blocks-rails"
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
Add `adaptive-evil-blocks` to your scripts:
|
|
14
24
|
|
|
15
|
-
|
|
25
|
+
```js
|
|
26
|
+
//= require adaptive-evil-blocks
|
|
16
27
|
```
|
|
28
|
+
|
|
29
|
+
### Others
|
|
30
|
+
Add the `pkg/adaptive-evil-blocks.js` file to your project or install
|
|
31
|
+
the bower package:
|
|
32
|
+
|
|
33
|
+
```
|
|
34
|
+
bower install adaptive-evil-blocks
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
If you support old browsers, you may want to use the
|
|
38
|
+
`pkg/adaptive-evil-blocks.polyfilled.js` file.
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
## Usage
|
|
42
|
+
|
|
43
|
+
Run code once only if it matches a media query:
|
|
44
|
+
```coffee
|
|
17
45
|
evil.block '@@block',
|
|
18
46
|
|
|
19
47
|
init: -> ...
|
|
@@ -24,13 +52,22 @@ evil.block '@@block',
|
|
|
24
52
|
|
|
25
53
|
The `match` callback is executed every time on query match, the `mismatch`
|
|
26
54
|
callback is executed every time on query mismatch.
|
|
27
|
-
|
|
55
|
+
|
|
56
|
+
```coffee
|
|
28
57
|
evil.block '@@block',
|
|
29
58
|
|
|
30
59
|
init: -> ...
|
|
31
|
-
@media '(max-width: 399px), match: -> ...
|
|
32
|
-
@media '(min-width: 400px), match: -> ...
|
|
60
|
+
@media '(max-width: 399px)', match: -> ...
|
|
61
|
+
@media '(min-width: 400px)', match: -> ...
|
|
33
62
|
|
|
34
|
-
@media '(max-width: 399px), match: -> ... , mismatch: -> ...
|
|
35
|
-
@media '(min-width: 400px), match: -> ... , mismatch: -> ...
|
|
36
|
-
```
|
|
63
|
+
@media '(max-width: 399px)', match: -> ... , mismatch: -> ...
|
|
64
|
+
@media '(min-width: 400px)', match: -> ... , mismatch: -> ...
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
Also you can omit brackets for properties like `max-width` and `min-width`:
|
|
68
|
+
|
|
69
|
+
```coffee
|
|
70
|
+
evil.block '@@block',
|
|
71
|
+
init: -> ...
|
|
72
|
+
@media 'max-width: 399px', -> ...
|
|
73
|
+
```
|
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
evil = window.evil
|
|
2
2
|
|
|
3
3
|
|
|
4
|
+
addBrackets = (query) ->
|
|
5
|
+
re = /^([-\w]+:)\s*\d\w+$/im
|
|
6
|
+
query.replace re, (match) -> "(#{match})"
|
|
7
|
+
|
|
8
|
+
|
|
4
9
|
media = (query, callback) ->
|
|
5
|
-
mql = window.matchMedia(query)
|
|
10
|
+
mql = window.matchMedia addBrackets(query)
|
|
6
11
|
|
|
7
12
|
if typeof(callback) is 'function' and mql.matches
|
|
8
13
|
callback()
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: adaptive-evil-blocks-rails
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1.
|
|
4
|
+
version: 0.1.3
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Alexander Madyankin
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2014-05-
|
|
11
|
+
date: 2014-05-12 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: sprockets
|