Giter Club home page Giter Club logo

gist-reveal's Introduction

Gist-Reveal

Gist-powered Revealjs presentations

Gist-Reveal.it is an open source slideshow templating service that makes it easy to create, edit, present, and share Reveal.js slides on the web by using github's gist service as a datastore.

gist-reveal.it/YOUR_GIST_ID

Store any Revealjs-compatible HTML or Markdown content in a gist, then append your resulting gist id to the end of any gist-reveal site url to view the resulting presentation:

http://gist-reveal.it/GIST_ID_CONTAINING_REVEALJS_SLIDE_CONTENT

Example:

http://gist-reveal.it/af84d40e58c5c2a908dd

Use bitly or another url shortener to make these long urls easier to share, and to make enagement rates easier to count.

gist-reveal.it/bit.ly/SHORTNAME

Creating a bit.ly shortname for your longer gist-reveal/gist_id deck urls will also make your presentations available at an alternate presentation path:

http://gist-reveal.it/bit.ly/SHORTNAME

Example:

http://gist-reveal.it/bit.ly/k8s-workshops

Much nicer! Make sure to continue sending traffic to the shorter bit.ly/shortname url for metrics collection purposes.

Gist-powered Slideshow Themes

Available CSS themes include the default reveal.js list of themes, but can be easily extended by storing new themes in a gist:

Conference organizers can host their own modified gist-reveal templating service (with its own default theme), to provide a consistent look for all presentations at an event.

Application Config

The following environment variables can be used to autoconfigure the application:

Variable Name Contents Default Value
DEFAULT_GIST The default gist id slideshow content for the site af84d40e58c5c2a908dd
REVEAL_THEME The site's default theme. Should be a locally bundled theme name, or a remote gist_id. 450836bbaebcf4c4ae08b331343a7886
GH_CLIENT_SECRET GitHub client secret unset
GH_CLIENT_ID GitHub client ID unset
GA_TRACKER Google Analytics tracker token unset
PORT The server port number 8080
IP_ADDR The server IP address 0.0.0.0
GIST_THEMES Allow reveal.js CSS themes to be installed dynamically "url/?theme=gist_id". Disable this feature by setting this config to the string "false". "true"
REVEAL_SOCKET_SECRET the site's broadcast token (alphanumeric) randomly generated

See server.js for more information about the site's configuration options.

Broadcasting Slide Transitions

Administrators can configure the application's REVEAL_SOCKET_SECRET to broadcast slide transitions using Reveal's socket Multiplexing support.

Presenters who know the site's REVEAL_SOCKET_SECRET value can configure their browser as a presentation device using the setToken querystring param:

http://YOUR_REVEAL_HOST_URL/?setToken=REVEAL_SOCKET_SECRET_VALUE

This token will be stored in the browser's localStorage area (per host url) as localStorage.secret. To reconfigure your browser as a client device (as a listener), use the clearToken querystring param:

http://YOUR_REVEAL_HOST_URL/?clearToken

Running Gist-Reveal.it

Gist-reveal makes it easy to run your own Gist-powered RevealJS slideshow service

Local Development

The simplest way to get started with this project, is to clone a copy of the source from github (git clone http://github.com/ryanj/gist-reveal && cd gist-reveal), then run the app locally with npm install followed by npm start.

Kubernetes

To create a kubernetes deployment and NodePort service, both named gist-reveal:

kubectl run gist-reveal --image=ryanj/gist-reveal --expose --port=8080 --service-overrides='{ "spec": { "type": "NodePort" } }' \
--env="DEFAULT_GIST=YOUR_DEFAULT_GIST_ID" \
--env="GH_CLIENT_SECRET=YOUR_GH_CLIENT_SECRET" \
--env="GH_CLIENT_ID=YOUR_GH_CLIENT_ID" \
--env="REVEAL_SOCKET_SECRET=0P3N-S0URC3" \
--env="GA_TRACKER=YOUR_GA_TRACKER"

Minikube users should be able to open the new service in their browser by running:

minikube service gist-reveal

Docker

To run the docker image locally on port 8080:

docker run --rm -p 8080:8080 docker.io/ryanj/gist-reveal

Environment variables can be passed into the Docker container in order to configure the websocket relay, or to change the default slideshow content:

docker run --rm -p 8080:8080 -e "REVEAL_SOCKET_SECRET=0P3N-S0URC3" -e "DEFAULT_GIST=YOUR_DEFAULT_GIST_ID" ryanj/gist-reveal

License

gist-reveal.it was created at the first DockerCon Hackathon by @ryanj and @fkautz.

Reveal.js is MIT licensed Copyright (C) 2014 Hakim El Hattab, http://hakim.se

gist-reveal's People

Contributors

akiersky avatar asmod3us avatar cfjedimaster avatar commadelimited avatar dandv avatar danielmitd avatar davidbanham avatar ericweikl avatar greenkeeperio-bot avatar gturri avatar hakimel avatar mahemoff avatar max-mapper avatar michalsmolinski avatar mischah avatar nschonni avatar nstanger avatar ob1 avatar olivierphi avatar owenversteeg avatar ricklupton avatar rmurphey avatar russellbeattie avatar ryanj avatar technicalpickles avatar theone1984 avatar tkaczmarzyk avatar vonc avatar webpro avatar xiaomipatchrom avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

gist-reveal's Issues

iframe support?

Need to consider the security implications for iframes.

Best use-cases:

  • videos in presentations
  • hacking

Web audio stream: presenter to clients

needs an implementation plan.

requirements:

  • use an external streaming service integration for audio data? (test max clients per audio stream)
  • Needs a presenter 'on/off' switch to conserve bandwidth, to start/stop the stream
  • Clients should see their own 'on/off' button, only when broadcasts are in progress. Client connections should default to mute (stream disconnect, minimal traffic)

Banned users list

Allow admins to populate a BANNED_USERS env var with a CSV list of gh_usernames.
Automatically block requests for gists where the owner has been blacklisted.

Need a dock to display additional features and usage info

  1. The Edit button links to the current gist on github. popover: Fork and Edit this slide deck on Github
  2. Include a Tweet button that pastes the current URL into a fresh tweet
  3. Add a "Fork me on GitHub" button

4. Launch your own on [OpenShift][Docker]

  1. Add a file an issue button that links to the issues list?
  2. Add a "Login with Github" button allows presenters to set their token, broadcast to clients

Feature or bug?

I build a clone site.The dmain.com/gist_id is working but the domain.com/?set_Tocken isn't.
Is this a new feature(evrey body could use it) or bug(i cannot set a secret tocken)?

td and table style rendering issue

It appear gist-reveal is not rendering table style and td style correctly. In GIST https://gist.github.com/danehans/b78ab8bd7511610f29c1:

     <table style="margin-left: auto; margin-right: auto; width: 593px">
        <tr>
          <td style="font-size: smaller; font-style: italic; text-align: center; width: 20%;">Code</td>
          <td style="font-size: smaller; font-style: italic; text-align: center; width: 15%;">&nbsp;</td>
          <td style="font-size: smaller; font-style: italic; text-align: center; width: 30%;">Deploy</td>
          <td style="font-size: smaller; font-style: italic; text-align: center; width: 15%;">&nbsp;</td>
          <td style="font-size: smaller; font-style: italic; text-align: center; width: 20%;">Enjoy</td>
        </tr>
      </table>

In index.html:

      <table>
        <tr>
          <td>Code</td>
          <td>&nbsp;</td>
          <td>Deploy</td>
          <td>&nbsp;</td>
          <td>Enjoy</td>
        </tr>
      </table>

Nicer URLs

Add support for content located at the following url: gist-reveal.it/username/reponame

Update the default theme

Create new themes:

  • for CoreOS
  • for kubernetes

Then:

  • List several available theme options and examples in the README

API Rate Limiting

According to the github doc's, I should have a higher rate-limit when using my credentials. UNfortunaltly that does not appear to be the case. Do you know what I may be missing?

curl -i 'https://api.github.com/users/whatever?client_id=MY_GITHUB_USER&client_secret=******'

HTTP/1.1 200 OK
Server: GitHub.com
Date: Sun, 02 Nov 2014 06:26:18 GMT
Content-Type: application/json; charset=utf-8
Status: 200 OK
X-RateLimit-Limit: 60
X-RateLimit-Remaining: 58
X-RateLimit-Reset: 1414913136
Cache-Control: public, max-age=60, s-maxage=60
Last-Modified: Fri, 06 Dec 2013 20:31:11 GMT
ETag: "3deddbf2b4e3fa8465a4b2f0f9e7d895"
Vary: Accept
X-GitHub-Media-Type: github.v3
X-XSS-Protection: 1; mode=block
X-Frame-Options: deny
Content-Security-Policy: default-src 'none'
Content-Length: 1096
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: ETag, Link, X-GitHub-OTP, X-RateLimit-Limit, X-RateLimit-Remaining, X-RateLimit-Reset, X-OAuth-Scopes, X-Accepted-OAuth-Scopes, X-Poll-Interval
Access-Control-Allow-Origin: *
X-GitHub-Request-Id: 806BFCB4:527F:2BADAF0:5455CE8A
Strict-Transport-Security: max-age=31536000; includeSubdomains; preload
X-Content-Type-Options: nosniff
Vary: Accept-Encoding
X-Served-By: 76d9828c7e4f1d910f7ba069e90ce976

{
"login": "whatever",
"id": 43933,
"avatar_url": "https://avatars.githubusercontent.com/u/43933?v=2",
"gravatar_id": "",
"url": "https://api.github.com/users/whatever",
"html_url": "https://github.com/whatever",
"followers_url": "https://api.github.com/users/whatever/followers",
"following_url": "https://api.github.com/users/whatever/following{/other_user}",
"gists_url": "https://api.github.com/users/whatever/gists{/gist_id}",
"starred_url": "https://api.github.com/users/whatever/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/whatever/subscriptions",
"organizations_url": "https://api.github.com/users/whatever/orgs",
"repos_url": "https://api.github.com/users/whatever/repos",
"events_url": "https://api.github.com/users/whatever/events{/privacy}",
"received_events_url": "https://api.github.com/users/whatever/received_events",
"type": "User",
"site_admin": false,
"public_repos": 1,
"public_gists": 0,
"followers": 0,
"following": 0,
"created_at": "2009-01-03T13:12:29Z",
"updated_at": "2013-12-06T20:31:11Z"
}

Markdown Support

I created a tiny markdown file using both # and ------ based headers but it doesn't seem to work?

SECURITY ALERT!!!

Strip all javascript from the gist files? Javascript should be implemented as a site-wide feature, but users can add onclick events and special tags that enable system js functions to trigger certain operations.

Allow the attachment of custom CSS?

504 error

$ rhc app create gistreveal nodejs-0.10 --from-code=http://github.com/ryanj/gis
t-reveal.it 
Application Options
-------------------
Domain:                ttvvoo
Cartridges:            nodejs-0.10
Source Code:           http://github.com/ryanj/gist-reveal.it
Gear Size:             default
Scaling:               no

Creating application 'gistreveal' ... Server returned an unexpected error code: 504

cache gist content

make a module that will first check for available assets within a repo folder.
If the asset is not found check a local disk cache folder and then request a cache refresh for the remote asset (update in the background, only update when fresh data is found).

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.