0

Spectacle Editor

拖放 Spectacle 编辑器。（Drag and drop Spectacle editor.）

Github repo
Main metrics
  • Owner: plotly/spectacle-editor
  • Platform: Linux, Mac, Windows
  • License:: MIT License
  • Category::
  • Topic:
  • Like:
    0
      Compare:

Github stars Tracking Chart

Spectacle Editor

一款基于 Electron 的应用程序，用于创建、编辑、保存和发布 Spectacle 演示文稿。集成了 Plotly 的支持。

这个项目是由 Formidable 和 Plotly 联合开发的。

开始开发

请先阅读 贡献指南。

Fork 然后克隆这个 repo： 

git clone git@github.com:/spectacle-editor.git

安装 npm 依赖关系。 

cd spectacle-editor && npm install

在开发模式下运行 Spectacle Editor。 

npm run dev

运行测试/lint。

npm run check

概述

这个项目的初始设置是基于 electron-react-boilerplate。

store(s) 使用了 MobX 和 seamless-immutable。

注意：组件调用通过上下文传递下来的 store 上的方法，而不是动作。

Spectacle Editor 利用 React-Motion 来实现拖放功能。

可拖放元素

可以添加到幻灯片中并进行编辑的元素包括：

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

每个元素都会有一个相应的属性菜单，当选择该类型的元素时，就可以使用。

Canvas

画布是显示当前幻灯片的可编辑区域。可以在画布上放置元素，重新定位和格式化。

Slide list（幻灯片列表）

幻灯片列表显示演示文稿中的所有幻灯片，并允许更改所选幻灯片和重新安排现有幻灯片的顺序。

Property menu（属性菜单）

在这里将显示所选元素的选项。该菜单将取决于所选元素的类型。如果没有选择元素，则会出现一个滑动菜单。

创建发布包

要在 MacOS 上构建 Windows，你需要（这可能需要30多分钟）： 

brew update

brew install wine --without-x11
brew install mono

要在 MacOS 上为 Linux 构建，你需要：

brew install gnu-tar libicns graphicsmagick xz

要为所有平台构建和打包，请运行： 

npm run release

其他包装步骤有：

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

Main metrics

Overview
Name With Ownerplotly/spectacle-editor
Primary LanguageJavaScript
Program languageHTML (Language Count: 3)
PlatformLinux, Mac, Windows
License:MIT License
所有者活动
Created At2016-05-03 22:24:37
Pushed At2023-11-09 22:20:47
Last Commit At2019-06-26 11:04:06
Release Count4
Last Release Namev0.1.6 (Posted on )
First Release Namev0.1.3 (Posted on )
用户参与
Stargazers Count443
Watchers Count60
Fork Count96
Commits Count588
Has Issues Enabled
Issues Count139
Issue Open Count54
Pull Requests Count97
Pull Requests Open Count2
Pull Requests Close Count2
项目设置
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private

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 git@github.com:<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