https://github.com/floedelmann/embetty-vue
Embetty displays remote content like tweets or YouTube videos without compromising your privacy.
https://github.com/floedelmann/embetty-vue
embetty hacktoberfest privacy tweets twitter video vimeo vimeo-player vue vuejs youtube youtube-player
Last synced: 5 months ago
JSON representation
Embetty displays remote content like tweets or YouTube videos without compromising your privacy.
- Host: GitHub
- URL: https://github.com/floedelmann/embetty-vue
- Owner: FloEdelmann
- Created: 2018-07-30T21:58:06.000Z (almost 7 years ago)
- Default Branch: main
- Last Pushed: 2024-11-18T07:33:03.000Z (8 months ago)
- Last Synced: 2024-11-24T19:55:53.588Z (8 months ago)
- Topics: embetty, hacktoberfest, privacy, tweets, twitter, video, vimeo, vimeo-player, vue, vuejs, youtube, youtube-player
- Language: Vue
- Homepage:
- Size: 1.46 MB
- Stars: 9
- Watchers: 4
- Forks: 5
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# embetty-vue [](https://www.npmjs.com/package/embetty-vue)
Embetty displays remote content like tweets or videos without compromising your privacy.
This is a Vue.js alternative to the original [embetty](https://github.com/heiseonline/embetty) implementation (which is based on Web Components). To use it, you need to have a [embetty server](https://github.com/heiseonline/embetty-server) up and running.
## Usage
### Setup when using a bundler (webpack, rollup, etc.)
```js
import Vue from 'vue';
import EmbettyVue from 'embetty-vue';
const Vue = require('vue');
const { EmbettyVue } = require('embetty-vue');
Vue.use(EmbettyVue, {
// optional, but recommended
serverUrl: '/path/to/embetty-server', // without trailing slash
// optional
posterImageMode: 'cover' // or 'contain'
});
```
The CSS can be imported from `embetty-vue/dist/embetty-vue.css`.
### Setup when directly linking the files
In your HTML head:
```html
```
You can link to the files without `.min` for debugging.
### Using the components
```html
```
If you didn't specify the server URL globally (either the options passed to `Vue.use` or the `` tag), you must specify it on every component:
```html
```
See [`src/App.vue`](src/App.vue) for a lot of examples and component options.
## Differences to original implementation
*embetty-vue*'s `` component supports type `native`: Provide an URL to a video file as `video-id` to load it on click in a `` HTML element.
## Development
### Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run watch
```
### Compiles and minifies for production
```
npm run build
```