Code Monkey home page Code Monkey logo

content-video-storage's Introduction

Video Storage

Introduction

The Video Storage Template was created to showcase how a file from Rise Stroage can be levered in a HTML page. A preview of the template can be seen here: http://rise-vision.github.io/content-video-storage/index.html

##Steps to run the Video Storage Template:##

  1. Fork or download the entire content-video-storage repository.
    alt tag

  2. Modify the files within the content-video-storage folder directory to fit your needs (see below on how to modify specific elements).
    alt tag

  3. Host the entire “content-video-storage” folder directory in rise vision storage or your web hosting service.
    alt tag

  4. Copy the link to the index.html file where you have it hosted and insert the url into a schedule. (you can also add this link to the url gadget within a presentation)
    alt tag

##Directions to Modify the Video Storage Template:##

####Changing the Text Content Open index.html, the text content is nested within the following div <div class="wrapper">. Modify the h1 tags within this div to meet your needs. The tag line is held by a span tag called <span class="tag-line">.

The style of the text content is controlled within css/style.css.

####Changing the Video / Text Transitions The Video Storage Template leverages a jquery plugin called Bigvideo.js to fit-to-fill videos to the background. The main controls and variables can be changed within js/bigvideo.js Detailed documentaion can be found on their github repo: https://github.com/dfcb/BigVideo.js

A detailed tutorial on how the text and video slideshow were implemented can be seen here: http://tympanus.net/codrops/2012/09/19/fullscreen-video-slideshow-with-bigvideo-js/

####Changing the Videos (rise-storage web component) All the videos in the Video Storage Template are hosted on Rise Vision Storage https://storage.risevision.com/ using the rise-storage web component. Detailed instructions on how to configure this component can be found in the readme of the github repo: https://github.com/Rise-Vision/web-component-rise-storage

Built With

actual tools used

  • HTML
  • CSS
  • Javascript
  • Jquery
  • BigVideo.js
  • rise-storage Web Component

Video Storage Template works in conjunction with Rise Vision, the digital signage management application that runs on Google Cloud.

At this time Chrome is the only browser that this project and Rise Vision supports.

Submitting Issues

If you encounter problems or find defects we really want to hear about them. If you could take the time to add them as issues to this Repository it would be most appreciated. Please Identify the specific template that has the issue and follow the following format where applicable:

Reproduction Steps

  1. did this
  2. then that
  3. followed by this (screenshots / video captures always help)

Expected Results

What you expected to happen.

Actual Results

What actually happened. (screenshots / video captures always help)

Contributing

All contributions are greatly appreciated and welcome! If you would first like to sound out your contribution ideas please post your thoughts to our community, otherwise submit a pull request and we will do our best to incorporate it.

Suggested Contributions

  • Alternative ways to do video transitions
  • Auto loop video rotation on timed interval
  • i18n Language Support

Resources

If you have any questions or problems please don't hesitate to join our lively and responsive community at http://community.risevision.com.

If you are looking for user documentation on Rise Vision please see http://www.risevision.com/help/users/

If you would like more information on developing applications for Rise Vision please visit http://www.risevision.com/help/developers/.

If you have any questions or problems please don't hesitate to join our lively and responsive community at http://community.risevision.com.

Additional Content Templates can be found here: https://github.com/Rise-Vision/content-templates

Facilitator

Mathew Meiers

content-video-storage's People

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.