Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/acheronfail/xi-electron
A front-end for the xi-editor built with modern web technologies.
https://github.com/acheronfail/xi-electron
canvas electron electron-forge webgl xi-editor xi-electron
Last synced: 2 months ago
JSON representation
A front-end for the xi-editor built with modern web technologies.
- Host: GitHub
- URL: https://github.com/acheronfail/xi-electron
- Owner: acheronfail
- License: mit
- Created: 2017-04-24T06:03:11.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2019-04-25T16:03:37.000Z (over 5 years ago)
- Last Synced: 2024-08-03T09:12:51.071Z (6 months ago)
- Topics: canvas, electron, electron-forge, webgl, xi-editor, xi-electron
- Language: TypeScript
- Size: 4.2 MB
- Stars: 344
- Watchers: 18
- Forks: 24
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Xi Electron
_A front-end for the xi-editor built with modern web technologies._
[![Build Status](https://travis-ci.org/acheronfail/xi-electron.svg?branch=master)](https://travis-ci.org/acheronfail/xi-electron)
NOTE: This is still a WIP!
## Demo
![canvas renderer](./doc/canvas.png)
## Goals of this Repo
* Make a front-end for [`xi-editor`](https://github.com/google/xi-editor) that is consistent across platforms
* Experiment with different editor rendering techniques on the web, specifically:
- `2d` - ``
- `DOM` - direct use of the DOM (have a look at how [CodeMirror](http://marijnhaverbeke.nl/blog/a-pathological-scrolling-model.html) tackled some of the challenges of using the DOM)
- `WebGL` - GPU accelerated rendering (via ``)
* Hopefully create a functional mobile friendly version that is also fast and pleasant to use
- once all three views are implemented we can benchmark them against each otherThe main motivation for this repo is to experiment and profile the speeds and performance of different rendering techniques for text editors in the browser, specifically with modern HTML5 APIs and the like. The final goal would be a fully cross-platform (desktop+mobile) text editing experience, but that's still a long hope at this stage.
## Getting started
To build and run `xi-electron` you'll need to have [NodeJS](https://nodejs.org) installed (Node version 6 or greater) as well as `Git`.
To get started:
```bash
> git clone https://github.com/acheronfail/xi-electron --recursive
> cd xi-electron
> yarn # or: npm install# Build xi-core:
> yarn core:build# If you just want to run in dev mode then run:
> yarn start # or: npm run start# To build xi-electron into an application:
> yarn make # or: npm run make
```The `yarn build:core` script will attempt to build `xi-editor`, so you'll need Rust (see below for details).
The built app will be output to `xi-electron/out/`.## Building `xi-core`
Keep in mind you'll need [Rust](https://www.rust-lang.org/) (version 1.30+ is recommended at the moment). On macOS platforms you'll need [Xcode 8.2](https://developer.apple.com/xcode/) and other relevant build tools.
You can build and install xi-core via `yarn build:core`. You can re-run this script anytime you like. [`xi-editor`](https://github.com/google/xi-editor) is currently placed in this repository as a submodule, so we can have a "somewhat" stable experience.
If you run into build issues ensure the submodule is present, ie:
```bash
> git submodule update --init
```Alternatively, if you'd like to clean and re-build everything again, you can run:
```bash
# Deletes all build artefacts:
> yarn core:clean
# Rebuilds the core:
> yarn core:build
```If you'd like to build and use a more recent version of `xi-editor` then just place it under `src/xi-core`. For building `xi-editor` manually [refer to its instructions](https://github.com/google/xi-editor#building-the-core).
## Contributing
Please! 🙏
## Credits
* All credits for the [xi-editor](https://github.com/google/xi-editor) go to Raph Levien.
## License
[MIT](LICENSE)