opal-virtual-dom 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/Gemfile +2 -0
- data/README.md +60 -0
- data/Rakefile +3 -0
- data/lib/opal-virtual-dom.rb +3 -0
- data/opal-virtual-dom.gemspec +17 -0
- data/opal/virtual_dom.rb +23 -0
- data/opal/virtual_dom/node_factory.rb +38 -0
- data/opal/virtual_dom/virtual_node.rb +25 -0
- data/opal/virtual_dom/virtual_text_node.rb +15 -0
- metadata +79 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: c56e43b7c45be94787d99ca10c30bf46db403f9e
|
4
|
+
data.tar.gz: 55e255e70937cbc43f0fedc862a8435ae5d7533f
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 99336d26f7a317f6a95f5a48f75b2ac833e1a9050489af078d30fffc3aca32b8749f98545e3ed24409e01b86d46f623c18a2de42c30ab2d7882f5f1348d72103
|
7
|
+
data.tar.gz: 4e8bf55b6534d825fd266355d9ce87b705a232cf8a41d1d1ea952abca0941c915beeeb3652cd723ac78036097115fe2f6cf835b09e31c42125fe4c7c0ef253ed
|
data/Gemfile
ADDED
data/README.md
ADDED
@@ -0,0 +1,60 @@
|
|
1
|
+
# virtual-dom support for Opal
|
2
|
+
[![Gem Version](https://badge.fury.io/rb/opal-virtual-dom.svg)](http://badge.fury.io/rb/opal-virtual-dom)
|
3
|
+
[![Code Climate](https://codeclimate.com/github/fazibear/opal-virtual-dom/badges/gpa.svg)](https://codeclimate.com/github/fazibear/opal-virtual-dom)
|
4
|
+
|
5
|
+
## requiments
|
6
|
+
|
7
|
+
This wrapper require to load [virtual-dom](https://github.com/Matt-Esch/virtual-dom) first. For example you can use rails assets.
|
8
|
+
|
9
|
+
```ruby
|
10
|
+
source 'https://rails-assets.org' do
|
11
|
+
gem 'rails-assets-virtual-dom'
|
12
|
+
end
|
13
|
+
```
|
14
|
+
|
15
|
+
## usage
|
16
|
+
|
17
|
+
Server side (config.ru, Rakefile, Rails, Sinatra, etc.)
|
18
|
+
|
19
|
+
```ruby
|
20
|
+
require 'opal-virtual-dom'
|
21
|
+
```
|
22
|
+
|
23
|
+
Browser side
|
24
|
+
|
25
|
+
```ruby
|
26
|
+
require 'opal'
|
27
|
+
require 'virtual-dom' # javascript library
|
28
|
+
require 'browser' # not required
|
29
|
+
require 'virtual_dom' # opal wrapper
|
30
|
+
|
31
|
+
class SampleList
|
32
|
+
include VirtualDOM
|
33
|
+
|
34
|
+
def initialize(elements = [])
|
35
|
+
@elements = elements
|
36
|
+
end
|
37
|
+
|
38
|
+
def render
|
39
|
+
elements = @elements
|
40
|
+
virtual_dom do
|
41
|
+
ul class: 'simple-list' do
|
42
|
+
elements.each do |string|
|
43
|
+
li string
|
44
|
+
end
|
45
|
+
end
|
46
|
+
end
|
47
|
+
end
|
48
|
+
end
|
49
|
+
|
50
|
+
$document.ready do
|
51
|
+
list = SampleList.new(%w(one two three)).render.first
|
52
|
+
back = SampleList.new(%w(three two one)).render.first
|
53
|
+
|
54
|
+
root_node = VirtualDOM.create(list)
|
55
|
+
$document.body.inner_dom = root_node
|
56
|
+
|
57
|
+
diff = VirtualDOM.diff(list, back)
|
58
|
+
VirtualDOM.patch(root_node, diff)
|
59
|
+
end
|
60
|
+
```
|
data/Rakefile
ADDED
@@ -0,0 +1,17 @@
|
|
1
|
+
Gem::Specification.new do |s|
|
2
|
+
s.name = 'opal-virtual-dom'
|
3
|
+
s.version = '0.0.1'
|
4
|
+
s.authors = [ 'Michał Kalbarczyk' ]
|
5
|
+
s.email = 'fazibear@gmail.com'
|
6
|
+
s.homepage = 'http://github.com/fazibear/opal-virtual-dom'
|
7
|
+
s.summary = 'virtual-dom wrapper for opal'
|
8
|
+
s.description = 'virtual-dom wrapper for opal'
|
9
|
+
|
10
|
+
s.files = `git ls-files`.split("\n")
|
11
|
+
s.executables = `git ls-files -- bin/*`.split("\n").map { |f| File.basename(f) }
|
12
|
+
s.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
|
13
|
+
s.require_paths = ['lib']
|
14
|
+
|
15
|
+
s.add_dependency 'opal'
|
16
|
+
s.add_development_dependency 'rake'
|
17
|
+
end
|
data/opal/virtual_dom.rb
ADDED
@@ -0,0 +1,23 @@
|
|
1
|
+
require 'virtual_dom/virtual_node'
|
2
|
+
require 'virtual_dom/virtual_text_node'
|
3
|
+
require 'virtual_dom/node_factory'
|
4
|
+
|
5
|
+
module VirtualDOM
|
6
|
+
def virtual_dom(&block)
|
7
|
+
NodeFactory.new(block).nodes
|
8
|
+
end
|
9
|
+
|
10
|
+
module_function
|
11
|
+
|
12
|
+
def create(vnode)
|
13
|
+
`virtualDom.create(#{vnode})`
|
14
|
+
end
|
15
|
+
|
16
|
+
def diff(old, new)
|
17
|
+
`virtualDom.diff(#{old}, #{new})`
|
18
|
+
end
|
19
|
+
|
20
|
+
def patch(dom, diff)
|
21
|
+
`virtualDom.patch(#{dom}, #{diff})`
|
22
|
+
end
|
23
|
+
end
|
@@ -0,0 +1,38 @@
|
|
1
|
+
class VirtualDOM
|
2
|
+
class NodeFactory
|
3
|
+
attr_reader :nodes
|
4
|
+
|
5
|
+
def initialize(dom)
|
6
|
+
@nodes = []
|
7
|
+
@eval = instance_eval(&dom)
|
8
|
+
end
|
9
|
+
|
10
|
+
def method_missing(name, *args, &block)
|
11
|
+
@nodes << if name == 'text'
|
12
|
+
VirtualTextNode.new(args.first).vnode
|
13
|
+
else
|
14
|
+
VirtualNode.new(name, params(args), childrens(args, block)).vnode
|
15
|
+
end
|
16
|
+
end
|
17
|
+
|
18
|
+
def params(args)
|
19
|
+
if args.first.is_a?(Hash)
|
20
|
+
args = args.first
|
21
|
+
args['className'] = args.delete('class') if args.keys.include?('class')
|
22
|
+
args
|
23
|
+
else
|
24
|
+
{}
|
25
|
+
end
|
26
|
+
end
|
27
|
+
|
28
|
+
def childrens(args, block)
|
29
|
+
if block
|
30
|
+
NodeFactory.new(block).nodes
|
31
|
+
elsif args.last.is_a?(String)
|
32
|
+
[VirtualTextNode.new(args.last).vnode]
|
33
|
+
else
|
34
|
+
[]
|
35
|
+
end
|
36
|
+
end
|
37
|
+
end
|
38
|
+
end
|
@@ -0,0 +1,25 @@
|
|
1
|
+
module VirtualDOM
|
2
|
+
class VirtualNode
|
3
|
+
def initialize(name, params = {}, childrens = [])
|
4
|
+
@name = name
|
5
|
+
@params = params
|
6
|
+
@childrens = childrens
|
7
|
+
end
|
8
|
+
|
9
|
+
def vnode
|
10
|
+
`virtualDom.h(#{@name}, #{@params.to_n}, #{@childrens})`
|
11
|
+
end
|
12
|
+
|
13
|
+
def to_s
|
14
|
+
"<#{@name}#{to_s_params}>#{@childrens.map(&:to_s).join}</#{@name}>"
|
15
|
+
end
|
16
|
+
|
17
|
+
def to_s_params
|
18
|
+
if @params.any?
|
19
|
+
" " + @params.map do |k,v|
|
20
|
+
"#{k}=\"#{v}\""
|
21
|
+
end.join(' ')
|
22
|
+
end
|
23
|
+
end
|
24
|
+
end
|
25
|
+
end
|
metadata
ADDED
@@ -0,0 +1,79 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: opal-virtual-dom
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.0.1
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Michał Kalbarczyk
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2015-07-24 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: opal
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - ">="
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: '0'
|
20
|
+
type: :runtime
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - ">="
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: '0'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: rake
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - ">="
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '0'
|
34
|
+
type: :development
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - ">="
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: '0'
|
41
|
+
description: virtual-dom wrapper for opal
|
42
|
+
email: fazibear@gmail.com
|
43
|
+
executables: []
|
44
|
+
extensions: []
|
45
|
+
extra_rdoc_files: []
|
46
|
+
files:
|
47
|
+
- Gemfile
|
48
|
+
- README.md
|
49
|
+
- Rakefile
|
50
|
+
- lib/opal-virtual-dom.rb
|
51
|
+
- opal-virtual-dom.gemspec
|
52
|
+
- opal/virtual_dom.rb
|
53
|
+
- opal/virtual_dom/node_factory.rb
|
54
|
+
- opal/virtual_dom/virtual_node.rb
|
55
|
+
- opal/virtual_dom/virtual_text_node.rb
|
56
|
+
homepage: http://github.com/fazibear/opal-virtual-dom
|
57
|
+
licenses: []
|
58
|
+
metadata: {}
|
59
|
+
post_install_message:
|
60
|
+
rdoc_options: []
|
61
|
+
require_paths:
|
62
|
+
- lib
|
63
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
64
|
+
requirements:
|
65
|
+
- - ">="
|
66
|
+
- !ruby/object:Gem::Version
|
67
|
+
version: '0'
|
68
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
69
|
+
requirements:
|
70
|
+
- - ">="
|
71
|
+
- !ruby/object:Gem::Version
|
72
|
+
version: '0'
|
73
|
+
requirements: []
|
74
|
+
rubyforge_project:
|
75
|
+
rubygems_version: 2.4.5
|
76
|
+
signing_key:
|
77
|
+
specification_version: 4
|
78
|
+
summary: virtual-dom wrapper for opal
|
79
|
+
test_files: []
|