https://github.com/wulab/mithril-slides

A Keynote-inspired presentation app written with Mithril
https://github.com/wulab/mithril-slides

javascript json keynote mithril presentation

Last synced: about 7 hours ago
JSON representation

A Keynote-inspired presentation app written with Mithril

• Host: GitHub
• URL: https://github.com/wulab/mithril-slides
• Owner: wulab
• License: other
• Created: 2015-04-03T16:00:51.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2018-08-26T05:16:26.000Z (about 6 years ago)
• Last Synced: 2024-08-01T22:41:42.265Z (3 months ago)
• Topics: javascript, json, keynote, mithril, presentation
• Language: HTML
• Homepage: https://mithril-slides.onrender.com
• Size: 197 KB
• Stars: 23
• Watchers: 6
• Forks: 4
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-mithril - mithril-slides - Keynote-inspired presentation app. (Uncategorized / Uncategorized)

README

        
# mithril-slides

A Keynote-inspired presentation app written with Mithril

![screenshots](https://cloud.githubusercontent.com/assets/592709/17454537/012dc70c-5bc4-11e6-86e1-5d5ce2bc35b8.gif)

## Features

* Create slides as a [simple JSON file](slides.json)

* Embed websites, web apps or YouTube videos

* Present ideas using only a web browser

* Support mobile or tablet devices

* A total of 4 themes to choose from

![themes](https://user-images.githubusercontent.com/592709/32982023-6333a648-ccb0-11e7-87e6-cdb94c5573f0.png)

## Getting started

1. Clone mithril-slides repository at the command prompt if you haven't yet:

        $ git clone https://github.com/wulab/mithril-slides.git

2. Change directory to `mithril-slides` and start a web server:

        $ cd mithril-slides

        $ python -m SimpleHTTPServer 8000       # Python 2

        $ python -m http.server 8000            # Python 3

3. Using a browser, go to `http://localhost:8000` and you'll see example slides.

4. To add or edit slides, make changes to the `slides.json` file and reload your browser.

## Keyboard shortcuts

Shortcuts for navigating slides are listed below.

Action                    | Shortcut

------------------------- | --------------------------------------------

Advance to the next slide | Right Arrow, Down Arrow, Space bar or Return

Go to previous slide      | Left Arrow, Up Arrow or Backspace

Quit presentation mode    | Esc or Q

Show or hide the pointer  | C

Change presentation theme | T

## Offline mode

mithril-slides requires an internet connection to work. If you are to present in a

place without one. You can still use mithril-slides by checking out `offline` branch

before starting a web server:

        $ git checkout offline

        $ python -m SimpleHTTPServer 8000       # Python 2

        $ python -m http.server 8000            # Python 3

You also need to change src properties of all image and embed objects in your

`slides.json` file to local files.

## Known issues

Some websites can not be embedded because they have secure HTTP headers (either

`X-Frame-Options` or `Content-Security-Policy`) set in their responses. To remove

those headers, you need a browser extension. For Google Chrome, install

[ModHeader][1] extension and add response headers for above headers with empty

values. For Firefox, install [Modify Response Headers][2] add-on and add filters for

those headers. The following slide can be used to test your setup:

        {

            "embed": {

                "src": "https://github.com/",

                "width": "1024",

                "height": "768",

                "sandbox": "allow-forms allow-same-origin allow-scripts"

            }

        }

[1]: https://chrome.google.com/webstore/detail/modheader/idgpnmonknjnojddfkpgkljpfnnfcklj

[2]: https://addons.mozilla.org/en-US/firefox/addon/modify-response-headers/