Giter Club home page Giter Club logo

lexavideo's Introduction

Introduction

NOTE: As of Oct 31 2017 google has depreciated the Channel API that this application relied on, and therefore many functions are currently broken.

Overview

LexaVideo provides the source code for running a fully responsive web-app that features real-time browser-based video conferencing and text chat.

This software relies on WebRTC for the video functionality, and is built using AngularJS and Python. This software runs on Google AppEngine.

Demo

LexaVideo was originally developed for ChatSurfing.com. Check out ChatSurfing.com for an active demo of this source code in action.

Quick Start

Before running LexaVideo

LexaVideo requires that Python and the Google AppEngine are installed on your local computer. This software was tested with AppEngine release 1.9.20, and Python 2.7

LexaVideo uses yeoman, grunt, and bower as part of our build system. Make sure that you have node.js installed, and are able to execute grunt.

How to run LexaVideo

LexaVideo has been tested on OSX and Linux. Use a unix shell to execute the following commands:

  1. In the first unix shell, cd into the client directory, and then run 'grunt serve'. If you forget to do this, then you may not be able to load css files and other strange behaviour may happen.
  2. In a second unix shell, from the project base directory, run './run_app.py .' (don't forget the '.' at the end).
  3. In your browser, open localhost:8080

Code Structure

Server-side Code

The server-side (python) code is contained in the 'video_src' directory

Client-side Code

The client-side code is located in the 'client/app' directory. Within this directory, you will find the following directories of interest:

  1. bower_components: Contains AngularJS, Bootstrap, and many other open-source projects that we rely on.
  2. images: Logos, icons, etc.
  3. lx-templates: Our custom html templates.
  4. scripts: The directory that contains the client-side javascript code. This is broken into sub-directories that follow AngularJS terminology.
  5. sounds: This contains mp3 sounds that are not currently used.
  6. styles: The SASS (CSS) styles that define how our website looks.

Here you will also find index.html, which is the parent html file that imports all javascript, css, and other html.

Releasing code to a production server

General information about uploading

While it is possible to directly upload code that runs directly from the 'client/app' directory (where we have our client-side 'source' files), for performance reasons this is not advisable. Instead one should ensure that files that will be used in production are combined, minimized, and compressed. This is where grunt is very helpful, and where we have provided scripts to help ensure that optimized files are updated.

Building code before uploading

From the project home, you can execute the file 'build_app.py', which will modify the app.yaml to use files in the 'client/dist' directory instead of the 'client/app' directory. Note: this script requires that DEBUG_BUILD=False (don't worry if you forget, you will get a warning), which can be modified in build_config.py. Warning: if you change DEBUG_BUILD to be False, then next time you are editing and testing 'client/app' files, the files will not be used because you will be accessing files in the 'client/dist' directory instead of the 'client/app' directory. After uploading code to the server, set DEBUG_BUILD=True. Do not manually edit files in the 'client/dist' directory, as this is over-written by our build scripts.

Uploading code to the server

From the project home, run 'upload_app.py', which is a wrapper for the standard appcfg.py update command. Using this script will catch and prevent many common errors when uploading code.

lexavideo's People

Contributors

alexander-marquardt avatar

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.