@live-change/dao-vue 0.1.11 → 0.4.0

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.
Files changed (2) hide show
  1. package/index.js +174 -162
  2. package/package.json +6 -7
package/index.js CHANGED
@@ -1,180 +1,192 @@
1
1
 
2
2
  let prefix = "$reactiveDaoPath_"
3
3
 
4
- const ReactiveDaoVue = {
5
- install(Vue, options) {
6
- if(!options || !options.dao) throw new Error("dao option required")
7
- const dao = options.dao
8
-
9
- Vue.mixin({
10
- beforeCreate() {
11
- if(!this.$options.reactive) return; // Avoid distributed fat
4
+ const reactiveMixin = dao => ({
5
+ beforeCreate() {
6
+ if(!this.$options.reactive) return; // Avoid distributed fat
12
7
 
13
- if (!this.$options.computed) this.$options.computed = {}
14
- for(let key in this.$options.reactive) {
15
- let path = this.$options.reactive[key]
16
- if(typeof path == 'function'){
17
- this.$options.computed[prefix + key] = path
18
- } else if(typeof path == 'string') {
19
- } else if(path.length !== undefined) {
20
- } else throw new Error("unknown reactive path "+path)
8
+ if (!this.$options.computed) this.$options.computed = {}
9
+ for(let key in this.$options.reactive) {
10
+ let path = this.$options.reactive[key]
11
+ if(typeof path == 'function'){
12
+ this.$options.computed[prefix + key] = path
13
+ } else if(typeof path == 'string') {
14
+ } else if(path.length !== undefined) {
15
+ } else throw new Error("unknown reactive path "+path)
16
+ }
17
+ const optionData = this.$options.data
18
+ this.$options.data = function vueReactiveDaoInjectedDataFn () {
19
+ const data = (
20
+ (typeof optionData === 'function')
21
+ ? optionData.call(this)
22
+ : optionData
23
+ ) || {}
24
+ for (let key in this.$options.reactive) {
25
+ data[key] = undefined
26
+ data[key+"Error"] = undefined
27
+ }
28
+ return data
29
+ }
30
+ },
31
+ created() {
32
+ if(!this.$options.reactive) return; // Avoid distributed fat
33
+ this.reactiveObservables = {}
34
+ let reactiveObservables = this.reactiveObservables
35
+ for(let key in this.$options.reactive) {
36
+ let path = this.$options.reactive[key]
37
+ if(typeof path == 'function'){
38
+ let p = this[prefix + key]
39
+ if(p) {
40
+ reactiveObservables[key] = dao.observable(p)
41
+ reactiveObservables[key].bindProperty(this, key)
42
+ reactiveObservables[key].bindErrorProperty(this, key+"Error")
21
43
  }
22
- const optionData = this.$options.data
23
- this.$options.data = function vueReactiveDaoInjectedDataFn () {
24
- const data = (
25
- (typeof optionData === 'function')
26
- ? optionData.call(this)
27
- : optionData
28
- ) || {}
29
- for (let key in this.$options.reactive) {
30
- data[key] = undefined
31
- data[key+"Error"] = undefined
44
+ let oldPathJson
45
+ this.$watch(prefix + key, newPath => {
46
+ const json = JSON.stringify(newPath)
47
+ const match = JSON.stringify(newPath) == oldPathJson
48
+ oldPathJson = json
49
+ if(match) return
50
+ if(reactiveObservables[key]) {
51
+ this[key] = undefined
52
+ this[key+"Error"] = undefined
53
+ reactiveObservables[key].unbindProperty(this, key)
54
+ reactiveObservables[key].unbindErrorProperty(this, key+"Error")
32
55
  }
33
- return data
34
- }
35
- },
36
- created() {
37
- if(!this.$options.reactive) return; // Avoid distributed fat
38
- this.reactiveObservables = {}
39
- let reactiveObservables = this.reactiveObservables
40
- for(let key in this.$options.reactive) {
41
- let path = this.$options.reactive[key]
42
- if(typeof path == 'function'){
43
- let p = this[prefix + key]
44
- if(p) {
45
- reactiveObservables[key] = dao.observable(p)
46
- reactiveObservables[key].bindProperty(this, key)
47
- reactiveObservables[key].bindErrorProperty(this, key+"Error")
48
- }
49
- this.$watch(prefix + key, newPath => {
50
- if(reactiveObservables[key]) {
51
- this[key] = undefined
52
- this[key+"Error"] = undefined
53
- reactiveObservables[key].unbindProperty(this, key)
54
- reactiveObservables[key].unbindErrorProperty(this, key+"Error")
55
- }
56
- delete reactiveObservables[key]
57
- if(newPath) {
58
- reactiveObservables[key] = dao.observable(newPath)
59
- reactiveObservables[key].bindProperty(this, key)
60
- reactiveObservables[key].bindErrorProperty(this, key+"Error")
61
- } else {
62
- this[key] = undefined
63
- }
64
- })
65
- } else if(typeof path == 'string') {
66
- reactiveObservables[key] = dao.observable(path)
56
+ delete reactiveObservables[key]
57
+ if(newPath) {
58
+ reactiveObservables[key] = dao.observable(newPath)
67
59
  reactiveObservables[key].bindProperty(this, key)
68
60
  reactiveObservables[key].bindErrorProperty(this, key+"Error")
69
- } else if(path.length !== undefined) {
70
- reactiveObservables[key] = dao.observable(path)
71
- reactiveObservables[key].bindProperty(this, key)
72
- reactiveObservables[key].bindErrorProperty(this, key+"Error")
73
- } else throw new Error("unknown reactive path "+path)
74
- }
75
- },
76
- beforeDestroy() {
77
- if(!this.$options.reactive) return; // Avoid distributed fat
78
- let reactiveObservables = this.reactiveObservables
79
- for(let key in reactiveObservables) {
80
- reactiveObservables[key].unbindProperty(this, key)
81
- reactiveObservables[key].unbindErrorProperty(this, key+"Error")
82
- }
83
- }
84
- })
85
-
86
- Vue.mixin({
87
- beforeCreate() {
88
- if(typeof window == 'undefined') return; // NO REACTIVE PREFETCH ON SERVER
89
- if(!this.$options.reactivePreFetch) return;
90
- if (!this.$options.computed) this.$options.computed = {}
91
- this.$options.computed[prefix+"_reactivePreFetch"] = function() {
92
- return this.$options.reactivePreFetch(this.$route)
93
- }
94
- const optionData = this.$options.data
95
- this.$options.data = function vueReactiveDaoInjectedDataFn () {
96
- const data = (
97
- (typeof optionData === 'function')
98
- ? optionData.call(this)
99
- : optionData
100
- ) || {}
101
- data.reactivePreFetchedPaths = []
102
- data.reactivePreFetchError = null
103
- return data
104
- }
105
- },
106
- created() {
107
- if(typeof window == 'undefined') return; // NO REACTIVE PREFETCH ON SERVER
108
- if(!this.$options.reactivePreFetch) return
109
- let paths = this[prefix+"_reactivePreFetch"]
110
- if(paths) {
111
- this.reactivePreFetchObservable = dao.observable({ paths })
112
- this.reactivePreFetchObservable.bindProperty(this, "reactivePreFetchedPaths")
113
- this.reactivePreFetchObservable.bindErrorProperty(this, "reactivePreFetchError")
114
- }
115
- this.$watch(prefix+"_reactivePreFetch", paths => {
116
- if(this.reactivePreFetchObservable) {
117
- this.reactivePreFetchObservable.unbindProperty(this, "reactivePreFetchedPaths")
118
- this.reactivePreFetchObservable.unbindErrorProperty(this, "reactivePreFetchError")
119
- }
120
- delete this.reactivePreFetchObservable
121
- if(paths) {
122
- this.reactivePreFetchObservable = dao.observable({ paths })
123
- this.reactivePreFetchObservable.bindProperty(this, "reactivePreFetchedPaths")
124
- this.reactivePreFetchObservable.bindErrorProperty(this, "reactivePreFetchError")
61
+ } else {
62
+ this[key] = undefined
125
63
  }
126
64
  })
127
- },
128
- beforeDestroy() {
129
- if(typeof window == 'undefined') return; // NO REACTIVE PREFETCH ON SERVER
130
- if(!this.$options.reactivePreFetch) return; // Avoid distributed fat
131
- if(this.reactivePreFetchObservable) {
132
- this.reactivePreFetchObservable.unbindProperty(this, "reactivePreFetchedPaths")
133
- this.reactivePreFetchObservable.unbindErrorProperty(this, "reactivePreFetchError")
134
- }
135
- }
136
- })
65
+ } else if(typeof path == 'string') {
66
+ reactiveObservables[key] = dao.observable(path)
67
+ reactiveObservables[key].bindProperty(this, key)
68
+ reactiveObservables[key].bindErrorProperty(this, key+"Error")
69
+ } else if(path.length !== undefined) {
70
+ reactiveObservables[key] = dao.observable(path)
71
+ reactiveObservables[key].bindProperty(this, key)
72
+ reactiveObservables[key].bindErrorProperty(this, key+"Error")
73
+ } else throw new Error("unknown reactive path "+path)
74
+ }
75
+ },
76
+ beforeDestroy() {
77
+ if(!this.$options.reactive) return; // Avoid distributed fat
78
+ let reactiveObservables = this.reactiveObservables
79
+ for(let key in reactiveObservables) {
80
+ reactiveObservables[key].unbindProperty(this, key)
81
+ reactiveObservables[key].unbindErrorProperty(this, key+"Error")
82
+ }
83
+ }
84
+ })
137
85
 
138
- Vue.component('reactive', {
139
- name: "Observe",
140
- props: {
141
- what: {
142
- type: Object
143
- }
144
- },
145
- data() {
146
- let values = {}, errors = {}
147
- for(const key in this.what) {
148
- values[key] = undefined
149
- values[key + 'Error'] = undefined
150
- }
151
- return {
152
- values
153
- }
154
- },
155
- created() {
156
- this.observables = {}
157
- for(const name in this.what) {
158
- const what = this.what[key]
159
- const observable = dao.observable(what)
160
- this.observables[name] = observable
161
- observable.bindProperty(this.values[name])
162
- observable.bindErrorProperty(this.values[name+'Error'])
163
- }
164
- },
165
- beforeDestroy() {
166
- for(const name in this.observables) {
167
- const observable = this.observables[name]
168
- observable.unbindProperty(this, "reactivePreFetchedPaths")
169
- observable.unbindErrorProperty(this, "reactivePreFetchError")
170
- }
171
- },
172
- render(createElement) {
173
- return this.$scopedSlots.default(this.values)[0]
86
+ const reactivePrefetchMixin = dao => ({
87
+ beforeCreate() {
88
+ if(typeof window == 'undefined') return; // NO REACTIVE PREFETCH ON SERVER
89
+ if(!this.$options.reactivePreFetch) return;
90
+ if (!this.$options.computed) this.$options.computed = {}
91
+ this.$options.computed[prefix+"_reactivePreFetch"] = function() {
92
+ return this.$options.reactivePreFetch(this.$route, this.$router)
93
+ }
94
+ const optionData = this.$options.data
95
+ this.$options.data = function vueReactiveDaoInjectedDataFn () {
96
+ const data = (
97
+ (typeof optionData === 'function')
98
+ ? optionData.call(this)
99
+ : optionData
100
+ ) || {}
101
+ data.reactivePreFetchedPaths = []
102
+ data.reactivePreFetchError = null
103
+ return data
104
+ }
105
+ },
106
+ created() {
107
+ if(typeof window == 'undefined') return; // NO REACTIVE PREFETCH ON SERVER
108
+ if(!this.$options.reactivePreFetch) return
109
+ let paths = this[prefix+"_reactivePreFetch"]
110
+ if(paths) {
111
+ this.reactivePreFetchObservable = dao.observable({ paths })
112
+ this.reactivePreFetchObservable.bindProperty(this, "reactivePreFetchedPaths")
113
+ this.reactivePreFetchObservable.bindErrorProperty(this, "reactivePreFetchError")
114
+ }
115
+ this.$watch(prefix+"_reactivePreFetch", paths => {
116
+ if(this.reactivePreFetchObservable) {
117
+ this.reactivePreFetchObservable.unbindProperty(this, "reactivePreFetchedPaths")
118
+ this.reactivePreFetchObservable.unbindErrorProperty(this, "reactivePreFetchError")
119
+ }
120
+ delete this.reactivePreFetchObservable
121
+ if(paths) {
122
+ this.reactivePreFetchObservable = dao.observable({ paths })
123
+ this.reactivePreFetchObservable.bindProperty(this, "reactivePreFetchedPaths")
124
+ this.reactivePreFetchObservable.bindErrorProperty(this, "reactivePreFetchError")
174
125
  }
175
126
  })
127
+ },
128
+ beforeDestroy() {
129
+ if(typeof window == 'undefined') return; // NO REACTIVE PREFETCH ON SERVER
130
+ if(!this.$options.reactivePreFetch) return; // Avoid distributed fat
131
+ if(this.reactivePreFetchObservable) {
132
+ this.reactivePreFetchObservable.unbindProperty(this, "reactivePreFetchedPaths")
133
+ this.reactivePreFetchObservable.unbindErrorProperty(this, "reactivePreFetchError")
134
+ }
135
+ }
136
+ })
137
+
138
+ const reactiveComponent = dao => ({
139
+ name: "Reactive",
140
+ props: {
141
+ what: {
142
+ type: Object
143
+ }
144
+ },
145
+ data() {
146
+ let values = {}, errors = {}
147
+ for(const key in this.what) {
148
+ values[key] = undefined
149
+ values[key + 'Error'] = undefined
150
+ }
151
+ return {
152
+ values
153
+ }
154
+ },
155
+ created() {
156
+ this.observables = {}
157
+ for(const name in this.what) {
158
+ const what = this.what[key]
159
+ const observable = dao.observable(what)
160
+ this.observables[name] = observable
161
+ observable.bindProperty(this.values[name])
162
+ observable.bindErrorProperty(this.values[name+'Error'])
163
+ }
164
+ },
165
+ beforeDestroy() {
166
+ for(const name in this.observables) {
167
+ const observable = this.observables[name]
168
+ observable.unbindProperty(this, "reactivePreFetchedPaths")
169
+ observable.unbindErrorProperty(this, "reactivePreFetchError")
170
+ }
171
+ },
172
+ render(createElement) {
173
+ return this.$scopedSlots.default(this.values)[0]
174
+ }
175
+ })
176
+
177
+ const ReactiveDaoVue = {
178
+ install(Vue, options) {
179
+ if(!options || !options.dao) throw new Error("dao option required")
180
+ const dao = options.dao
181
+
182
+ Vue.mixin(reactiveMixin(dao))
183
+
184
+ Vue.mixin(reactivePrefetchMixin(dao))
185
+
186
+ Vue.component('reactive', reactiveComponent(dao))
176
187
  }
177
188
  }
178
189
 
190
+ export { ReactiveDaoVue, reactiveMixin, reactivePrefetchMixin, reactiveComponent }
179
191
 
180
192
  export default ReactiveDaoVue
package/package.json CHANGED
@@ -1,21 +1,20 @@
1
1
  {
2
2
  "name": "@live-change/dao-vue",
3
- "version": "0.1.11",
3
+ "version": "0.4.0",
4
4
  "author": {
5
5
  "email": "m8@em8.pl",
6
6
  "name": "Michał Łaszczewski",
7
7
  "url": "http://www.viamage.com/"
8
8
  },
9
9
  "bugs": {
10
- "url": "https://github.com/live-change/vue/issues"
10
+ "url": "https://github.com/live-change/live-change-dao/issues"
11
11
  },
12
12
  "dependencies": {
13
- "@live-change/dao": "^0.2.34"
13
+ "@live-change/dao": "^0.4.0"
14
14
  },
15
- "devDependencies": {},
16
15
  "description": "Vue.js integration for live-change dao",
17
16
  "directories": {},
18
- "homepage": "https://github.com/live-change/dao-vue",
17
+ "homepage": "https://github.com/live-change/live-change-dao",
19
18
  "license": "MIT",
20
19
  "main": "index.js",
21
20
  "module": "index.js",
@@ -25,7 +24,6 @@
25
24
  "name": "Michał Łaszczewski"
26
25
  }
27
26
  ],
28
- "optionalDependencies": {},
29
27
  "readme": "README.md",
30
28
  "repository": {
31
29
  "type": "git",
@@ -33,5 +31,6 @@
33
31
  },
34
32
  "scripts": {
35
33
  "compileTests": "webpack test/*.js tests-bundle.js"
36
- }
34
+ },
35
+ "gitHead": "106431c736de8c92ba07cbba1bb85aac4925a93f"
37
36
  }