# Loading a video stored locally on the PC

**URL:** <https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646>\
**Category:** Beginners\
**Created:** [March 26, 2019, 3:07pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646 "2019-03-26T15:07:06Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![basicvisual](https://avatars.discourse-cdn.com/v4/letter/b/9dc877/32.png) [@basicvisual](https://discourse.processing.org/u/basicvisual)\
**Post date:** [March 26, 2019, 3:07pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/1 "2019-03-26T15:07:06Z")

</div>

Hello ,  
I am trying to load a video to the canvas which is stored locally . I went to the drop down menu and uploaded a small video , named test.mp4. I used the example code to run the video but i seem to get a blank screen . I am not sure if this is the right way to upload a video stored locally ,

 ![Capture](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/b64874d3e51b32dc04b8a2024850e83d8c6a3563.jpeg)

```auto
let video ;
function setup() {
  createCanvas(400, 400);

  video = createVideo('test.mp4');
  
}

function draw() {
  background(220);
image(video, 150, 150);

 function mousePressed() {
  video.loop(); // set the video to loop and start playing
}

  
}

```

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [March 26, 2019, 3:59pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/2 "2019-03-26T15:59:36Z")

</div>

-a- i used my own files  
as you not give the link  
-b- download from internet and upload to /data/ ( learned about a 5mb limit )  
-c- take the mousePressed out of draw loop  
-d- use the onLoad function but not play  
as you want click with mouse…and use loop

‘here’ it works:  
[https://editor.p5js.org/kll/sketches/HvnFi2gPc](https://editor.p5js.org/kll/sketches/HvnFi2gPc)

i change your title to p5.js

---

<div class="post-metadata">

**Author:** ![basicvisual](https://avatars.discourse-cdn.com/v4/letter/b/9dc877/32.png) [@basicvisual](https://discourse.processing.org/u/basicvisual)\
**Post date:** [March 26, 2019, 4:34pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/3 "2019-03-26T16:34:59Z")

</div>

Thank you so much ! It was a file of size 3mb and it worked .

---

<div class="post-metadata">

**Author:** ![basicvisual](https://avatars.discourse-cdn.com/v4/letter/b/9dc877/32.png) [@basicvisual](https://discourse.processing.org/u/basicvisual)\
**Post date:** [March 26, 2019, 7:28pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/4 "2019-03-26T19:28:43Z")

</div>

Hi,  
I have a follow up question. if i have long videos that i need to load from the local drive (Bigger than 10 Mb). What is the best way to do so . Having a folder stored locally on the disk with many videos

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [March 27, 2019, 1:42am UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/5 "2019-03-27T01:42:47Z")

</div>

the 5mb limit has nothing to do with processing ( or p5.js )  
only with the free learn account at [p5js.org](http://p5js.org).

you use the word ‘local’ related to p5.js?

-a- besides that limited account at [p5js.org](http://p5js.org)

-b- if you want to test p5.js code can use  
processing IDE ( p5.js mode ) and a sub /data/ for first test,  
and then change the filename/path of the videos  
to any other directory on your computer where more video files are.

-c- for a “production” installation you would need a server  
and copy the p5.js libraries …  
like all what you got when at [p5js.org](http://p5js.org) you press the download button

- for home use any computer in your network
- for web use a web-space account  
and if the video file are stored and served from that web space account  
you usually pay for the storage GB and the streaming GB.

---

<div class="post-metadata">

**Author:** ![basicvisual](https://avatars.discourse-cdn.com/v4/letter/b/9dc877/32.png) [@basicvisual](https://discourse.processing.org/u/basicvisual)\
**Post date:** [March 27, 2019, 1:08pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/6 "2019-03-27T13:08:49Z")

</div>

Hi just to understand it properly , you mean to say

a) To use processing IDE instead of using the web browser ?  
b) Can i use for example in your code instead of var videofile = `'data/big_buck_bunny.ogv'` use absolute file such as `var videofile = 'file:///C:/personal/vidz/test.mp4';`

Thanks for the other infos, i am trying to understand them one by one

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [March 27, 2019, 1:27pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646/7 "2019-03-27T13:27:47Z")

</div>

> [@basicvisual](#):
>
> a) To use processing IDE instead of using the web browser ?

that is not correct wording, as

> processing IDE ( p5.js mode )

again is using the browser ( for creating the canvas ) but run and load from your PC  
so yes, you might be able to use a path ( filename from your local drive )

\_ HOW TO \_\_\_\_\_\_\_\_\_\_\_\_

 ![SNAG-0025](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/8/8cd371d6e958ac3481527532e175eb03367e87b9.jpeg) ![SNAG-0026](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/7df9f79c53799797c147687c2b81178a2a1dac5f.jpeg)  
test a example ( might need to close open IDE )  
 ![SNAG-0027](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/0/04cb444fea4f982c303ec7fa4c8de7717b8bba38.jpeg)