Skip to content
This repository has been archived by the owner on Jan 17, 2021. It is now read-only.

Commit

Permalink
Merge branch 'slider'
Browse files Browse the repository at this point in the history
  • Loading branch information
crossjs committed Nov 1, 2016
2 parents 138231f + aa43e1b commit a6e7a76
Show file tree
Hide file tree
Showing 3 changed files with 122 additions and 122 deletions.
16 changes: 8 additions & 8 deletions src/components/c-slider.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,10 +62,10 @@ export default {
computed: {
prevIndex () {
return this.slideCount ? (this.slideCount + this.currIndex - 1) % this.slideCount : 0
return this.slideCount ? (this.slideCount + this.currIndex - 1) % this.slideCount : -1
},
nextIndex () {
return this.slideCount ? (this.currIndex + 1) % this.slideCount : 0
return this.slideCount ? (this.currIndex + 1) % this.slideCount : -1
}
},
Expand All @@ -84,17 +84,17 @@ export default {
this.currIndex = val
},
prevIndex (val, old) {
this.slideCount && this.children[old].classList.remove(classes.prev)
this.slideCount && this.children[val].classList.add(classes.prev)
this.slideCount && old !== -1 && this.children[old].classList.remove(classes.prev)
this.slideCount && val !== -1 && this.children[val].classList.add(classes.prev)
},
currIndex (val, old) {
// this.slideReady = true
this.slideCount && this.children[old].classList.remove(classes.active)
this.slideCount && this.children[val].classList.add(classes.active)
},
nextIndex (val, old) {
this.slideCount && this.children[old].classList.remove(classes.next)
this.slideCount && this.children[val].classList.add(classes.next)
this.slideCount && old !== -1 && this.children[old].classList.remove(classes.next)
this.slideCount && val !== -1 && this.children[val].classList.add(classes.next)
},
interval () {
this.automate()
Expand Down Expand Up @@ -172,14 +172,14 @@ export default {
},
go (index) {
this.slideReady = false
setTimeout(() => {
this.$nextTick(() => {
this.offset = 0
if (index !== this.currIndex) {
this.currIndex = index
this.$emit('slide', this.currIndex)
}
this.slideReady = true
}, 0)
})
}
}
}
Expand Down
4 changes: 2 additions & 2 deletions src/demos/slider.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<p>Single slide</p>
<c-slider
:transition="transition">
<div class="d-slider-item">Single</div>
<div class="d-slider-item">Single Slide</div>
</c-slider>
<hr>
<p>Two slides</p>
Expand All @@ -16,6 +16,7 @@
<hr>
<p>Three slides</p>
<c-slider
:index="1"
:transition="transition">
<div class="d-slider-item">Slide First</div>
<div class="d-slider-item">Slide Second</div>
Expand All @@ -40,7 +41,6 @@
<c-slider
:transition="transition"
:index="index"
:interval="3"
@slide="slide">
<div v-for="i in items" class="d-slider-item">Slide {{i}}</div>
</c-slider>
Expand Down
224 changes: 112 additions & 112 deletions src/views/demos.vue
View file
Original file line number Diff line number Diff line change
@@ -1,117 +1,117 @@
<template>
<div class="v-demos">
<keep-alive>
<div class="v-demos" v-if="!$route.params.component">
<c-row :link="true">
<c-col>
<router-link to="demos/icon">
<c-icon>flame</c-icon> Icon</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/badge">
<c-icon>flame</c-icon> Badge</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/progress">
<c-icon>flame</c-icon> Progress</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/button">
<c-icon>flame</c-icon> Button</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/link">
<c-icon class="c-reddot">flame</c-icon> Link</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/form">
<c-icon>flame</c-icon> Form</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/row">
<c-icon>flame</c-icon> Row</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/paginator">
<c-icon>flame</c-icon> Paginator</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/spinner">
<c-icon>flame</c-icon> Spinner</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/modal">
<c-icon>flame</c-icon> Modal</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/toast">
<c-icon>flame</c-icon> Toast</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/image">
<c-icon>flame</c-icon> Image</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/avatar">
<c-icon class="c-reddot">flame</c-icon> Avatar</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/scroller">
<c-icon>flame</c-icon> Scroller: pulling and infinite scroll</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/picker">
<c-icon>flame</c-icon> Picker</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/range">
<c-icon>flame</c-icon> Range</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/slider">
<c-icon>flame</c-icon> Slider</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/upload">
<c-icon>flame</c-icon> Uploader</router-link>
</c-col>
</c-row>
</div>
<component v-else :is="'demo-' + $route.params.component"></component>
<div class="v-demos" v-if="!$route.params.component">
<c-row :link="true">
<c-col>
<router-link to="demos/icon">
<c-icon>flame</c-icon> Icon</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/badge">
<c-icon>flame</c-icon> Badge</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/progress">
<c-icon>flame</c-icon> Progress</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/button">
<c-icon>flame</c-icon> Button</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/link">
<c-icon class="c-reddot">flame</c-icon> Link</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/form">
<c-icon>flame</c-icon> Form</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/row">
<c-icon>flame</c-icon> Row</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/paginator">
<c-icon>flame</c-icon> Paginator</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/spinner">
<c-icon>flame</c-icon> Spinner</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/modal">
<c-icon>flame</c-icon> Modal</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/toast">
<c-icon>flame</c-icon> Toast</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/image">
<c-icon>flame</c-icon> Image</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/avatar">
<c-icon class="c-reddot">flame</c-icon> Avatar</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/scroller">
<c-icon>flame</c-icon> Scroller: pulling and infinite scroll</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/picker">
<c-icon>flame</c-icon> Picker</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/range">
<c-icon>flame</c-icon> Range</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/slider">
<c-icon>flame</c-icon> Slider</router-link>
</c-col>
</c-row>
<c-row :link="true">
<c-col>
<router-link to="demos/upload">
<c-icon>flame</c-icon> Uploader</router-link>
</c-col>
</c-row>
</div>
<keep-alive v-else>
<component :is="'demo-' + $route.params.component"></component>
</keep-alive>
</div>
</template>
Expand Down

0 comments on commit a6e7a76

Please sign in to comment.