Mirrors/uppy
1
0
Fork 0
mirror of https://github.com/transloadit/uppy.git synced 2026-07-22 17:58:05 +00:00
Code Issues Projects Releases Wiki Activity

website: add facebook to dashboard example

Browse source
This commit is contained in:
ifedapoolarewaju 2019-11-04 15:25:09 +01:00
parent 13ad48c1f5
commit 83d3fcb4e4
No known key found for this signature in database
GPG key ID: FF050AA4EEBCE82E
4 changed files with 23 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

9
website/src/examples/dashboard/app.es6
View file

@ -5,6 +5,7 @@ const Dashboard = require('@uppy/dashboard')
const GoogleDrive = require('@uppy/google-drive')
const Dropbox = require('@uppy/dropbox')
const Instagram = require('@uppy/instagram')
const Facebook = require('@uppy/facebook')
const Url = require('@uppy/url')
const Webcam = require('@uppy/webcam')
const Tus = require('@uppy/tus')
@ -106,6 +107,14 @@ function uppySetOptions () {
window.uppy.removePlugin(UrlInstance)
}
const FacebookInstance = window.uppy.getPlugin('Facebook')
if (opts.Facebook && !FacebookInstance) {
uppy.use(Facebook, { target: Dashboard, companionUrl: COMPANION })
}
if (!opts.Facebook && FacebookInstance) {
window.uppy.removePlugin(FacebookInstance)
}
const WebcamInstance = window.uppy.getPlugin('Webcam')
if (opts.Webcam && !WebcamInstance) {
window.uppy.use(Webcam, { target: Dashboard, companionUrl: COMPANION })

3
website/src/examples/dashboard/app.html
View file

@ -13,6 +13,7 @@
<li><label for="opts-GoogleDrive"><input type="checkbox" id="opts-GoogleDrive" checked/> Google Drive</label></li>
<li><label for="opts-Dropbox"><input type="checkbox" id="opts-Dropbox" checked/> Dropbox</label></li>
<li><label for="opts-Instagram"><input type="checkbox" id="opts-Instagram" checked/> Instagram</label></li>
<li><label for="opts-Facebook"><input type="checkbox" id="opts-Facebook" checked/> Facebook</label></li>
<li><label for="opts-Url"><input type="checkbox" id="opts-Url" checked/> Url</label></li>
</ul>
@ -38,6 +39,7 @@
GoogleDrive: document.querySelector('#opts-GoogleDrive'),
Dropbox: document.querySelector('#opts-Dropbox'),
Instagram: document.querySelector('#opts-Instagram'),
Facebook: document.querySelector('#opts-Facebook'),
Url: document.querySelector('#opts-Url'),
autoProceed: document.querySelector('#opts-autoProceed'),
restrictions: document.querySelector('#opts-restrictions'),
@ -50,6 +52,7 @@
GoogleDrive: true,
Instagram: true,
Dropbox: true,
Facebook: false,
Url: true,
autoProceed: false,
restrictions: false,

2
website/src/examples/dashboard/index.ejs
View file

@ -27,6 +27,7 @@ const Dashboard = require('@uppy/dashboard')
const GoogleDrive = require('@uppy/google-drive')
const Dropbox = require('@uppy/dropbox')
const Instagram = require('@uppy/instagram')
const Facebook = require('@uppy/facebook')
const Webcam = require('@uppy/webcam')
const Tus = require('@uppy/tus')
@ -57,6 +58,7 @@ const uppy = Uppy({
.use(GoogleDrive, { target: Dashboard, companionUrl: 'https://companion.uppy.io' })
.use(Dropbox, { target: Dashboard, companionUrl: 'https://companion.uppy.io' })
.use(Instagram, { target: Dashboard, companionUrl: 'https://companion.uppy.io' })
.use(Facebook, { target: Dashboard, companionUrl: 'https://companion.uppy.io' })
.use(Webcam, { target: Dashboard })
.use(Tus, { endpoint: 'https://master.tus.io/files/' })

18
website/themes/uppy/layout/partials/frontpage-code-sample.html
View file

@ -1,22 +1,22 @@
<figure class="highlight bash"><table><tbody><tr><td class="code"><pre>$ <span class="token function">npm</span> <span class="token function">install</span> @uppy/core @uppy/dashboard @uppy/instagram @uppy/tus </pre></td></tr></tbody></table></figure>
<figure class="highlight js"><table><tbody><tr><td class="code"><pre><span class="token keyword">import</span> Uppy <span class="token keyword">from</span> <span class="token string">&apos;@uppy/core&apos;</span>
<span class="token keyword">import</span> Dashboard <span class="token keyword">from</span> <span class="token string">&apos;@uppy/dashboard&apos;</span>
<span class="token keyword">import</span> Instagram <span class="token keyword">from</span> <span class="token string">&apos;@uppy/instagram&apos;</span>
<span class="token keyword">import</span> Tus <span class="token keyword">from</span> <span class="token string">&apos;@uppy/tus&apos;</span>
<figure class="highlight js"><table><tbody><tr><td class="code"><pre><span class="token keyword">import</span> Uppy <span class="token keyword">from</span> <span class="token string">'@uppy/core'</span>
<span class="token keyword">import</span> Dashboard <span class="token keyword">from</span> <span class="token string">'@uppy/dashboard'</span>
<span class="token keyword">import</span> Instagram <span class="token keyword">from</span> <span class="token string">'@uppy/instagram'</span>
<span class="token keyword">import</span> Tus <span class="token keyword">from</span> <span class="token string">'@uppy/tus'</span>
<span class="token function">Uppy</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">use</span><span class="token punctuation">(</span>Dashboard<span class="token punctuation">,</span> <span class="token punctuation">{</span>
trigger<span class="token punctuation">:</span> <span class="token string">&apos;#select-files&apos;</span><span class="token punctuation">,</span>
trigger<span class="token punctuation">:</span> <span class="token string">'#select-files'</span><span class="token punctuation">,</span>
showProgressDetails<span class="token punctuation">:</span> <span class="token boolean">true</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">use</span><span class="token punctuation">(</span>Instagram<span class="token punctuation">,</span> <span class="token punctuation">{</span>
target<span class="token punctuation">:</span> Dashboard<span class="token punctuation">,</span>
companionUrl<span class="token punctuation">:</span> <span class="token string">&apos;https://companion.uppy.io&apos;</span>
companionUrl<span class="token punctuation">:</span> <span class="token string">'https://companion.uppy.io'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">use</span><span class="token punctuation">(</span>Tus<span class="token punctuation">,</span> <span class="token punctuation">{</span> endpoint<span class="token punctuation">:</span> <span class="token string">&apos;https://master.tus.io/files/&apos;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">&apos;complete&apos;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">result</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">&apos;Upload result:&apos;</span><span class="token punctuation">,</span> result<span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">use</span><span class="token punctuation">(</span>Tus<span class="token punctuation">,</span> <span class="token punctuation">{</span> endpoint<span class="token punctuation">:</span> <span class="token string">'https://master.tus.io/files/'</span> <span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">'complete'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">result</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">'Upload result:'</span><span class="token punctuation">,</span> result<span class="token punctuation">)</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span></pre></td></tr></tbody></table></figure>
<script>
document.querySelectorAll('.github-emoji')