Giter Site home page Giter Site logo

remeal's Introduction

Remeal

Build Status code style: prettier Greenkeeper badge Twitter URL

Simple remote control panel for reveal.js presentations based on socket.io.

Features:

  1. Title of the talk. For busy people!
  2. Timer. Click on it to restart.
  3. Beautiful connection indicator.
  4. Displays the current slide. Tap and hold the slide to turn the pointer on (can be disabled at the customization panel).
  5. Displays speaker notes for the current slide.
  6. Controls available:
    1. next slide
    2. previous slide
    3. toggle pause mode
    4. toggle overview mode
  7. Customizable panel! Choose where to place the current slide, speaker notes and controls, or disable them at all!
  8. Light and dark theme included. Sometimes you just don't want to make your listeners blind.
  9. Control panel vibrates on receiving events from the presentation so that you don't have to look back on the main screen to be sure that everything works (can be disabled at the customization panel).

See it in action:

Remeal demonstration

Usage

The installation process includes two simple steps:

  1. Clone this repo and deploy anywhere. Don't forget to npm run build&& npm run start it (hint: now will do it automatically).
  2. Connect your presentation to the control panel. There are two ways to do that:
    1. Visit remeal deployment and drag the huge Remeal link to the bookmarks panel. Then open your presentation and press the bookmarklet. The presentation will be connected to the control panel automatically. This method is preferable. Obviously.
    2. OR, if you feel adventurous, build remeal locally (npm run build), copy plugin/remeal.js to your presentation and add it as a dependency:
      Reveal.initialize({
        ...otherConfigOptions,
        dependencies: [
          ...otherDependencies,
          { src: REMEAL_PLUGIN_URL_GOES_HERE, async: true, callback: () => initRemeal() }
        ]
      })
      Then open your presentation and press r to connect to the remote control panel.
  3. Tapping on the gear in the header opens the configuration panel, where you can:
    1. Switch theme
    2. Rearrange or disable control panel blocks
    3. Turn vibrations on and off
    4. Enable and disable the pointer feature.

Screenshots

Dark theme

Dark theme

Light theme

Light theme

Built with:

  • preact as a view library
  • stapp as a state management tool
  • socket.io as an event transport
  • parcel as a bundler with zero configuration

License

MIT

remeal's People

Contributors

dmitry-korolev avatar greenkeeper[bot] 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

Watchers

 avatar  avatar

remeal's Issues

An in-range update of preact-emotion is breaking the build 🚨

Version 9.2.8 of preact-emotion was just published.

Branch Build failing 🚨
Dependency preact-emotion
Current Version 9.2.6
Type dependency

This version is covered by your current version range and after updating it in your project the build failed.

preact-emotion is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Status Details
  • continuous-integration/travis-ci/push: The Travis CI build could not complete due to an error (Details).

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.


Your Greenkeeper Bot 🌴

Auto-hide the highlighter on inactivity

Problem:
Currently, the highlighter appears on POINTER_START_EVENT event and disappears on POINTER_STOP_EVENT event.
Imagine that internet connection is somehow interrupts between this two events. The highlighter will never disappear.

Solution:
Add inactivity timeout. Automatically hide the highlighter, if the presentation plugin doesn't receive pointer events for some time.

Dependency issue

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/redux
npm ERR!   redux@"^4.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer redux@">=3 <4" from [email protected]
npm ERR! node_modules/stapp
npm ERR!   stapp@"^1.3.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

App error

Hi

I just did a fresh clone and build. Running the app, I get this error in the browser console and the panel does not display.

Indicator.js:4 Uncaught TypeError: t.default.div is not a function
    at Object.parcelRequire.+S2G.preact (Indicator.js:4)
    at f (debug.js:99)
    at p (debug.js:105)
    at Object.parcelRequire.RzfG.preact (Header.js:6)
    at f (debug.js:99)
    at p (debug.js:105)
    at Object.parcelRequire.Focm../index.css (index.js:3)
    at f (debug.js:99)
    at parcelRequire.vKFU (debug.js:125)
    at debug.js:159

The line in sources is (Indicator.js) :

import { h } from 'preact'
import styled from 'preact-emotion'

const Container = styled.div`
  width: calc(var(--padding) * 5);
  text-align: center;
`

Two-way binding

Any events from embedded presentation in the control panel should be sent to the original presentation.

Issues in safari. Probably css?

Opening the remote window in Safari (mac & ios) gives unespected results.
The settings panel is open in initial state and can not be closed.
Is this a css issue? Can it be fixed. currently I am working with the v1.1.0 release.

Well, we need some tests

This project was developed in a hurry, so there was no time for writing unit tests. Now we have this time.

An in-range update of fbjs is breaking the build 🚨

Version 0.8.17 of fbjs was just published.

Branch Build failing 🚨
Dependency fbjs
Current Version 0.8.16
Type dependency

This version is covered by your current version range and after updating it in your project the build failed.

fbjs is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Status Details
  • continuous-integration/travis-ci/push The Travis CI build could not complete due to an error Details

Commits

The new version differs by 2 commits.

  • 4237441 0.8.17
  • 696841d bumping ua-parser-js to fix RegExp DoS vulnerability (#291)

See the full diff

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.


Your Greenkeeper Bot 🌴

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

Auto-slide

Sometimes we really need some sort of auto sliding. Take PechaKucha presentation format as an example.

I suppose to add a button, that will:

  1. Unpause presentation, if it's paused
  2. Start auto sliding

Slide change timeout should be customizable.

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

Control Panel blank page

After installing the application using npm install --legacy-peer-deps due to #59 and building using npm run build I start the server using node server/index.js.

When visiting http://localhost I am visited by a blank page.
Looking in the console shows me the following error

Uncaught TypeError: t.default.div is not a function
    S2Gw Indicator.js:4
    f index.js:78
    p index.js:85
    RzfG Header.js:6
    f index.js:78
    p index.js:85
    Focm index.js:3
    f index.js:78
    parcelRequire index.js:116
    <anonymous> index.js:26

An in-range update of yargs is breaking the build 🚨

The dependency yargs was updated from 13.2.2 to 13.2.4.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

yargs is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Status Details
  • continuous-integration/travis-ci/push: The Travis CI build could not complete due to an error (Details).

Commits

The new version differs by 14 commits.

  • a6e67f1 chore(release): 13.2.4
  • fc13476 chore: update standard-verison dependency
  • bf46813 fix(i18n): rename unclear 'implication failed' to 'missing dependent arguments' (#1317)
  • a3a5d05 docs: fix a broken link to MS Terminology Search (#1341)
  • b4f8018 build: add .versionrc that hides test/build
  • 0c39183 chore(release): 13.2.3
  • 08e0746 chore: update deps (#1340)
  • 843e939 docs: make --no- boolean prefix easier to find in the docs (#1338)
  • 84cac07 docs: restore removed changelog of v13.2.0 (#1337)
  • b20db65 fix(deps): upgrade cliui for compatibility with latest chalk. (#1330)
  • c294d1b test: accept differently formatted output (#1327)
  • ac3f10c chore: move .hbs templates into .js to facilitate webpacking (#1320)
  • 0295132 fix: address issues with dutch translation (#1316)
  • 9f2468e doc: clarify parserConfiguration object structure (#1309)

See the full diff

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.


Your Greenkeeper Bot 🌴

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.