You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by ha...@apache.org on 2017/12/28 05:27:04 UTC
[07/20] incubator-weex git commit: [WEEX-181] rm web renderer codes
and scripts (resolve #958)
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/loading.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/loading.js b/html5/render/vue/components/scrollable/loading.js
deleted file mode 100644
index cd37151..0000000
--- a/html5/render/vue/components/scrollable/loading.js
+++ /dev/null
@@ -1,107 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-function getLoading () {
- const { extractComponentStyle } = weex
-
- return {
- name: 'weex-loading',
- props: {
- display: {
- type: String,
- default: 'show',
- validator (value) {
- return ['show', 'hide'].indexOf(value) !== -1
- }
- }
- },
- data () {
- return {
- height: -1,
- viewHeight: 0
- }
- },
- mounted () {
- this.viewHeight = this.$el.offsetHeight
- if (this.display === 'hide') {
- this.height = 0
- }
- else {
- this.height = this.viewHeight
- }
- },
- watch: {
- height (val) {
- this.$el.style.height = `${val}px`
- },
- display (val) {
- if (val === 'hide') {
- this.height = 0
- }
- else {
- this.height = this.viewHeight
- }
- }
- },
- methods: {
- pulling (offsetY = 0) {
- this.height = offsetY
- },
- pullingUp (offsetY) {
- this.$el.style.transition = `height 0s`
- this.pulling(offsetY)
- },
- pullingEnd () {
- this.$el.style.transition = `height .2s`
- if (this.height >= this.viewHeight) {
- this.pulling(this.viewHeight)
- this.$emit('loading')
- }
- else {
- this.pulling(0)
- }
- },
- getChildren () {
- const children = this.$slots.default || []
- if (this.display === 'show') {
- return children
- }
- return children.filter(vnode => {
- return vnode.componentOptions
- && vnode.componentOptions.tag !== 'loading-indicator'
- })
- }
- },
- render (createElement) {
- this.$parent._loading = this
- return createElement('aside', {
- ref: 'loading',
- attrs: { 'weex-type': 'loading' },
- staticClass: 'weex-loading weex-ct',
- staticStyle: extractComponentStyle(this)
- }, this.getChildren())
- }
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('loading', getLoading(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/mixins/index.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/mixins/index.js b/html5/render/vue/components/scrollable/mixins/index.js
deleted file mode 100644
index 560f958..0000000
--- a/html5/render/vue/components/scrollable/mixins/index.js
+++ /dev/null
@@ -1,26 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import scrollable from './scrollable'
-import list from './list'
-
-export {
- scrollable,
- list
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/mixins/list.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/mixins/list.js b/html5/render/vue/components/scrollable/mixins/list.js
deleted file mode 100644
index 9c5ca8f..0000000
--- a/html5/render/vue/components/scrollable/mixins/list.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-export default {
- methods: {
- handleListScroll (event) {
- this.handleScroll(event)
-
- if (weex.utils.supportSticky()) {
- return
- }
-
- const scrollTop = this.$el.scrollTop
- const h = this.$children.filter(vm => vm.$refs.header)
-
- if (h.length <= 0) {
- return
- }
-
- for (let i = 0; i < h.length; i++) {
- if (h[i].initTop < scrollTop) {
- h[i].addSticky()
- }
- else {
- h[i].removeSticky()
- }
- }
- }
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/mixins/scrollable.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/mixins/scrollable.js b/html5/render/vue/components/scrollable/mixins/scrollable.js
deleted file mode 100644
index 19ffe74..0000000
--- a/html5/render/vue/components/scrollable/mixins/scrollable.js
+++ /dev/null
@@ -1,268 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-const DEFAULT_OFFSET_ACCURACY = 10
-const DEFAULT_LOADMORE_OFFSET = 0
-
-function getThrottledScroll (context) {
- const scale = weex.config.env.scale
- if (!context._throttleScroll) {
- const wrapper = context.$refs.wrapper
- const inner = context.$refs.inner
- let preOffset = (context.scrollDirection === 'horizontal'
- ? wrapper.scrollLeft
- : wrapper.scrollTop)
- || 0
- context._throttleScroll = weex.utils.throttle(function (evt) {
- const offset = context.scrollDirection === 'horizontal'
- ? wrapper.scrollLeft
- : wrapper.scrollTop
- const indent = parseInt(context.offsetAccuracy) * scale
- function triggerScroll () {
- const rect = inner.getBoundingClientRect()
- evt.contentSize = { width: rect.width, height: rect.height }
- evt.contentOffset = {
- x: wrapper.scrollLeft,
- /**
- * positive direciton for y-axis is down.
- * so should use negative operation on scrollTop.
- *
- * (0,0)---------------> x
- * |
- * |
- * |
- * |
- * v y
- *
- */
- y: -wrapper.scrollTop
- }
- context.$emit('scroll', evt)
- }
- if (Math.abs(offset - preOffset) >= indent) {
- triggerScroll()
- preOffset = offset
- }
- }, 16, true)
- }
- return context._throttleScroll
-}
-
-export default {
- props: {
- loadmoreoffset: {
- type: [String, Number],
- default: DEFAULT_LOADMORE_OFFSET,
- validator (value) {
- const val = parseInt(value)
- return !isNaN(val) && val >= DEFAULT_LOADMORE_OFFSET
- }
- },
-
- offsetAccuracy: {
- type: [Number, String],
- default: DEFAULT_OFFSET_ACCURACY,
- validator (value) {
- const val = parseInt(value)
- return !isNaN(val) && val >= DEFAULT_OFFSET_ACCURACY
- }
- }
- },
-
- created () {
- // should call resetLoadmore() to enable loadmore event.
- this._loadmoreReset = true
- },
-
- methods: {
- updateLayout () {
- const wrapper = this.$refs.wrapper
- if (wrapper) {
- const rect = wrapper.getBoundingClientRect()
- this._wrapperWidth = rect.width
- this._wrapperHeight = rect.height
- }
- const inner = this.$refs.inner
- const children = inner && inner.children
- if (inner) {
- const rect = inner.getBoundingClientRect()
- this._innerWidth = rect.width
- this._innerHeight = rect.height
- }
- const loadingEl = this._loading && this._loading.$el
- const refreshEl = this._refresh && this._refresh.$el
- if (loadingEl) {
- this._innerHeight -= loadingEl.getBoundingClientRect().height
- }
- if (refreshEl) {
- this._innerHeight -= refreshEl.getBoundingClientRect().height
- }
- // inner width is always the viewport width somehow in horizontal
- // scoller, therefore the inner width should be reclaculated.
- if (this.scrollDirection === 'horizontal' && children) {
- this._innerWidth = weex.utils.getRangeWidth(inner)
- }
- },
-
- resetLoadmore () {
- this._loadmoreReset = true
- },
-
- /**
- * process sticky children in scrollable components.
- * current only support list and vertical scroller.
- */
- processSticky () {
- /**
- * current browser support 'sticky' or '-webkit-sticky', so there's no need
- * to do further more.
- */
- if (weex.utils.supportSticky()) {
- return
- }
- // current only support list and vertical scroller.
- if (this.scrollDirection === 'horizontal') {
- return
- }
- const stickyChildren = this._stickyChildren
- const len = stickyChildren && stickyChildren.length || 0
- if (len <= 0) { return }
-
- const container = this.$el
- if (!container) { return }
- const scrollTop = container.scrollTop
-
- let stickyChild
- for (let i = 0; i < len; i++) {
- stickyChild = stickyChildren[i]
- if (stickyChild._initOffsetTop < scrollTop) {
- stickyChild._addSticky()
- }
- else {
- stickyChild._removeSticky()
- }
- }
- },
-
- handleScroll (event) {
- weex.utils.getThrottleLazyload(25, this.$el, 'scroll')()
- getThrottledScroll(this)(event)
-
- this.processSticky()
-
- // fire loadmore event.
- const inner = this.$refs.inner
- if (inner) {
- const innerLength = this.scrollDirection === 'horizontal'
- ? this._innerWidth
- : this._innerHeight
- if (!this._innerLength) {
- this._innerLength = innerLength
- }
- if (this._innerLength !== innerLength) {
- this._innerLength = innerLength
- this._loadmoreReset = true
- }
- if (this._loadmoreReset && this.reachBottom(this.loadmoreoffset)) {
- this._loadmoreReset = false
- this.$emit('loadmore', event)
- }
- }
- },
-
- reachTop () {
- const wrapper = this.$refs.wrapper
- return (!!wrapper) && (wrapper.scrollTop <= 0)
- },
-
- reachBottom (offset) {
- const wrapper = this.$refs.wrapper
- const inner = this.$refs.inner
- offset = parseInt(offset || 0) * weex.config.env.scale
-
- if (wrapper && inner) {
- const key = this.scrollDirection === 'horizontal'
- ? 'width'
- : 'height'
- const innerLength = this[`_inner${key[0].toUpperCase()}${key.substr(1)}`]
- const wrapperLength = this[`_wrapper${key[0].toUpperCase()}${key.substr(1)}`]
- const scrollOffset = this.scrollDirection === 'horizontal'
- ? wrapper.scrollLeft
- : wrapper.scrollTop
- return scrollOffset >= innerLength - wrapperLength - offset
- }
- return false
- },
-
- handleTouchStart (event) {
- if (this._loading || this._refresh) {
- const touch = event.changedTouches[0]
- this._touchParams = {
- reachTop: this.reachTop(),
- reachBottom: this.reachBottom(),
- startTouchEvent: touch,
- startX: touch.pageX,
- startY: touch.pageY,
- timeStamp: event.timeStamp
- }
- }
- },
-
- handleTouchMove (event) {
- if (!this._touchParams || !this._refresh && !this._loading) {
- return
- }
- const inner = this.$refs.inner
- const { startY, reachTop, reachBottom } = this._touchParams
- if (inner) {
- const touch = event.changedTouches[0]
- const offsetY = touch.pageY - startY
- const dir = offsetY > 0 ? 'down' : 'up'
- this._touchParams.offsetY = offsetY
- if (this._refresh && (dir === 'down') && reachTop) {
- this._refresh.pullingDown(offsetY)
- }
- else if (this._loading && (dir === 'up') && reachBottom) {
- this._loading.pullingUp(-offsetY)
- }
- }
- },
-
- handleTouchEnd (event) {
- if (!this._touchParams || !this._refresh && !this._loading) {
- return
- }
- const inner = this.$refs.inner
- const { startY, reachTop, reachBottom } = this._touchParams
- if (inner) {
- const touch = event.changedTouches[0]
- const offsetY = touch.pageY - startY
- const dir = offsetY > 0 ? 'down' : 'up'
- this._touchParams.offsetY = offsetY
- if (this._refresh && (dir === 'down') && reachTop) {
- this._refresh.pullingEnd()
- }
- else if (this._loading && (dir === 'up') && reachBottom) {
- this._loading.pullingEnd()
- }
- }
- delete this._touchParams
- }
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/refresh.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/refresh.js b/html5/render/vue/components/scrollable/refresh.js
deleted file mode 100644
index 214a189..0000000
--- a/html5/render/vue/components/scrollable/refresh.js
+++ /dev/null
@@ -1,115 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-function getRefresh (weex) {
- const { extractComponentStyle } = weex
- const { createEvent } = weex.utils
-
- return {
- name: 'weex-refresh',
- props: {
- display: {
- type: String,
- default: 'show',
- validator (value) {
- return ['show', 'hide'].indexOf(value) !== -1
- }
- }
- },
- data () {
- return {
- lastDy: 0,
- viewHeight: 0,
- height: -1
- }
- },
- mounted () {
- this.viewHeight = this.$el.offsetHeight
- if (this.display === 'hide') {
- this.height = 0
- }
- else {
- this.height = this.viewHeight
- }
- },
- watch: {
- height (val) {
- this.$el.style.height = `${val}px`
- },
- display (val) {
- if (val === 'hide') {
- this.height = 0
- }
- else {
- this.height = this.viewHeight
- }
- }
- },
- methods: {
- pulling (offsetY = 0) {
- this.height = offsetY
- this.$emit('pullingdown', createEvent(this, 'pullingdown', {
- dy: offsetY - this.lastDy,
- pullingDistance: offsetY,
- viewHeight: this.viewHeight
- }))
- this.lastDy = offsetY
- },
- pullingDown (offsetY) {
- this.$el.style.transition = `height 0s`
- this.pulling(offsetY)
- },
- pullingEnd () {
- this.$el.style.transition = `height .2s`
- if (this.height >= this.viewHeight) {
- this.pulling(this.viewHeight)
- this.$emit('refresh')
- }
- else {
- this.pulling(0)
- }
- },
- getChildren () {
- const children = this.$slots.default || []
- if (this.display === 'show') {
- return children
- }
- return children.filter(vnode => {
- return vnode.componentOptions
- && vnode.componentOptions.tag !== 'loading-indicator'
- })
- }
- },
- render (createElement) {
- this.$parent._refresh = this
- return createElement('aside', {
- ref: 'refresh',
- attrs: { 'weex-type': 'refresh' },
- staticClass: 'weex-refresh weex-ct',
- staticStyle: extractComponentStyle(this)
- }, this.getChildren())
- }
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('refresh', getRefresh(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/scroller.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/scroller.js b/html5/render/vue/components/scrollable/scroller.js
deleted file mode 100644
index 655edcf..0000000
--- a/html5/render/vue/components/scrollable/scroller.js
+++ /dev/null
@@ -1,109 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { scrollable, list as listMixin } from './mixins'
-
-function getScroller (weex) {
- const {
- extractComponentStyle,
- createEventMap
- } = weex
-
- return {
- name: 'weex-scroller',
- mixins: [scrollable, listMixin],
- props: {
- scrollDirection: {
- type: [String],
- default: 'vertical',
- validator (value) {
- return ['horizontal', 'vertical'].indexOf(value) !== -1
- }
- },
- scrollable: {
- type: [Boolean],
- default: true
- }
- },
- computed: {
- wrapperClass () {
- const classArray = ['weex-scroller', 'weex-scroller-wrapper', 'weex-ct']
- if (this.scrollDirection === 'horizontal') {
- classArray.push('weex-scroller-horizontal')
- }
- else {
- classArray.push('weex-scroller-vertical')
- }
- if (!this.scrollable) {
- classArray.push('weex-scroller-disabled')
- }
- return classArray.join(' ')
- }
- },
-
- methods: {
- createChildren (h) {
- const slots = this.$slots.default || []
- this._cells = slots.filter(vnode => {
- if (!vnode.tag || !vnode.componentOptions) return false
- return true
- })
- return [
- h('article', {
- ref: 'inner',
- staticClass: 'weex-scroller-inner weex-ct'
- }, this._cells)
- ]
- }
- },
-
- render (createElement) {
- this.weexType = 'scroller'
-
- /* istanbul ignore next */
- // if (process.env.NODE_ENV === 'development') {
- // validateStyles('scroller', this.$vnode.data && this.$vnode.data.staticStyle)
- // }
-
- this._cells = this.$slots.default || []
- this.$nextTick(() => {
- this.updateLayout()
- })
-
- return createElement('main', {
- ref: 'wrapper',
- attrs: { 'weex-type': 'scroller' },
- on: createEventMap(this, {
- scroll: this.handleScroll,
- touchstart: this.handleTouchStart,
- touchmove: this.handleTouchMove,
- touchend: this.handleTouchEnd
- }),
- staticClass: this.wrapperClass,
- staticStyle: extractComponentStyle(this)
- }, this.createChildren(createElement))
- }
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('scroller', getScroller(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/style.css
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/style.css b/html5/render/vue/components/scrollable/style.css
deleted file mode 100644
index f79ff7d..0000000
--- a/html5/render/vue/components/scrollable/style.css
+++ /dev/null
@@ -1,96 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-body > .weex-list,
-body > .weex-scroller,
-body > .weex-waterfall {
- max-height: 100%;
-}
-
-.weex-list-wrapper,
-.weex-scroller-wrapper,
-.weex-waterfall-wrapper {
- -webkit-overflow-scrolling: touch;
-}
-
-.weex-list-wrapper,
-.weex-waterfall-wrapper {
- overflow-y: scroll !important;
- overflow-x: hidden !important;
-}
-
-.weex-list-inner,
-.weex-scroller-inner,
-.weex-waterfall-inner {
- -webkit-overflow-scrolling: touch;
-}
-
-.weex-waterfall-inner-columns {
- -webkit-flex-direction: row;
- -moz-box-orient: horizontal;
- -moz-box-direction: normal;
- -ms-flex-direction: row;
- flex-direction: row;
- -webkit-box-orient: horizontal;
-}
-
-.weex-scroller-wrapper.weex-scroller-vertical {
- overflow-x: hidden;
- overflow-y: scroll;
-}
-
-.weex-scroller-wrapper.weex-scroller-horizontal {
- overflow-x: scroll;
- overflow-y: hidden;
-}
-
-.weex-scroller-wrapper.weex-scroller-disabled {
- overflow-x: hidden;
- overflow-y: hidden;
-}
-
-.weex-scroller-horizontal .weex-scroller-inner {
- -webkit-flex-direction: row;
- -ms-flex-direction: row;
- -moz-box-orient: horizontal;
- -moz-box-direction: normal;
- flex-direction: row;
- -webkit-box-orient: horizontal;
- height: 100%;
-}
-
-.weex-cell {
- width: 100%;
-}
-
-.weex-refresh,
-.weex-loading {
- -webkit-box-align: center;
- -webkit-align-items: center;
- -moz-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- -webkit-box-pack: center;
- -webkit-justify-content: center;
- -moz-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- width: 100%;
- overflow: hidden;
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/scrollable/waterfall.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/scrollable/waterfall.js b/html5/render/vue/components/scrollable/waterfall.js
deleted file mode 100644
index 325fe02..0000000
--- a/html5/render/vue/components/scrollable/waterfall.js
+++ /dev/null
@@ -1,381 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * @fileoverview waterfall
- * NOTE: only support full screen width waterfall.
- */
-
-import { scrollable } from './mixins'
-
-const NORMAL_GAP_SIZE = 32
-const DEFAULT_COLUMN_COUNT = 1
-
-function getWaterfall (weex) {
- const {
- extractComponentStyle,
- createEventMap
- } = weex
-
- return {
- name: 'weex-waterfall',
- mixins: [scrollable],
- props: {
- /**
- * specified gap size.
- * value can be number or 'normal'. 'normal' (32px) by default.
- */
- columnGap: {
- type: [String, Number],
- default: 'normal',
- validator (val) {
- if (!val || val === 'normal') {
- return true
- }
- val = parseInt(val)
- return !isNaN(val) && val > 0
- }
- },
- /**
- * the maximum column counts.
- * value can be number or 'auto'. 1 by default.
- */
- columnCount: {
- type: [String, Number],
- default: DEFAULT_COLUMN_COUNT,
- validator (val) {
- val = parseInt(val)
- return !isNaN(val) && val > 0
- }
- },
- /**
- * the mimimum column width.
- * value can be number or 'auto'. 'auto' by default.
- */
- columnWidth: {
- type: [String, Number],
- default: 'auto',
- validator (val) {
- if (!val || val === 'auto') {
- return true
- }
- val = parseInt(val)
- return !isNaN(val) && val > 0
- }
- }
- },
-
- mounted () {
- this._nextTick()
- },
-
- updated () {
- this.$nextTick(this._nextTick())
- },
-
- methods: {
- _createChildren (h, rootStyle) {
- const slots = this.$slots.default || []
- this._headers = []
- this._footers = []
- this._others = []
- const len = slots.length
-
- for (let i = 0; i < len; i++) {
- const vnode = slots[i]
- const tag = vnode.componentOptions && vnode.componentOptions.tag
- if (tag === 'refresh' || tag === 'loading') {
- continue
- }
- if (tag === 'cell') {
- break
- }
- if (tag === 'header') {
- this._headers.push(vnode)
- }
- }
-
- for (let i = len - 1; i >= 0; i--) {
- const vnode = slots[i]
- const tag = vnode.componentOptions && vnode.componentOptions.tag
- if (tag === 'refresh' || tag === 'loading') {
- continue
- }
- if (tag === 'cell') {
- break
- }
- if (tag === 'header') {
- this._footers.push(vnode)
- }
- }
-
- this._cells = slots.filter(vnode => {
- if (!vnode.tag || !vnode.componentOptions) return false
- const tag = vnode.componentOptions.tag
- if (tag === 'refresh' || tag === 'loading') {
- this[`_${tag}`] = vnode
- return false
- }
- if (tag !== 'cell') {
- this._others.push(vnode)
- return false
- }
- return true
- })
-
- this._reCalc(rootStyle)
- this._genColumns(h)
- let children = []
- this._refresh && children.push(this._refresh)
- children = children.concat(this._headers)
- // .concat(this._others)
- children.push(h('html:div', {
- ref: 'columns',
- staticClass: 'weex-waterfall-inner-columns weex-ct'
- }, this._columns))
- children.push(h('html:div', {
- ref: 'footers',
- staticClass: 'weex-waterfall-footers weex-ct'
- }, this._footers))
- this._loading && children.push(this._loading)
- return [
- h('article', {
- ref: 'inner',
- staticClass: 'weex-waterfall-inner weex-ct'
- }, children)
- ]
- },
-
- _reCalc (rootStyle) {
- /**
- * NOTE: columnGap and columnWidth can't both be auto.
- * NOTE: the formula:
- * totalWidth = n * w + (n - 1) * gap
- * 1. if columnCount = n then calc w
- * 2. if columnWidth = w then calc n
- * 3. if columnWidth = w and columnCount = n then calc totalWidth
- * 3.1 if totalWidth < ctWidth then increase columnWidth
- * 3.2 if totalWidth > ctWidth then decrease columnCount
- */
- let width, gap, cnt, ctWidth
- const scale = weex.config.env.scale
- const el = this.$el
- function getCtWidth (width, style) {
- const padding = style.padding
- ? parseInt(style.padding) * 2
- : parseInt(style.paddingLeft || 0) + parseInt(style.paddingRight || 0)
- return width - padding
- }
- if (el && el.nodeType === 1) { // already mounted
- const cstyle = window.getComputedStyle(el)
- ctWidth = getCtWidth(el.getBoundingClientRect().width, cstyle)
- }
- else { // not mounted.
- // only support full screen width for waterfall component.
- ctWidth = getCtWidth(document.documentElement.clientWidth, rootStyle)
- }
-
- gap = this.columnGap
- if (gap && gap !== 'normal') {
- gap = parseInt(gap)
- }
- else {
- gap = NORMAL_GAP_SIZE
- }
- gap = gap * scale
-
- width = this.columnWidth
- cnt = this.columnCount
- if (width && width !== 'auto') {
- width = parseInt(width) * scale
- }
- if (cnt && cnt !== 'auto') {
- cnt = parseInt(cnt)
- }
-
- // 0. if !columnCount && !columnWidth
- if (cnt === 'auto' && width === 'auto') {
- if (process.env.NODE_ENV === 'development') {
- console.warn(`[vue-render] waterfall's columnWidth and columnCount shouldn't`
- + ` both be auto at the same time.`)
- cnt = DEFAULT_COLUMN_COUNT
- width = ctWidth
- }
- }
- // 1. if columnCount = n then calc w.
- else if (cnt !== 'auto' && width === 'auto') {
- width = (ctWidth - (cnt - 1) * gap) / cnt
- }
- // 2. if columnWidth = w then calc n.
- else if (cnt === 'auto' && width !== 'auto') {
- cnt = (ctWidth + gap) / (width + gap)
- }
- // 3. if columnWidth = w and columnCount = n then calc totalWidth
- else if (cnt !== 'auto' && width !== 'auto') {
- let totalWidth
- const adjustCountAndWidth = () => {
- totalWidth = cnt * width + (cnt - 1) * gap
- if (totalWidth < ctWidth) {
- width += (ctWidth - totalWidth) / cnt
- }
- else if (totalWidth > ctWidth && cnt > 1) {
- cnt--
- adjustCountAndWidth()
- }
- else if (totalWidth > ctWidth) { // cnt === 1
- width = ctWidth
- }
- }
- adjustCountAndWidth()
- }
- this._columnCount = cnt
- this._columnWidth = width
- this._columnGap = gap
- },
-
- _genColumns (createElement) {
- this._columns = []
- const cells = this._cells
- const columnCnt = this._columnCount
- const len = cells.length
- const columnCells = this._columnCells = Array(columnCnt).join('.').split('.').map(function () { return [] })
- // spread cells to the columns using simpole polling algorithm.
- for (let i = 0; i < len; i++) {
- (cells[i].data.attrs || (cells[i].data.attrs = {}))['data-cell'] = i
- columnCells[i % columnCnt].push(cells[i])
- }
- for (let i = 0; i < columnCnt; i++) {
- this._columns.push(createElement('html:div', {
- ref: `column${i}`,
- attrs: {
- 'data-column': i
- },
- staticClass: 'weex-ct',
- staticStyle: {
- width: this._columnWidth + 'px',
- marginLeft: i === 0 ? 0 : this._columnGap + 'px'
- }
- }, columnCells[i]))
- }
- },
-
- _nextTick () {
- this._reLayoutChildren()
- },
-
- _reLayoutChildren () {
- /**
- * treat the shortest column bottom as the match standard.
- * whichever cell exceeded it would be rearranged.
- * 1. m = shortest column bottom.
- * 2. get all cell ids who is below m.
- * 3. calculate which cell should be in which column.
- */
- const columnCnt = this._columnCount
- const columnDoms = []
- const columnAppendFragments = []
- const columnBottoms = []
- let minBottom = Number.MAX_SAFE_INTEGER
- let minBottomColumnIndex = 0
-
- // 1. find the shortest column bottom.
- for (let i = 0; i < columnCnt; i++) {
- const columnDom = this._columns[i].elm
- const lastChild = columnDom.lastElementChild
- const bottom = lastChild ? lastChild.getBoundingClientRect().bottom : 0
- columnDoms.push(columnDom)
- columnBottoms[i] = bottom
- columnAppendFragments.push(document.createDocumentFragment())
- if (bottom < minBottom) {
- minBottom = bottom
- minBottomColumnIndex = i
- }
- }
-
- // 2. get all cell ids who is below m.
- const belowCellIds = []
- const belowCells = {}
- for (let i = 0; i < columnCnt; i++) {
- if (i === minBottomColumnIndex) {
- continue
- }
- const columnDom = columnDoms[i]
- const cellsInColumn = columnDom.querySelectorAll('section.weex-cell')
- const len = cellsInColumn.length
- for (let j = len - 1; j >= 0; j--) {
- const cellDom = cellsInColumn[j]
- const cellRect = cellDom.getBoundingClientRect()
- if (cellRect.top > minBottom) {
- const id = ~~cellDom.getAttribute('data-cell')
- belowCellIds.push(id)
- belowCells[id] = { elm: cellDom, height: cellRect.height }
- columnBottoms[i] -= cellRect.height
- }
- }
- }
-
- // 3. calculate which cell should be in which column and rearrange them
- // in the dom tree.
- belowCellIds.sort(function (a, b) { return a > b })
- const cellIdsLen = belowCellIds.length
- function addToShortestColumn (belowCell) {
- // find shortest bottom.
- minBottom = Math.min(...columnBottoms)
- minBottomColumnIndex = columnBottoms.indexOf(minBottom)
- const { elm: cellElm, height: cellHeight } = belowCell
- columnAppendFragments[minBottomColumnIndex].appendChild(cellElm)
- columnBottoms[minBottomColumnIndex] += cellHeight
- }
- for (let i = 0; i < cellIdsLen; i++) {
- addToShortestColumn(belowCells[belowCellIds[i]])
- }
- for (let i = 0; i < columnCnt; i++) {
- columnDoms[i].appendChild(columnAppendFragments[i])
- }
- }
- },
-
- render (createElement) {
- this.weexType = 'waterfall'
- this._cells = this.$slots.default || []
- this.$nextTick(() => {
- this.updateLayout()
- })
- const mergedStyle = extractComponentStyle(this)
- return createElement('main', {
- ref: 'wrapper',
- attrs: { 'weex-type': 'waterfall' },
- on: createEventMap(this, {
- scroll: this.handleScroll,
- touchstart: this.handleTouchStart,
- touchmove: this.handleTouchMove,
- touchend: this.handleTouchEnd
- }),
- staticClass: 'weex-waterfall weex-waterfall-wrapper weex-ct',
- staticStyle: mergedStyle
- }, this._createChildren(createElement, mergedStyle))
- }
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('waterfall', getWaterfall(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/slider/index.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/slider/index.js b/html5/render/vue/components/slider/index.js
deleted file mode 100644
index 80699d9..0000000
--- a/html5/render/vue/components/slider/index.js
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import slider from './slider'
-import neighbor from './slider-neighbor'
-import indicator from './indicator'
-
-export default {
- init (weex) {
- weex.install(slider)
- weex.install(neighbor)
- weex.install(indicator)
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/slider/indicator.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/slider/indicator.js b/html5/render/vue/components/slider/indicator.js
deleted file mode 100644
index 1e6e5e3..0000000
--- a/html5/render/vue/components/slider/indicator.js
+++ /dev/null
@@ -1,194 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-const _css = `
-.weex-indicator {
- position: absolute;
- z-index: 10;
- -webkit-flex-direction: row;
- -ms-flex-direction: row;
- -moz-box-orient: horizontal;
- -moz-box-direction: normal;
- flex-direction: row;
- -webkit-box-orient: horizontal;
- margin: 0;
- padding: 0;
-}
-
-.weex-indicator-item {
- display: inline-block;
- position: relative;
- border-radius: 50%;
- width: 0.266667rem;
- height: 0.266667rem;
- background-color: #BBBBBB;
-}
-.weex-indicator-item + .weex-indicator-item {
- margin-left: 0.133333rem;
-}
-
-.weex-indicator-item-active {
- background-color: blue;
-}
-`
-
-let extractComponentStyle, extend, extendKeys
-
-function getIndicatorItemStyle (spec, isActive) {
- const style = {}
- style['background-color'] = spec[isActive ? 'itemSelectedColor' : 'itemColor']
- style['width'] = style['height'] = spec['itemSize']
- return style
-}
-
-function _render (context, h) {
- const children = []
- const mergedStyle = extractComponentStyle(context)
- const indicatorSpecStyle = extendKeys(
- {},
- mergedStyle,
- ['itemColor', 'itemSelectedColor', 'itemSize']
- )
- for (let i = 0; i < Number(context.count); ++i) {
- const classNames = ['weex-indicator-item weex-el']
- let isActive = false
- if (i === Number(context.active)) {
- classNames.push('weex-indicator-item-active')
- isActive = true
- }
- children.push(h('mark', {
- staticClass: classNames.join(' '),
- staticStyle: getIndicatorItemStyle(indicatorSpecStyle, isActive)
- }))
- }
- context.$nextTick(function () {
- _reLayout(this, _getVirtualRect(this, mergedStyle), _getLtbr(this, mergedStyle))
- })
- return h('nav', {
- attrs: { 'weex-type': 'indicator' },
- staticClass: 'weex-indicator weex-ct',
- staticStyle: mergedStyle
- }, children)
-}
-
-/**
- * get indicator's virtual rect (width, height), which is the .
- */
-function _getVirtualRect (context, mergedStyle) {
- const ct = context._getParentRect()
- const rect = ['width', 'height'].reduce((pre, key) => {
- const msv = mergedStyle && mergedStyle[key]
- pre[key] = msv ? parseFloat(msv) : ct[key]
- return pre
- }, {})
- return rect
-}
-
-/**
- * get indicator's ltbr values (without units).
- */
-function _getLtbr (context, mergedStyle) {
- return ['left', 'top', 'bottom', 'right'].reduce((pre, key) => {
- const msv = mergedStyle && mergedStyle[key]
- if (!msv && msv !== 0) { return pre }
- pre[key] = parseFloat(msv)
- return pre
- }, {})
-}
-
-/**
- * get indicator's rect (width, height).
- */
-function _getIndicatorRect (el) {
- let width, height
- if (el.children.length === 1) {
- const itemComputedStyle = window.getComputedStyle(el.children[0])
- width = parseFloat(itemComputedStyle.width)
- height = parseFloat(itemComputedStyle.height)
- }
- else {
- const itemComputedStyle = window.getComputedStyle(el.children[1])
- const padding = parseFloat(itemComputedStyle.marginLeft)
- height = parseFloat(itemComputedStyle.height)
- width = el.children.length * (height + padding) - padding
- }
- return { width, height }
-}
-
-/**
- * calculate and reset indicator's width, height, and ltbr.
- * @param {object} virtualRect. width and height of indicator's virtual rect box.
- * @param {object} ltbr. the user specified left, top, bottom, right pixels (without units).
- */
-function _reLayout (context, virtualRect, ltbr) {
- const el = context.$el
- const rect = _getIndicatorRect(el)
- const rectWithPx = Object.keys(rect).reduce((pre, key) => {
- pre[key] = rect[key] + 'px'
- return pre
- }, {})
- extend(el.style, rectWithPx)
- const axisMap = [{
- dir: ltbr.left || ltbr.left === 0
- ? 'left' : ltbr.right || ltbr.right === 0
- ? 'right' : 'left',
- scale: 'width'
- }, {
- dir: ltbr.top || ltbr.top === 0
- ? 'top' : ltbr.bottom || ltbr.bottom === 0
- ? 'bottom' : 'top',
- scale: 'height'
- }]
- Object.keys(axisMap).forEach(key => {
- const { dir, scale } = axisMap[key]
- el.style[dir] = (ltbr[dir] || 0) + virtualRect[scale] / 2 - rect[scale] / 2 + 'px'
- })
-}
-
-const indicator = {
- name: 'weex-indicator',
- methods: {
- show: function () {
- this.$el.style.visibility = 'visible'
- }
- },
- data () {
- return {
- count: 0,
- active: 0
- }
- },
- render (createElement) {
- const { count, active } = this.$vnode.data.attrs || {}
- this.count = count
- this.active = active
- if (!this.count) { return }
- return _render(this, createElement)
- },
- _css
-}
-
-export default {
- init (weex) {
- extractComponentStyle = weex.extractComponentStyle
- extend = weex.utils.extend
- extendKeys = weex.utils.extendKeys
- weex.registerComponent('indicator', indicator)
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/slider/slideMixin.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/slider/slideMixin.js b/html5/render/vue/components/slider/slideMixin.js
deleted file mode 100644
index 710fbcb..0000000
--- a/html5/render/vue/components/slider/slideMixin.js
+++ /dev/null
@@ -1,644 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import './slider.css'
-
-const TRANSITION_TIME = 400
-const NEIGHBOR_SCALE_TIME = 100
-const MAIN_SLIDE_OPACITY = 1
-const THROTTLE_SCROLL_TIME = 25
-const INTERVAL_MINIMUM = 200
-
-export default {
- created () {
- this._clones = []
- this.innerOffset = 0
- this._indicator = null
- },
-
- beforeUpdate () {
- this._getWrapperSize()
- },
-
- updated () {
- const children = this.$children
- const len = children && children.length
- if (children && len > 0) {
- for (let i = 0; i < len; i++) {
- const vm = children[i]
- if (vm.$options._componentTag === 'indicator'
- || vm.$vnode.data.ref === 'indicator') {
- vm._watcher.get()
- break
- }
- }
- }
- weex.utils.fireLazyload(this.$el, true)
- if (this._preIndex !== this.currentIndex) {
- this._slideTo(this.currentIndex)
- }
- },
-
- mounted () {
- this._getWrapperSize()
- this._slideTo(this.currentIndex)
- weex.utils.fireLazyload(this.$el, true)
- },
-
- methods: {
- _getWrapperSize () {
- const wrapper = this.$refs.wrapper
- if (wrapper) {
- const rect = wrapper.getBoundingClientRect()
- this._wrapperWidth = rect.width
- this._wrapperHeight = rect.height
- }
- },
-
- _formatChildren (createElement) {
- const children = this.$slots.default || []
- let indicatorVnode
- const cells = children.filter(vnode => {
- if (!vnode.tag) return false
- if (vnode.componentOptions && vnode.componentOptions.tag === 'indicator') {
- indicatorVnode = vnode
- return false
- }
- return true
- }).map(vnode => {
- return createElement('li', {
- ref: 'cells',
- staticClass: `weex-slider-cell weex-ct${this.isNeighbor ? ' neighbor-cell' : ''}`
- }, [vnode])
- })
- if (indicatorVnode) {
- indicatorVnode.data.attrs = indicatorVnode.data.attrs || {}
- indicatorVnode.data.attrs.count = cells.length
- indicatorVnode.data.attrs.active = this.currentIndex
- this._indicator = indicatorVnode
- }
- return cells
- },
-
- _renderSlides (createElement) {
- this._cells = this._formatChildren(createElement)
- this.frameCount = this._cells.length
- return createElement(
- 'nav',
- {
- ref: 'wrapper',
- attrs: { 'weex-type': this.isNeighbor ? 'slider-neighbor' : 'slider' },
- on: weex.createEventMap(
- this,
- ['scroll', 'scrollstart', 'scrollend'],
- {
- touchstart: this._handleTouchStart,
- touchmove: weex.utils.throttle(weex.utils.bind(this._handleTouchMove, this), 25),
- touchend: this._handleTouchEnd,
- touchcancel: this._handleTouchCancel
- }
- ),
- staticClass: 'weex-slider weex-slider-wrapper weex-ct',
- staticStyle: weex.extractComponentStyle(this)
- },
- [
- createElement('ul', {
- ref: 'inner',
- staticClass: 'weex-slider-inner weex-ct'
- }, this._cells),
- this._indicator
- ]
- )
- },
-
- // get standard index
- _normalizeIndex (index) {
- const newIndex = (index + this.frameCount) % this.frameCount
- return Math.min(Math.max(newIndex, 0), this.frameCount - 1)
- },
-
- _startAutoPlay () {
- if (!this.autoPlay || this.autoPlay === 'false') {
- return
- }
- if (this._autoPlayTimer) {
- clearTimeout(this._autoPlayTimer)
- this._autoPlayTimer = null
- }
- let interval = parseInt(this.interval - TRANSITION_TIME - NEIGHBOR_SCALE_TIME)
- interval = interval > INTERVAL_MINIMUM ? interval : INTERVAL_MINIMUM
- this._autoPlayTimer = setTimeout(weex.utils.bind(this._next, this), interval)
- },
-
- _stopAutoPlay () {
- if (this._autoPlayTimer) {
- clearTimeout(this._autoPlayTimer)
- this._autoPlayTimer = null
- }
- },
-
- _slideTo (index, isTouchScroll) {
- if (this.frameCount <= 0) {
- return
- }
- if (!this.infinite || this.infinite === 'false') {
- if (index === -1 || index > (this.frameCount - 1)) {
- this._slideTo(this.currentIndex)
- return
- }
- }
-
- if (!this._preIndex && this._preIndex !== 0) {
- if (this._showNodes && this._showNodes[0]) {
- this._preIndex = this._showNodes[0].index
- }
- else {
- this._preIndex = this.currentIndex
- }
- }
-
- if (this._sliding) {
- return
- }
- this._sliding = true
-
- const newIndex = this._normalizeIndex(index)
- const inner = this.$refs.inner
- const step = this._step = this.frameCount <= 1 ? 0 : this._preIndex - index
-
- if (inner) {
- this._prepareNodes()
- const translate = weex.utils.getTransformObj(inner).translate
- const match = translate && translate.match(/translate[^(]+\(([+-\d.]+)/)
- const innerX = match && match[1] || 0
- const dist = innerX - this.innerOffset
- this.innerOffset += step * this._wrapperWidth
- // transform the whole slides group.
- inner.style.webkitTransition = `-webkit-transform ${TRANSITION_TIME / 1000}s ease-in-out`
- inner.style.mozTransition = `transform ${TRANSITION_TIME / 1000}s ease-in-out`
- inner.style.transition = `transform ${TRANSITION_TIME / 1000}s ease-in-out`
- inner.style.webkitTransform = `translate3d(${this.innerOffset}px, 0, 0)`
- inner.style.mozTransform = `translate3d(${this.innerOffset}px, 0, 0)`
- inner.style.transform = `translate3d(${this.innerOffset}px, 0, 0)`
-
- // emit scroll events.
- if (!isTouchScroll) {
- this._emitScrollEvent('scrollstart')
- }
- setTimeout(() => {
- this._throttleEmitScroll(dist, () => {
- this._emitScrollEvent('scrollend')
- })
- }, THROTTLE_SCROLL_TIME)
-
- this._loopShowNodes(step)
-
- setTimeout(() => {
- if (this.isNeighbor) {
- this._setNeighbors()
- }
-
- setTimeout(() => {
- inner.style.webkitTransition = ''
- inner.style.mozTransition = ''
- inner.style.transition = ''
- for (let i = this._showStartIdx; i <= this._showEndIdx; i++) {
- const node = this._showNodes[i]
- if (!node) { continue }
- const elm = node.firstElementChild
- elm.style.webkitTransition = ''
- elm.style.mozTransition = ''
- elm.style.transition = ''
- }
- // clean cloned nodes and rearrange slide cells.
- this._rearrangeNodes(newIndex)
- }, NEIGHBOR_SCALE_TIME)
- }, TRANSITION_TIME)
- }
-
- if (newIndex !== this._preIndex) {
- this.$emit('change', weex.utils.createEvent(this.$el, 'change', {
- index: newIndex
- }))
- }
- },
-
- _clearNodesOffset () {
- const end = this._showEndIdx
- for (let i = this._showStartIdx; i <= end; i++) {
- let node = this._showNodes[i]
- node = node && node.firstElementChild
- if (!node) { continue }
- weex.utils.addTransform(this._showNodes[i].firstElementChild, {
- translate: 'translate3d(0px, 0px, 0px)'
- })
- }
- },
-
- _loopShowNodes (step) {
- if (!step || this.frameCount <= 1) {
- return
- }
- const sign = step > 0 ? 1 : -1
- let i = step <= 0 ? this._showStartIdx : this._showEndIdx
- const end = step <= 0 ? this._showEndIdx : this._showStartIdx
- for (; i !== end - sign; i -= sign) {
- const nextIdx = i + step
- this._showNodes[nextIdx] = this._showNodes[i]
- this._showNodes[nextIdx]._showIndex = nextIdx
- delete this._showNodes[i]
- }
- this._showStartIdx += step
- this._showEndIdx += step
- },
-
- _prepareNodes () {
- // test if the next slide towards the direction exists.
- // e.g. currentIndex 0 -> 1: should prepare 4 slides: -1, 0, 1, 2
- // if not, translate a node to here, or just clone it.
- const step = this._step
- if (!this._inited) {
- this._initNodes()
- this._inited = true
- this._showNodes = {}
- }
- if (this.frameCount <= 1) {
- this._showStartIdx = this._showEndIdx = 0
- const node = this._cells[0].elm
- node.style.opacity = 1
- node.style.zIndex = 99
- node.index = 0
- this._showNodes[0] = node
- node._inShow = true
- node._showIndex = 0
- return
- }
- const showCount = this._showCount = Math.abs(step) + 3
- this._showStartIdx = step <= 0 ? -1 : 2 - showCount
- this._showEndIdx = step <= 0 ? showCount - 2 : 1
- this._clearNodesOffset()
- this._positionNodes(this._showStartIdx, this._showEndIdx, step)
- },
-
- _initNodes () {
- const total = this.frameCount
- const cells = this._cells
- for (let i = 0; i < total; i++) {
- const node = cells[i].elm
- node.index = i
- node._inShow = false
- node.style.zIndex = 0
- node.style.opacity = 0
- }
- },
-
- _positionNodes (begin, end, step, anim) {
- const cells = this._cells
- const start = step <= 0 ? begin : end
- const stop = step <= 0 ? end : begin
- const sign = step <= 0 ? -1 : 1
- let cellIndex = this._preIndex + sign
- for (let i = start; i !== stop - sign; i = i - sign) {
- const node = cells[this._normalizeIndex(cellIndex)].elm
- cellIndex = cellIndex - sign
- this._positionNode(node, i)
- }
- },
-
- /**
- * index: position index in the showing cells' view.
- */
- _positionNode (node, index) {
- const holder = this._showNodes[index]
- if (node._inShow && holder !== node) {
- if (holder) { this._removeClone(holder) }
- node = this._getClone(node.index)
- }
- else if (node._inShow) {
- return
- }
-
- node._inShow = true
- const translateX = index * this._wrapperWidth - this.innerOffset
- weex.utils.addTransform(node, {
- translate: `translate3d(${translateX}px, 0px, 0px)`
- })
- node.style.zIndex = 99 - Math.abs(index)
- node.style.opacity = 1
- node._showIndex = index
- this._showNodes[index] = node
- },
-
- _getClone (index) {
- let arr = this._clones[index]
- if (!arr) {
- this._clones[index] = arr = []
- }
- if (arr.length <= 0) {
- const origNode = this._cells[index].elm
- const clone = origNode.cloneNode(true)
- clone._isClone = true
- clone._inShow = origNode._inShow
- clone.index = origNode.index
- clone.style.opacity = 0
- clone.style.zIndex = 0
- const ct = this.$refs.inner
- ct.appendChild(clone)
- arr.push(clone)
- }
- return arr.pop()
- },
-
- _removeClone (node) {
- const idx = node.index
- this._hideNode(node)
- const arr = this._clones[idx]
- arr.push(node)
- },
-
- _hideNode (node) {
- node._inShow = false
- node.style.opacity = 0
- node.style.zIndex = 0
- },
-
- /**
- * hide nodes from begin to end in showArray.
- * if it is clone node, just move the clone node to the buffer.
- */
- _clearNodes (begin, end) {
- for (let i = begin; i <= end; i++) {
- const node = this._showNodes[i]
- if (!node) { return }
- if (node._isClone) {
- this._removeClone(node)
- }
- else if (!node._inShow) {
- this._hideNode(node)
- }
- delete this._showNodes[i]
- }
- },
-
- /**
- * copy node style props (opacity and zIndex) and transform status from
- * one element to another.
- */
- _copyStyle (from, to, styles = ['opacity', 'zIndex'], transformExtra = {}) {
- weex.utils.extendKeys(to.style, from.style, styles)
- const transObj = weex.utils.getTransformObj(from)
- for (const k in transformExtra) {
- transObj[k] = transformExtra[k]
- }
- weex.utils.addTransform(to, transObj)
- const fromInner = from.firstElementChild
- const toInner = to.firstElementChild
- toInner.style.opacity = fromInner.style.opacity
- weex.utils.copyTransform(fromInner, toInner)
- },
-
- /**
- * replace a clone node with the original node if it's not in use.
- */
- _replaceClone (clone, pos) {
- const origNode = this._cells[clone.index].elm
- if (origNode._inShow) {
- return
- }
- const origShowIndex = origNode._showIndex
- const styleProps = ['opacity', 'zIndex']
- let cl
- if (Math.abs(origShowIndex) <= 1) {
- // leave a clone to replace the origNode in the show zone(-1 ~ 1).
- cl = this._getClone(origNode.index)
- this._copyStyle(origNode, cl)
- this._showNodes[origShowIndex] = cl
- }
- origNode._inShow = true
- const transObj = weex.utils.getTransformObj(clone)
- transObj.translate = transObj.translate.replace(/[+-\d.]+[pw]x/, ($0) => {
- return pos * this._wrapperWidth - this.innerOffset + 'px'
- })
- this._copyStyle(clone, origNode, styleProps, transObj)
- this._removeClone(clone)
- if (!cl) {
- delete this._showNodes[origShowIndex]
- }
- this._showNodes[pos] = origNode
- origNode._showIndex = pos
- },
-
- _rearrangeNodes (newIndex) {
- if (this.frameCount <= 1) {
- this._sliding = false
- this.currentIndex = 0
- return
- }
-
- // clear autoPlay timer (and restart after updated hook).
- this._startAutoPlay()
-
- /**
- * clean nodes. replace current node with non-cloned node.
- * set current index to the new index.
- */
- const shows = this._showNodes
- for (let i = this._showStartIdx; i <= this._showEndIdx; i++) {
- shows[i]._inShow = false
- }
- for (let i = -1; i <= 1; i++) {
- const node = shows[i]
- if (!node._isClone) {
- node._inShow = true
- }
- else {
- this._replaceClone(node, i)
- }
- }
-
- this._clearNodes(this._showStartIdx, -2)
- this._showStartIdx = -1
- this._clearNodes(2, this._showEndIdx)
- this._showEndIdx = 1
- this._sliding = false
-
- // set current index to the new index.
- this.currentIndex = newIndex
- this._preIndex = newIndex
- },
-
- /**
- * according to the attrs: neighborScale, neighborAlpha, neighborSpace.
- * 1. apply the main cell transform effects.
- * 2. set the previous cell and the next cell's positon, scale and alpha.
- * 3. set other cells' scale and alpha.
- */
- _setNeighbors () {
- for (let i = this._showStartIdx; i <= this._showEndIdx; i++) {
- const elm = this._showNodes[i].firstElementChild
- elm.style.webkitTransition = `all ${NEIGHBOR_SCALE_TIME / 1000}s ease`
- elm.style.mozTransition = `all ${NEIGHBOR_SCALE_TIME / 1000}s ease`
- elm.style.transition = `all ${NEIGHBOR_SCALE_TIME / 1000}s ease`
- const transObj = {
- scale: `scale(${i === 0 ? this.currentItemScale : this.neighborScale})`
- }
- let translateX
- if (!this._neighborWidth) {
- this._neighborWidth = parseFloat(elm.style.width) || elm.getBoundingClientRect().width
- }
- // calculate position offsets according to neighbor scales.
- if (Math.abs(i) === 1) {
- const dist = ((this._wrapperWidth - this._neighborWidth * this.neighborScale) / 2
- + this.neighborSpace * weex.config.env.scale) / this.neighborScale
- translateX = -i * dist
- }
- else {
- // clear position offsets.
- translateX = 0
- }
- transObj.translate = `translate3d(${translateX}px, 0px, 0px)`
- weex.utils.addTransform(elm, transObj)
- elm.style.opacity = i === 0 ? MAIN_SLIDE_OPACITY : this.neighborAlpha
- }
- },
-
- _next () {
- let next = this.currentIndex + 1
- if (this.frameCount <= 1) {
- next--
- }
- this._slideTo(next)
- },
-
- _prev () {
- let prev = this.currentIndex - 1
- if (this.frameCount <= 1) {
- prev++
- }
- this._slideTo(prev)
- },
-
- _handleTouchStart (event) {
- const touch = event.changedTouches[0]
- this._stopAutoPlay()
- const inner = this.$refs.inner
- this._touchParams = {
- originalTransform: inner.style.webkitTransform
- || inner.style.mozTransform
- || inner.style.transform,
- startTouchEvent: touch,
- startX: touch.pageX,
- startY: touch.pageY,
- timeStamp: event.timeStamp
- }
- },
-
- _handleTouchMove (event) {
- const tp = this._touchParams
- if (!tp) { return }
- if (this._sliding) {
- if (process.env.NODE_ENV === 'development') {
- console.warn(`[vue-render] warn: can't scroll the slider during sliding.`)
- }
- return
- }
- const { startX, startY } = this._touchParams
- const touch = event.changedTouches[0]
- const offsetX = touch.pageX - startX
- const offsetY = touch.pageY - startY
- tp.offsetX = offsetX
- tp.offsetY = offsetY
- let isV = tp.isVertical
- if (typeof isV === 'undefined') {
- isV = tp.isVertical = Math.abs(offsetX) < Math.abs(offsetY)
- if (!isV) {
- this._emitScrollEvent('scrollstart')
- }
- }
- // vertical scroll. just ignore it.
- if (isV) {
- return
- }
- // horizontal scroll. trigger scroll event.
- event.preventDefault()
- const inner = this.$refs.inner
- if (inner && offsetX) {
- if (!this._nodesOffsetCleared) {
- this._nodesOffsetCleared = true
- this._clearNodesOffset()
- }
- this._emitScrollEvent('scroll', {
- offsetXRatio: offsetX / this._wrapperWidth
- })
- inner.style.webkitTransform = `translate3d(${this.innerOffset + offsetX}px, 0, 0)`
- inner.style.mozTransform = `translate3d(${this.innerOffset + offsetX}px, 0, 0)`
- inner.style.transform = `translate3d(${this.innerOffset + offsetX}px, 0, 0)`
- }
- },
-
- _handleTouchEnd (event) {
- this._startAutoPlay()
- const tp = this._touchParams
- if (!tp) { return }
- const isV = tp.isVertical
- if (typeof isV === 'undefined') {
- return
- }
- const inner = this.$refs.inner
- const { offsetX } = tp
- if (inner) {
- this._nodesOffsetCleared = false
- // TODO: test the velocity if it's less than 0.2.
- const reset = Math.abs(offsetX / this._wrapperWidth) < 0.2
- const direction = offsetX > 0 ? 1 : -1
- const newIndex = reset ? this.currentIndex : (this.currentIndex - direction)
- this._slideTo(newIndex, true)
- }
- delete this._touchParams
- },
-
- _handleTouchCancel (event) {
- return this._handleTouchEnd(event)
- },
-
- _emitScrollEvent (type, data = {}) {
- this.$emit(type, weex.utils.createEvent(this.$el, type, data))
- },
-
- _throttleEmitScroll (offset, callback) {
- let i = 0
- const throttleTime = THROTTLE_SCROLL_TIME
- const cnt = parseInt(TRANSITION_TIME / throttleTime) - 1
- const sign = offset > 0 ? 1 : -1
- const r = Math.abs(offset / this._wrapperWidth)
- const throttledScroll = () => {
- if (++i > cnt) {
- return callback && callback.call(this)
- }
- const ratio = this._step === 0
- ? sign * r * (1 - i / cnt)
- : sign * (r + (1 - r) * i / cnt)
- this._emitScrollEvent('scroll', {
- offsetXRatio: ratio
- })
- setTimeout(throttledScroll, THROTTLE_SCROLL_TIME)
- }
- throttledScroll()
- }
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/slider/slider-neighbor.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/slider/slider-neighbor.js b/html5/render/vue/components/slider/slider-neighbor.js
deleted file mode 100644
index ba8ec03..0000000
--- a/html5/render/vue/components/slider/slider-neighbor.js
+++ /dev/null
@@ -1,106 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import slideMixin from './slideMixin'
-
-const DEFAULT_NEIGHBOR_SPACE = 20
-const DEFAULT_NEIGHBOR_ALPHA = 0.6
-const DEFAULT_NEIGHBOR_SCALE = 0.8
-const DEFAULT_CURRENT_ITEM_SCALE = 0.9
-
-const sliderNeighbor = {
- mixins: [slideMixin],
- props: {
- index: {
- type: [String, Number],
- default: 0
- },
- autoPlay: {
- type: [String, Boolean],
- default: false
- },
- interval: {
- type: [String, Number],
- default: 3000
- },
- infinite: {
- type: [String, Boolean],
- default: true
- },
- neighborSpace: {
- type: [String, Number],
- validator: function (val) {
- val = parseFloat(val)
- return !isNaN(val) && val > 0
- },
- default: DEFAULT_NEIGHBOR_SPACE
- },
- neighborAlpha: {
- type: [String, Number],
- validator: function (val) {
- val = parseFloat(val)
- return !isNaN(val) && val >= 0 && val <= 1
- },
- default: DEFAULT_NEIGHBOR_ALPHA
- },
- neighborScale: {
- type: [String, Number],
- validator: function (val) {
- val = parseFloat(val)
- return !isNaN(val) && val >= 0 && val <= 1
- },
- default: DEFAULT_NEIGHBOR_SCALE
- },
- currentItemScale: {
- type: [String, Number],
- validator: function (val) {
- val = parseFloat(val)
- return !isNaN(val) && val >= 0 && val <= 1
- },
- default: DEFAULT_CURRENT_ITEM_SCALE
- }
- },
-
- watch: {
- index () {
- this.currentIndex = this._normalizeIndex(this.index)
- }
- },
-
- data () {
- return {
- currentIndex: this.index,
- frameCount: 0
- }
- },
-
- beforeCreate () {
- this.isNeighbor = true
- this.weexType = 'slider-neighbor'
- },
-
- render (createElement) {
- return this._renderSlides(createElement)
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('slider-neighbor', sliderNeighbor)
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/slider/slider.css
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/slider/slider.css b/html5/render/vue/components/slider/slider.css
deleted file mode 100644
index c712278..0000000
--- a/html5/render/vue/components/slider/slider.css
+++ /dev/null
@@ -1,59 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-.weex-slider-wrapper {
- overflow-x: hidden;
- overflow-y: visible;
-}
-
-.weex-slider-inner {
- width: 100%;
- height: 100%;
- overflow: visible;
- -webkit-flex-direction: row;
- -moz-box-orient: horizontal;
- -moz-box-direction: normal;
- -ms-flex-direction: row;
- flex-direction: row;
- -webkit-box-orient: horizontal;
-}
-
-.weex-slider-cell {
- width: 100%;
- height: 100%;
- position: absolute;
- top: 0px;
- left: 0px;
- background: transparent !important;
- overflow: hidden;
- -webkit-box-align: center;
- -webkit-align-items: center;
- -moz-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- -webkit-box-pack: center;
- -webkit-justify-content: center;
- -moz-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
-}
-
-.neighbor-cell {
- overflow: visible !important;
-}
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/slider/slider.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/slider/slider.js b/html5/render/vue/components/slider/slider.js
deleted file mode 100644
index f916799..0000000
--- a/html5/render/vue/components/slider/slider.js
+++ /dev/null
@@ -1,75 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-// import { validateStyles } from '../../validator'
-// import indicator from './indicator'
-import slideMixin from './slideMixin'
-
-const slider = {
- mixins: [slideMixin],
- props: {
- index: {
- type: [String, Number],
- default: 0
- },
- 'auto-play': {
- type: [String, Boolean],
- default: false
- },
- interval: {
- type: [String, Number],
- default: 3000
- },
- infinite: {
- type: [String, Boolean],
- default: true
- }
- },
-
- watch: {
- index () {
- this.currentIndex = this._normalizeIndex(this.index)
- }
- },
-
- data () {
- return {
- frameCount: 0,
- currentIndex: this.index
- }
- },
-
- beforeCreate () {
- this.weexType = 'slider'
- },
-
- render (createElement) {
- /* istanbul ignore next */
- // if (process.env.NODE_ENV === 'development') {
- // validateStyles('slider', this.$vnode.data && this.$vnode.data.staticStyle)
- // }
- return this._renderSlides(createElement)
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('slider', slider)
- weex.registerComponent('cycleslider', slider)
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/switch.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/switch.js b/html5/render/vue/components/switch.js
deleted file mode 100644
index 11faa63..0000000
--- a/html5/render/vue/components/switch.js
+++ /dev/null
@@ -1,158 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-const _css = `
-.weex-switch {
- border: 0.013333rem solid #dfdfdf;
- cursor: pointer;
- display: inline-block;
- position: relative;
- vertical-align: middle;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- box-sizing: content-box;
- background-clip: content-box;
- color: #64bd63;
- width: 1.333333rem;
- height: 0.8rem;
- background-color: white;
- border-color: #dfdfdf;
- box-shadow: #dfdfdf 0 0 0 0 inset;
- border-radius: 0.8rem;
- -webkit-transition: border 0.4s, box-shadow 0.4s, background-color 1.2s;
- -moz-transition: border 0.4s, box-shadow 0.4s, background-color 1.2s;
- transition: border 0.4s, box-shadow 0.4s, background-color 1.2s;
-}
-
-.weex-switch-checked {
- background-color: #64bd63;
- border-color: #64bd63;
- box-shadow: #64bd63 0 0 0 0.533333rem inset;
-}
-
-.weex-switch-checked.weex-switch-disabled {
- background-color: #A0CCA0;
- box-shadow: #A0CCA0 0 0 0 0.533333rem inset;
-}
-
-.weex-switch-disabled {
- background-color: #EEEEEE;
-}
-
-.weex-switch-inner {
- width: 0.8rem;
- height: 0.8rem;
- background: #fff;
- border-radius: 100%;
- box-shadow: 0 0.013333rem 0.04rem rgba(0, 0, 0, 0.4);
- position: absolute;
- top: 0;
- left: 0;
- -webkit-transition: background-color 0.4s, left 0.2s;
- -moz-transition: background-color 0.4s, left 0.2s;
- transition: background-color 0.4s, left 0.2s;
-}
-
-.weex-switch-checked > .weex-switch-inner {
- left: 0.533333rem;
-}
-`
-
-function getSwitch (weex) {
- const { extractComponentStyle } = weex
-
- return {
- name: 'weex-switch',
- props: {
- checked: {
- type: [Boolean, String],
- default: false
- },
- disabled: {
- type: [Boolean, String],
- default: false
- }
- },
- data () {
- return {
- isChecked: (this.checked !== 'false' && this.checked !== false),
- isDisabled: (this.disabled !== 'false' && this.disabled !== false)
- }
- },
- computed: {
- wrapperClass () {
- const classArray = ['weex-switch']
- this.isChecked && classArray.push('weex-switch-checked')
- this.isDisabled && classArray.push('weex-switch-disabled')
- return classArray.join(' ')
- }
- },
- methods: {
- toggle () {
- // TODO: handle the events
- if (!this.isDisabled) {
- this.isChecked = !this.isChecked
- this.$emit('change', { value: this.isChecked })
- }
- }
- },
-
- mounted () {
- const el = this.$el
- if (el && el.nodeType === 1) {
- if (!this._removeClickHandler) {
- const handler = evt => {
- this.toggle()
- }
- this._removeClickHandler = el.removeEventListener.bind(el, 'click', handler)
- el.addEventListener('click', handler)
- }
- }
- },
-
- beforeDestroy () {
- const rm = this._removeClickHandler
- if (rm) {
- rm()
- delete this._removeClickHandler
- }
- },
-
- render (createElement) {
- /* istanbul ignore next */
- // if (process.env.NODE_ENV === 'development') {
- // validateStyles('switch', this.$vnode.data && this.$vnode.data.staticStyle)
- // }
- return createElement('span', {
- attrs: { 'weex-type': 'switch' },
- staticClass: this.wrapperClass,
- staticStyle: extractComponentStyle(this)
- }, [createElement('small', { staticClass: 'weex-switch-inner' })])
- },
- _css
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('switch', getSwitch(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/text.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/text.js b/html5/render/vue/components/text.js
deleted file mode 100644
index 7379bc6..0000000
--- a/html5/render/vue/components/text.js
+++ /dev/null
@@ -1,87 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * @fileOverview Impl of text component.
- *
- * Notes about the style 'height' and 'lines':
- * if the computed value of 'height' is bigger than 'lines', than the text will
- * be clipped according to the 'lines'. Otherwise, it'll be the 'height'.
- */
-
-const _css = `
-.weex-text {
- display: -webkit-box;
- display: -moz-box;
- -webkit-box-orient: vertical;
- -moz-box-orient: vertical;
- -moz-box-direction: normal;
- position: relative;
- white-space: pre-wrap; /* not using 'pre': support auto line feed. */
- font-size: 0.426667rem;
- word-wrap: break-word;
- overflow: hidden; /* it'll be clipped if the height is not high enough. */
-}
-`
-
-/**
- * Get text special styles (lines and text-overflow).
- */
-function getTextSpecStyle (ms = {}) {
- const lines = parseInt(ms.lines) || 0
- const overflow = ms['text-overflow'] || 'ellipsis'
- if (lines > 0) {
- return {
- overflow: 'hidden',
- 'text-overflow': overflow,
- '-webkit-line-clamp': lines
- }
- }
-}
-
-function getText (weex) {
- const { extractComponentStyle, createEventMap } = weex
- const { extend } = weex.utils
-
- return {
- name: 'weex-text',
- props: {
- lines: [Number, String],
- value: [String]
- },
-
- render (createElement) {
- const style = extractComponentStyle(this)
- const textSpecStyle = getTextSpecStyle(style)
- return createElement('p', {
- attrs: { 'weex-type': 'text' },
- on: createEventMap(this),
- staticClass: 'weex-text weex-el',
- staticStyle: extend(style, textSpecStyle)
- }, this.$slots.default || [this.value])
- },
- _css
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('text', getText(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/textarea.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/textarea.js b/html5/render/vue/components/textarea.js
deleted file mode 100644
index 0a40ba5..0000000
--- a/html5/render/vue/components/textarea.js
+++ /dev/null
@@ -1,86 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-const _css = `
-.weex-textarea {
- font-size: 0.426667rem
-}
-.weex-textarea:focus {
- outline: none;
-}
-`
-
-function getTextarea (weex) {
- const { extractComponentStyle, createEventMap } = weex
- const { inputCommon } = weex.mixins
- const { extend, mapFormEvents } = weex.utils
-
- return {
- name: 'weex-textarea',
- mixins: [inputCommon],
- props: {
- value: String,
- placeholder: String,
- disabled: {
- type: [String, Boolean],
- default: false
- },
- autofocus: {
- type: [String, Boolean],
- default: false
- },
- rows: {
- type: [String, Number],
- default: 2
- },
- returnKeyType: String
- },
-
- render (createElement) {
- /* istanbul ignore next */
- // if (process.env.NODE_ENV === 'development') {
- // validateStyles('textarea', this.$vnode.data && this.$vnode.data.staticStyle)
- // }
- const events = extend(createEventMap(this), mapFormEvents(this))
- return createElement('html:textarea', {
- attrs: {
- 'weex-type': 'textarea',
- value: this.value,
- disabled: (this.disabled !== 'false' && this.disabled !== false),
- autofocus: (this.autofocus !== 'false' && this.autofocus !== false),
- placeholder: this.placeholder,
- rows: this.rows,
- 'return-key-type': this.returnKeyType
- },
- domProps: {
- value: this.value
- },
- on: this.createKeyboardEvent(events),
- staticClass: 'weex-textarea weex-el',
- staticStyle: extractComponentStyle(this)
- })
- },
- _css
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('textarea', getTextarea(weex))
- }
-}
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/ceef728d/html5/render/vue/components/video.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/video.js b/html5/render/vue/components/video.js
deleted file mode 100644
index d292386..0000000
--- a/html5/render/vue/components/video.js
+++ /dev/null
@@ -1,85 +0,0 @@
- /*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-function getVideo (weex) {
- const { extractComponentStyle, createEventMap } = weex
-
- return {
- name: 'weex-video',
- props: {
- src: String,
- playStatus: {
- type: String,
- default: 'pause',
- validator (value) {
- return ['play', 'pause'].indexOf(value) !== -1
- }
- },
- autoplay: {
- type: [String, Boolean],
- default: false
- },
- autoPlay: {
- type: [String, Boolean],
- default: false
- },
- playsinline: {
- type: [String, Boolean],
- default: true
- },
- controls: {
- type: [String, Boolean],
- default: false
- }
- },
-
- render (createElement) {
- if (this.playStatus === 'play') {
- this.$nextTick(function () {
- this.$el && this.$el.play()
- })
- }
- else if (this.playStatus === 'pause') {
- this.$nextTick(function () {
- this.$el && this.$el.pause()
- })
- }
-
- return createElement('html:video', {
- attrs: {
- 'weex-type': 'video',
- autoplay: ((this.autoplay !== 'false' && this.autoplay !== false)
- || (this.autoPlay !== 'false' && this.autoPlay !== false)),
- 'webkit-playsinline': this.playsinline,
- controls: this.controls,
- src: this.src
- },
- on: createEventMap(this, ['start', 'pause', 'finish', 'fail']),
- staticClass: 'weex-video weex-el',
- staticStyle: extractComponentStyle(this)
- })
- }
- }
-}
-
-export default {
- init (weex) {
- weex.registerComponent('video', getVideo(weex))
- }
-}