cbvirtua 1.0.109 → 1.0.115

package/better-scroll-dev/better-scroll-dev/packages/react-examples/public/static/css/stylesheet.css

@@ -1,241 +0,0 @@
-* {
-  box-sizing: border-box; }
-
-body {
-  padding: 0;
-  margin: 0;
-  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 16px;
-  line-height: 1.5;
-  background-color: #fff;
-  color: #606c71; }
-
-a {
-  color: #1e6bb8;
-  text-decoration: none; }
-  a:hover {
-    text-decoration: underline; }
-
-.btn {
-  display: inline-block;
-  margin-bottom: 1rem;
-  padding: 0.75rem 1rem;
-  color: rgba(255, 255, 255, 0.8);
-  background-color: rgba(255, 255, 255, 0.1);
-  border-color: rgba(255, 255, 255, 0.2);
-  border-style: solid;
-  border-width: 1px;
-  border-radius: 0.3rem;
-  transition: color 0.2s, background-color 0.2s, border-color 0.2s; }
-  .btn + .btn {
-    margin-left: 1rem; }
-
-.btn:hover {
-  color: rgba(255, 255, 255, 0.9);
-  text-decoration: none;
-  background-color: rgba(255, 255, 255, 0.2);
-  border-color: rgba(255, 255, 255, 0.3); }
-
-@media screen and (min-width: 42em) and (max-width: 64em) {
-  .btn {
-    font-size: 0.9rem; } }
-
-@media screen and (max-width: 42em) {
-  .btn {
-    display: block;
-    width: 100%;
-    padding: 0.75rem;
-    font-size: 0.9rem; }
-    .btn + .btn {
-      margin-top: 1rem;
-      margin-left: 0; } }
-
-.page-header {
-  color: #fff;
-  text-align: center;
-  font-family: 'Patrick Hand', cursive;
-  background-color: rgba(39,80,255, .7)}
-
-@media screen and (min-width: 64em) {
-  .page-header {
-    padding: 1.5rem 6rem 3rem 6rem; } }
-
-@media screen and (min-width: 42em) and (max-width: 64em) {
-  .page-header {
-    padding: 1.5rem 4rem 2rem 4rem; } }
-
-@media screen and (max-width: 42em) {
-  .page-header {
-    padding: 1.5rem 1rem 1rem 1rem; } }
-
-.project-name {
-  margin-top: 0;
-  margin-bottom: 0.1rem; }
-
-@media screen and (min-width: 64em) {
-  .project-name {
-    font-size: 3.25rem; } }
-
-@media screen and (min-width: 42em) and (max-width: 64em) {
-  .project-name {
-    font-size: 2.25rem; } }
-
-@media screen and (max-width: 42em) {
-  .project-name {
-    font-size: 1.75rem; } }
-
-.project-tagline {
-  margin-bottom: 1rem;
-  font-weight: normal;
-  opacity: 0.7; }
-
-@media screen and (min-width: 64em) {
-  .project-tagline {
-    font-size: 1.25rem; } }
-
-@media screen and (min-width: 42em) and (max-width: 64em) {
-  .project-tagline {
-    font-size: 1.15rem; } }
-
-@media screen and (max-width: 42em) {
-  .project-tagline {
-    font-size: 1rem; } }
-
-.main-content :first-child {
-  margin-top: 0; }
-.main-content img {
-  max-width: 100%; }
-.main-content h1, .main-content h2, .main-content h3, .main-content h4, .main-content h5, .main-content h6 {
-  margin-top: 1rem;
-  margin-bottom: 1rem; }
-.main-content code {
-  padding: 2px 4px;
-  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
-  font-size: 0.9rem;
-  color: #383e41;
-  background-color: #f3f6fa;
-  border-radius: 0.3rem; }
-.main-content pre {
-  padding: 0.8rem;
-  margin-top: 0;
-  margin-bottom: 1rem;
-  font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
-  color: #567482;
-  word-wrap: normal;
-  background-color: #f3f6fa;
-  border: solid 1px #dce6f0;
-  border-radius: 0.3rem; }
-  .main-content pre > code {
-    padding: 0;
-    margin: 0;
-    font-size: 0.9rem;
-    color: #567482;
-    word-break: normal;
-    white-space: pre;
-    background: transparent;
-    border: 0; }
-.main-content .highlight {
-  margin-bottom: 1rem; }
-  .main-content .highlight pre {
-    margin-bottom: 0;
-    word-break: normal; }
-.main-content .highlight pre, .main-content pre {
-  padding: 0.8rem;
-  overflow: auto;
-  font-size: 0.9rem;
-  line-height: 1.45;
-  border-radius: 0.3rem; }
-.main-content pre code, .main-content pre tt {
-  display: inline;
-  max-width: initial;
-  padding: 0;
-  margin: 0;
-  overflow: initial;
-  line-height: inherit;
-  word-wrap: normal;
-  background-color: transparent;
-  border: 0; }
-  .main-content pre code:before, .main-content pre code:after, .main-content pre tt:before, .main-content pre tt:after {
-    content: normal; }
-.main-content ul, .main-content ol {
-  margin-top: 0; }
-.main-content blockquote {
-  padding: 0 1rem;
-  margin-left: 0;
-  color: #819198;
-  border-left: 0.3rem solid #dce6f0; }
-  .main-content blockquote > :first-child {
-    margin-top: 0; }
-  .main-content blockquote > :last-child {
-    margin-bottom: 0; }
-.main-content table {
-  display: block;
-  width: 100%;
-  overflow: auto;
-  word-break: normal;
-  word-break: keep-all; }
-  .main-content table th {
-    font-weight: bold; }
-  .main-content table th, .main-content table td {
-    padding: 0.5rem 1rem;
-    border: 1px solid #e9ebec; }
-.main-content dl {
-  padding: 0; }
-  .main-content dl dt {
-    padding: 0;
-    margin-top: 1rem;
-    font-size: 1rem;
-    font-weight: bold; }
-  .main-content dl dd {
-    padding: 0;
-    margin-bottom: 1rem; }
-.main-content hr {
-  height: 2px;
-  padding: 0;
-  margin: 1rem 0;
-  background-color: #eff0f1;
-  border: 0; }
-
-@media screen and (min-width: 64em) {
-  .main-content {
-    padding: 2rem 8rem;
-    margin: 0 auto;
-    font-size: 1.1rem; } }
-
-@media screen and (min-width: 42em) and (max-width: 64em) {
-  .main-content {
-    padding: 2rem 2rem;
-    font-size: 1.1rem; } }
-
-@media screen and (max-width: 42em) {
-  .main-content {
-    padding: 1rem 1rem 2rem 1rem;
-    font-size: 1rem; }
-  iframe {
-    display: none
-  }
-}
-
-.site-footer {
-  padding-top: 2rem;
-  margin-top: 2rem;
-  border-top: solid 1px #d7d7d7; }
-
-.site-footer-owner {
-  display: block;
-  font-weight: bold; }
-
-.site-footer-credits {
-  color: #819198; }
-
-@media screen and (min-width: 64em) {
-  .site-footer {
-    font-size: 1rem; } }
-
-@media screen and (min-width: 42em) and (max-width: 64em) {
-  .site-footer {
-    font-size: 1rem; } }
-
-@media screen and (max-width: 42em) {
-  .site-footer {
-    font-size: 0.9rem; } }

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/App.js

@@ -1,109 +0,0 @@
-import { useHistory } from 'react-router-dom'
-
-import Router from './router'
-
-const examples = [
-  {
-    name: 'core scroll',
-    path: '/core/',
-  },
-  {
-    name: 'observe-dom',
-    path: '/observe-dom/',
-  },
-  {
-    name: 'observe-image',
-    path: '/observe-image/',
-  },
-  {
-    name: 'slide',
-    path: '/slide',
-  },
-  {
-    name: 'zoom',
-    path: '/zoom/',
-  },
-  {
-    name: 'picker',
-    path: '/picker/',
-  },
-  {
-    name: 'pullup',
-    path: '/pullup/',
-  },
-  {
-    name: 'pulldown',
-    path: '/pulldown/',
-  },
-  {
-    name: 'scrollbar',
-    path: '/scrollbar',
-  },
-  {
-    name: 'indicators',
-    path: '/indicators',
-  },
-  {
-    name: 'infinity',
-    path: '/infinity',
-  },
-  {
-    name: 'form',
-    path: '/form',
-  },
-  {
-    name: 'nested-scroll',
-    path: '/nested-scroll',
-  },
-  {
-    name: 'mouse-wheel',
-    path: '/mouse-wheel',
-  },
-  {
-    name: 'movable',
-    path: '/movable',
-  },
-  {
-    name: 'compose plugins',
-    path: '/compose',
-  },
-]
-
-const App = () => {
-  const history = useHistory()
-
-  const goPage = (path) => {
-    history.push(path)
-  }
-
-  return (
-    <>
-      <section className="page-header">
-        <h1 className="project-name">BetterScroll</h1>
-        <h2 className="project-tagline">
-          inspired by iscroll, and it has a better scroll perfermance
-        </h2>
-      </section>
-      <section className="main-content">
-        <div className="example">
-          <ul className="example-list">
-            {examples.map((item) => (
-              <li
-                key={item.name}
-                className="example-item"
-                onClick={() => goPage(item.path)}
-              >
-                <span>{item.name}</span>
-              </li>
-            ))}
-
-            <li className="example-item placeholder"></li>
-          </ul>
-        </div>
-      </section>
-      <Router />
-    </>
-  )
-}
-
-export default App

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/index.js

@@ -1,20 +0,0 @@
-import React from 'react'
-import ReactDOM from 'react-dom'
-import { HashRouter } from 'react-router-dom'
-
-import reportWebVitals from './reportWebVitals'
-import App from './App'
-
-import './index.styl'
-
-ReactDOM.render(
-  <HashRouter>
-    <App />
-  </HashRouter>,
-  document.getElementById('root')
-)
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals()

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/index.styl

@@ -1,63 +0,0 @@
-.page-header
-  h1
-    @media screen and (min-width 42rem)
-      margin-bottom 1rem
-
-    @media screen and (max-width 42rem)
-      margin-bottom 0.5rem
-
-.main-content
-  .site-footer
-    text-align center
-
-    @media screen and (max-width 42rem)
-      margin-top -1rem
-
-.example-list
-  display flex
-  justify-content space-between
-  flex-wrap wrap
-
-  @media screen and (min-width 42rem)
-    margin 2rem 0 2rem 0
-
-  @media screen and (max-width 42rem)
-    margin 1rem 0
-
-  .example-item
-    background-color $color-white
-    padding 0.8rem
-    border 1px solid rgba(0, 0, 0, 0.1)
-    box-shadow 0 1px 2px 0 rgba(0, 0, 0, 0.1)
-    text-align center
-    margin-bottom 1rem
-
-    &.placeholder
-      visibility hidden
-      height 0
-      margin 0
-      padding 0
-
-    @media screen and (min-width 42rem)
-      flex 0 1 28%
-
-    @media screen and (max-width 42rem)
-      flex 0 1 100%
-      margin-bottom 1rem
-
-.view
-  position fixed
-  top 0
-  left 0
-  bottom 0
-  right 0
-  z-index 1
-  padding 20px
-  background #fff
-  transform translate3d(0, 0, 0)
-
-  &.move-enter, &.move-leave-active
-    transform translate3d(100%, 0, 0)
-
-  &.move-enter-active, &.move-leave-active
-    transition transform 0.3s

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/compose/components/pullup-pulldown-outnested.js

@@ -1,226 +0,0 @@
-import React, { useState, useRef, useEffect, useCallback } from 'react'
-import BScroll from '@better-scroll/core'
-import PullDown from '@better-scroll/pull-down'
-import PullUp from '@better-scroll/pull-up'
-import NestedScroll from '@better-scroll/nested-scroll'
-
-BScroll.use(PullDown)
-BScroll.use(PullUp)
-BScroll.use(NestedScroll)
-
-const useStableCallback = (callback) => {
-  const callbackRef = useRef(callback)
-
-  useEffect(() => {
-    callbackRef.current = callback
-  })
-
-  return useCallback((...args) => callbackRef.current(...args), [])
-}
-
-const TIME_BOUNCE = 800
-const REQUEST_TIME = 3000
-const THRESHOLD = 70
-const STOP = 56
-
-const TOP_OUT_ITEMS = [
-  '😀  😁   😂  🤣   😃  🙃',
-  '👆🏻 Pull Down and refresh👆🏻',
-  '🙂  🤔   😄  🤨   😐  🙃',
-  '👆🏻 Pull Down and refresh👆🏻',
-  '😔  😕   🙃  🤑   😲  ☹️',
-  '🙂  🤔  😄  🤨   😐  🙃 ',
-  '👆🏻 Pull Down and refresh👆🏻',
-  '😔  😕   🙃  🤑   😲  ☹️ ',
-]
-
-const BOTTOM_OUT_ITEMS = [
-  '😀  😁   😂  🤣   😃  🙃',
-  '👆🏻 Pull Up and refresh👆🏻',
-  '🙂  🤔   😄  🤨   😐  🙃',
-  '👆🏻 Pull Up and refresh👆🏻',
-  '😔  😕   🙃  🤑   😲  ☹️',
-  '🙂  🤔  😄  🤨   😐  🙃 ',
-  '👆🏻 Pull Up and refresh👆🏻',
-  '😔  😕   🙃  🤑   😲  ☹️ ',
-]
-
-const INNER_ITEMS = [
-  'The Mountain top of Inner',
-  '😀 😁 😂 🤣 😃 🙃 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🙂 🤔 😄 🤨 😐 🙃 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '😔 😕 🙃 🤑 😲 ☹️ ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🐣 🐣 🐣 🐣 🐣 🐣 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🐥 🐥 🐥 🐥 🐥 🐥 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🤓 🤓 🤓 🤓 🤓 🤓 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🦔 🦔 🦔 🦔 🦔 🦔 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🙈 🙈 🙈 🙈 🙈 🙈 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '🚖 🚖 🚖 🚖 🚖 🚖 ',
-  '👆🏻 inner scroll 👇🏻 ',
-  '✌🏻 ✌🏻 ✌🏻 ✌🏻 ✌🏻 ✌🏻 ',
-  'The Mountain foot of Inner',
-]
-
-const ajaxGet = (/* url */) => {
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve({
-        topOutItems: TOP_OUT_ITEMS,
-        bottomOutItems: BOTTOM_OUT_ITEMS,
-      })
-    }, REQUEST_TIME)
-  })
-}
-
-const PullUpPullDownNestedScroll = () => {
-  const [beforePullDown, setBeforePullDown] = useState(true)
-  const [isPullingDown, setIsPullingDown] = useState(false)
-  const [isPullUpLoad, setIsPullUpLoad] = useState(false)
-  const [topOutItems, setTopOutItems] = useState(TOP_OUT_ITEMS)
-  const [bottomOutItems, setBottomOutItems] = useState(BOTTOM_OUT_ITEMS)
-
-  const wrapperRef = useRef(null)
-  const innerRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  const requestData = async (type) => {
-    try {
-      const { topOutItems, bottomOutItems } = await ajaxGet(/* url */)
-      if (type === 'load') {
-        setBottomOutItems((prev) => bottomOutItems.concat(prev))
-      } else {
-        setTopOutItems(topOutItems)
-        setBottomOutItems(bottomOutItems)
-      }
-    } catch (err) {
-      // handle err
-      console.log(err)
-    }
-  }
-  const finishPullDown = () => {
-    scrollRef.current.finishPullDown()
-    setTimeout(() => {
-      setBeforePullDown(true)
-      scrollRef.current.refresh()
-    }, TIME_BOUNCE + 100)
-  }
-
-  const pullingDownHandler = useStableCallback(async () => {
-    setBeforePullDown(false)
-    setIsPullingDown(true)
-    await requestData('refresh')
-    setIsPullingDown(false)
-    finishPullDown()
-  })
-
-  const pullingUpHandler = useStableCallback(async () => {
-    setIsPullUpLoad(true)
-    await requestData('load')
-    scrollRef.current.finishPullUp()
-    scrollRef.current.refresh()
-    setIsPullUpLoad(false)
-  })
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      const BS = (scrollRef.current = new BScroll(wrapperRef.current, {
-        nestedScroll: {
-          groupId: 'pullup-pullldown',
-        },
-        bounceTime: TIME_BOUNCE,
-        // pullDown options
-        pullDownRefresh: {
-          threshold: THRESHOLD,
-          stop: STOP,
-        },
-        // pullUp options
-        pullUpLoad: {
-          threshold: THRESHOLD,
-        },
-      }))
-
-      BS.on('pullingDown', pullingDownHandler)
-      BS.on('pullingUp', pullingUpHandler)
-      BS.on('scroll', (pos) => {
-        console.log(pos.y)
-      })
-
-      new BScroll(innerRef.current, {
-        nestedScroll: {
-          groupId: 'pullup-pullldown',
-        },
-        // close bounce effects
-        bounce: {
-          top: false,
-          bottom: false,
-        },
-      })
-    }
-  }, [pullingDownHandler, pullingUpHandler])
-
-  return (
-    <div className="pullup-pulldown-outnested view">
-      <div className="outer-wrapper" ref={wrapperRef}>
-        <div className="outer-content">
-          <div className="pulldown-wrapper">
-            <div style={{ display: beforePullDown ? '' : 'none' }}>
-              <span>Pull Down and refresh</span>
-            </div>
-            <div style={{ display: beforePullDown ? 'none' : '' }}>
-              <div v-show="isPullingDown">
-                <span>Loading...</span>
-              </div>
-              <div style={{ display: isPullingDown ? 'none' : '' }}>
-                <span>Refresh success</span>
-              </div>
-            </div>
-          </div>
-          <ul>
-            {topOutItems.map((item, index) => (
-              <li key={index} className="outer-list-item">
-                {item}
-              </li>
-            ))}
-          </ul>
-          <div className="inner-wrapper" ref={innerRef}>
-            <ul className="inner-content">
-              {INNER_ITEMS.map((item, index) => (
-                <li key={index} className="inner-list-item">
-                  {item}
-                </li>
-              ))}
-            </ul>
-          </div>
-          <ul>
-            {bottomOutItems.map((item, index) => (
-              <li key={index} className="outer-list-item2">
-                {item}
-              </li>
-            ))}
-          </ul>
-          <div className="pullup-wrapper">
-            {isPullUpLoad ? (
-              <div>
-                <span>Loading...</span>
-              </div>
-            ) : (
-              <div>
-                <span>Pull Up and load</span>
-              </div>
-            )}
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default PullUpPullDownNestedScroll