diff options
| -rw-r--r-- | CHANGELOG.md | 7 | ||||
| -rw-r--r-- | docs/dev/getting-started.md | 49 | ||||
| -rw-r--r-- | docs/slide-options.md | 159 |
3 files changed, 211 insertions, 4 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 00000000..97224d1e --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,7 @@ +# CHANGELOG + +Please refer to the release notes published under +[`public/docs/release-notes.md`](public/docs/release-notes.md). + +These are also available on each CodiMD instance under +https://[domain-name]/release-notes diff --git a/docs/dev/getting-started.md b/docs/dev/getting-started.md index 6eb1b136..79a97d4a 100644 --- a/docs/dev/getting-started.md +++ b/docs/dev/getting-started.md @@ -1,13 +1,54 @@ # Developer Notes +## Preparing for running the code + +**Notice:** *If you're into [docker](../setup/docker.md) or [heroku](../setup/heroku.md), +there's extra documents for those!* + +1. Clone the repository (Cloning is the preferred way, but you can also download + and unzip a release) +2. Enter the directory and run `bin/setup`, which will install npm dependencies + and create configs. The setup script is written in Bash, you would need bash + as a prerequisite. +3. Setup the [config file](../configuration-config-file.md) or set up + [environment variables](../configuration-env-vars.md). + + +## Running the Code + +Now that everything is in place, we can start CodiMD: + +4. `npm run build` will build the frontend bundle. It uses webpack to do that. +5. Run the server with `node app.js` + + +## Running the Code with Auto-Reload + +The commands above are fine for production, but you're a developer and surely +you want to change things. You would need to restart both commands whenever you +change something. Luckily, you can run these commands that will automatically +rebuild the frontend or restart the server if necessary. + +The commands will stay active in your terminal, so you will need multiple tabs +to run both at the same time. + +4. Use `npm run dev` if you want webpack to continuously rebuild the frontend + code. +5. To auto-reload the server, the easiest method is to install [nodemon](https://www.npmjs.com/package/nodemon) + and run `nodemon --watch app.js --watch lib --watch locales app.js`. + + ## Structure +The repository contains two parts: a server (backend) and a client (frontend). +most of the server code is in `/lib` and most of the client code is in `public`. + ```text -codimd/ -├── test/ --- test suite +codimd-server/ ├── docs/ --- documentation -├── lib/ --- server libraries -└── public/ --- client files +├── lib/ --- server code +├── test/ --- test suite +└── public/ --- client code ├── css/ --- css styles ├── docs/ --- default documents ├── js/ --- js scripts diff --git a/docs/slide-options.md b/docs/slide-options.md new file mode 100644 index 00000000..8da5dc10 --- /dev/null +++ b/docs/slide-options.md @@ -0,0 +1,159 @@ +## Slide Separators +If you're getting started with reveal.js slides, there are a few things you need to know. + +There are two types of slides, those that transition horizontally and those that transition vertically (subslides). + +The following separators are used for each in the hackmd syntax: +``` +# First Slide + +--- + +# Next slide + +---- + +## Subslide +``` +as you can see, horizontal transitions are separated by `---` and vertical transitions by `----` + +## Basic YAML header +It's possible to customise the slide options using the YAML header in the slide markdown. + +eg: +``` +--- +title: Example Slide +tags: presentation +slideOptions: + theme: solarized + transition: 'fade' + # parallaxBackgroundImage: 'https://s3.amazonaws.com/hakim-static/reveal-js/reveal-parallax-1.jpg' +--- +``` +make sure to have two spaces only at the start of the listed slide options. + +you can comment out options with a `#` + +### Some other options +``` +# Display controls in the bottom right corner +controls: true + +# Display a presentation progress bar +progress: true + +# Set default timing of 2 minutes per slide +defaultTiming: 120 + +# Display the page number of the current slide +slideNumber: false + +# Push each slide change to the browser history +history: false + +# Enable keyboard shortcuts for navigation +keyboard: true + +# Enable the slide overview mode +overview: true + +# Vertical centering of slides +center: true + +# Enables touch navigation on devices with touch input +touch: true + +# Loop the presentation +loop: false + +# Change the presentation direction to be RTL +rtl: false + +# Randomizes the order of slides each time the presentation loads +shuffle: false + +# Turns fragments on and off globally +fragments: true + +# Flags if the presentation is running in an embedded mode, +# i.e. contained within a limited portion of the screen +embedded: false + +# Flags if we should show a help overlay when the questionmark +# key is pressed +help: true + +# Flags if speaker notes should be visible to all viewers +showNotes: false + +# Global override for autolaying embedded media (video/audio/iframe) +# - null: Media will only autoplay if data-autoplay is present +# - true: All media will autoplay, regardless of individual setting +# - false: No media will autoplay, regardless of individual setting +autoPlayMedia: null + +# Number of milliseconds between automatically proceeding to the +# next slide, disabled when set to 0, this value can be overwritten +# by using a data-autoslide attribute on your slides +autoSlide: 0 + +# Stop auto-sliding after user input +autoSlideStoppable: true + +# Use this method for navigation when auto-sliding +autoSlideMethod: Reveal.navigateNext + +# Enable slide navigation via mouse wheel +mouseWheel: false + +# Hides the address bar on mobile devices +hideAddressBar: true + +# Opens links in an iframe preview overlay +previewLinks: false + +# Transition style +transition: 'slide' +# none/fade/slide/convex/concave/zoom + +# Transition speed +transitionSpeed: 'default' +# default/fast/slow + +# Transition style for full page slide backgrounds +backgroundTransition: 'fade' +# none/fade/slide/convex/concave/zoom + +# Number of slides away from the current that are visible +viewDistance: 3 + +# Parallax background image +parallaxBackgroundImage: '' +# e.g. "'https://s3.amazonaws.com/hakim-static/reveal-js/reveal-parallax-1.jpg'" + +# Parallax background size +parallaxBackgroundSize: '' +# CSS syntax, e.g. "2100px 900px" + +# Number of pixels to move the parallax background per slide +# - Calculated automatically unless specified +# - Set to 0 to disable movement along an axis +parallaxBackgroundHorizontal: null +parallaxBackgroundVertical: null + +# The display mode that will be used to show slides +display: 'block' +``` + +## Customising individual slides + +custom background image: +``` +--- + +<!-- .slide: data-background="https://s3.amazonaws.com/hakim-static/reveal-js/reveal-parallax-1.jpg" --> +#### testslide + +--- +``` |