Code Monkey home page Code Monkey logo

spectacle-editor's Introduction

Spectacle Editor

An Electron based app for creating, editing, saving, and publishing Spectacle presentations. With integrated Plotly support.

This project is a joint effort between Formidable and Plotly.

Getting started with development

Please review the contributing guidelines first.

Fork then clone the repo:

git clone [email protected]:<USERNAME>/spectacle-editor.git

Install npm dependencies:

cd spectacle-editor && npm install

Run Spectacle Editor in dev mode:

npm run dev

Running tests/lint:

npm run check

Overview

The initial setup of this project is based on electron-react-boilerplate.

MobX and seamless-immutable are used for the store(s).

Note: Instead of actions, components call methods on the store(s) passed down via context.

Spectacle Editor leverages React-Motion for drag and drop functionality.

Draggable elements

The elements that can be added to slides and edited include:

  • Text
  • Image
  • Plotly chart
  • Table
  • Shape (V2)
  • MathJax (V2)

Each element will have a corresponding property menu that is available when an element of that type is selected.

Canvas

The canvas is the editable area that displays the current slide. Elements can be dropped on the canvas, repositioned and formatted.

Slide list

The slide list displays all slides in the presentation and allows for changing the selected slide and reordering existing slides.

Property menu

This is where options for the selected element will appear. The menu will depend on the type of element selected. If no element is selected a slide menu will appear.

Creating release packages

To build for Windows on MacOS, you'll need (this may take 30+ mins):

brew update
brew install wine --without-x11
brew install mono

To build for Linux on MacOS, you'll need:

brew install gnu-tar libicns graphicsmagick xz

To build and package for all platforms, run:

npm run release

Other packaging steps are:

npm run package-all
npm run package-mac
npm run package-win
npm run package-linux

spectacle-editor's People

Contributors

bmathews avatar cldougl avatar designorant avatar dvonlehman avatar kenwheeler avatar mdaxtman avatar nicolaskruchten avatar paulathevalley avatar rgerstenberger avatar ryan-roemer avatar sethvincent avatar

Stargazers

 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.