├── .browserslistrc ├── .circleci └── config.yml ├── .editorconfig ├── .eslintrc.js ├── .gitignore ├── .npmignore ├── README.md ├── UI ├── assets │ ├── arrow-left.svg │ ├── arrow-right.svg │ ├── error-bg.png │ ├── error-icon.png │ ├── error-icon.svg │ ├── error-icon@2x.png │ ├── fullscreen.svg │ ├── logo.png │ ├── mute.svg │ ├── off-fullscreen.svg │ ├── pause.svg │ ├── play.svg │ ├── settings.svg │ ├── volume.svg │ ├── vue-core-video-player-logo-white.png │ └── vue-core-video-player-logo@2x.png ├── error-icon.svg ├── ui.png └── vue-core-video-player-xd.xd ├── babel.config.js ├── docs ├── README.md ├── en │ └── README.md ├── jp │ └── README.md └── zh-CN │ └── README.md ├── package-lock.json ├── package.json ├── postcss.config.js ├── public ├── cover01.jpg ├── favicon.ico ├── index.html ├── logo-white.png ├── source.js └── videos │ ├── 5-cm.mp4 │ └── the_garden_of_words_trailer_english__1080p.mp4 ├── src ├── App.vue ├── assets │ └── logo.png ├── constants │ ├── DEFAULT_CONFIG.js │ ├── ERROR_CODE.js │ ├── EVENTS.js │ └── index.js ├── core │ ├── base.js │ └── index.js ├── dashboard │ ├── controls.vue │ ├── dashboard.vue │ ├── fullscreen.vue │ ├── mobile-controls.vue │ ├── mobile-dashboard.vue │ ├── picture-in-picture.vue │ ├── play-pause-control.vue │ ├── progress.vue │ ├── settings.vue │ ├── time-span.vue │ └── volume.vue ├── directives │ ├── i18n.js │ └── index.js ├── helper │ ├── dom.js │ ├── error.js │ ├── i18n.js │ ├── index.js │ ├── media.js │ ├── type.js │ └── util.js ├── index.js ├── lang │ ├── en.json │ ├── jp.json │ └── zh-cn.json ├── layers │ ├── cover-layer.vue │ ├── error-layer.vue │ ├── layers.vue │ ├── loading-layer.vue │ ├── logo-layer.vue │ ├── play-pause-layer.vue │ └── title-layer.vue ├── main.js ├── mixins.js ├── plugins │ ├── i18n.js │ └── index.js ├── style │ ├── animate.less │ ├── common.less │ └── variable.less ├── vue-core-video-player.vue └── widgets │ └── setting-switch.vue └── vue.config.js /.browserslistrc: -------------------------------------------------------------------------------- 1 | > 1% 2 | last 2 versions 3 | -------------------------------------------------------------------------------- /.circleci/config.yml: -------------------------------------------------------------------------------- 1 | # Javascript Node CircleCI 2.0 configuration file 2 | version: 2 3 | jobs: 4 | build: 5 | docker: 6 | # specify the version you desire here 7 | - image: circleci/node:10-browsers 8 | 9 | working_directory: ~/repo 10 | 11 | steps: 12 | - checkout 13 | 14 | # Download and cache dependencies 15 | - restore_cache: 16 | keys: 17 | - v1-dependencies-{{ checksum "package.json" }} 18 | # fallback to using the latest cache if no exact match is found 19 | - v1-dependencies- 20 | 21 | - run: npm install 22 | 23 | - save_cache: 24 | paths: 25 | - node_modules 26 | key: v1-dependencies-{{ checksum "package.json" }} 27 | # run tests! 28 | - run: npm run lint -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | [*.{js,jsx,ts,tsx,vue}] 2 | indent_style = space 3 | indent_size = 2 4 | trim_trailing_whitespace = true 5 | insert_final_newline = true 6 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | env: { 4 | node: true 5 | }, 6 | extends: [ 7 | 'plugin:vue/essential', 8 | '@vue/standard' 9 | ], 10 | globals: { 11 | 'Vue': true 12 | }, 13 | rules: { 14 | 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' 15 | }, 16 | parserOptions: { 17 | parser: 'babel-eslint' 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | npm-debug.log 4 | dist 5 | .idea/ -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | UI 2 | public -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-core-video-player 2 | 3 | [![CircleCI](https://circleci.com/gh/core-player/vue-core-video-player.svg?style=shield)](https://circleci.com/gh/core-player/vue-core-video-player) 4 | [![prs welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](https://github.com/core-player/vue-core-video-player/pulls) 5 | [![npm version](https://img.shields.io/npm/v/vue-core-video-player.svg?style=flat-square)](https://www.npmjs.com/package/vue-core-video-player) 6 | [![npm downloads](https://img.shields.io/npm/dm/vue-core-video-player.svg?style=flat-square)](https://www.npmjs.com/package/vue-core-video-player) 7 | [![Twitter URL](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/hashtag/vueCoreVideoPlayer?src=hashtag_click) 8 | 9 | 10 | 11 | A Lightweight Video Player For Vue.js. 12 | 13 | 14 | ## Get Started 15 | 16 | ### Npm 17 | 18 | ``` bash 19 | $ npm install vue-core-video-player --save 20 | ``` 21 | 22 | ### Yarn 23 | 24 | ``` bash 25 | $ yarn add vue-core-video-player --save 26 | ``` 27 | 28 | 29 | ``` vue 30 |