Git Product home page Git Product logo

notebook-dev's Introduction

Notebook

Ingo Andelhofs
Student at Hasselt University

About

Notebook is a simple Markdown and LaTeX Math editor build in React. The goal of this project is to create a modular / extensible editor for the web. Notebook also supports a user-friendly interface so that beginners or non-technical users can use this editor with ease, while advanced users can type really fast.

Features

Notebook features

  • Export (Notebook)

  • Import (Notebook)

    • Using a property
    • Using a method
  • Actions

    • Undo
    • Redo
    • Copy
    • Paste
  • Restrictions

    • Allow specific line types only

Notebookline features

Textual lines

  • Actions

    • Copy (one line)
    • Paste (one line)
  • Cursor Behaviour

    • Keys

      • Arrow right at end of line: moves cursor to position 0 in next container

      • Arrow left at beginning of line: moves cursor to position Infinity in next container

      • Arrow down at position of line: moves cursor to the same position in the next container

      • Arrow up at position of line: moves cursor to the same position in the previous container

      • Delete at end of line: moves the previous line upward or deletes the content of a non-text component

      • Backspace at front of (empty) line: removes the current line

      • Backspace at front of (non-empty) line: moves content (text) to the upward component or deletes the upward non-text component (both remove the current line)

      • Enter in middle or front of line: splits line into two parts

      • Enter at end of line:

    • Selection

      • Select (one line)
      • Set cursor correctly
  • Textual Line

    • Paragraph

    • Headings

      • Header 1
      • Header 2
      • Header 3
    • Textual decoration

      • Bold, Italic, Marked, ...
      • Math
  • List Line

    • ? Move to textual line
    • Ordered list
    • Unordered list
    • Change list type (1. -> a.)

Non-textual lines

  • Actions

    • Remove line to textual line (if only one line is left)
    • Add line in front (check how to handle enters???)
  • Image Line

    • Drag and Drop Image
    • Paste Image
    • Upload Image
    • From Notebook storage (If files are saved different from the Notebook itself)
    • Options
      • Sizing
      • Alignment
      • Border
  • Grid Line

    • Lines
    • Grid
    • Options
      • Size (Spacing)
  • Table Line

    • Add
      • Column
      • Row
    • Remove
      • Column
      • Row

Suggested Features

  • Block Limitations
  • Tooltip (line type options)
  • Moving Lines (up/down)
  • Extra Line wrapper actions

Structure

  • Notebook
    • NotebookLine
      • TextLine
      • ImageLine
      • ...

Notebook - NotebookLine (communication)

  • position
  • first
  • last
  • optional
    • setCaretOptions
    • resetCaretOptions
    • caretOptions
  • shared
    • createLine
    • removeLine
    • selectLine
    • moveToNextLine
    • moveToPreviousLine
    • updateData
    • selected

NotebookLine - *Line (communication)

  • shared actions (Notebook - NotebookLine)
  • changeLineType
  • ...

notebook-dev's People

Contributors

dependabot[bot] avatar ingoandelhofs avatar

Stargazers

 avatar

Watchers

 avatar  avatar

notebook-dev's Issues

Sometimes `Backspace` won't remove characters

Not able to use the Backspace key when a Notebook is loaded and the cursor is set. If you type a letter first, and then try to use the Backspace key characters will be removed correctly.

When uploading an image, check if it's valid

If you upload an invalid image (or another file) you will be able to upload, this must not be possible! It needs to be checked that the uploaded file must be a supported image type.

image

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.