Allows designers to create and edit dialogue scenarios using a web browser.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
application
doc
editor
system
.gitignore
.htaccess
LICENSE.CodeIgniter.txt
LICENSE.txt
README.md
gulpfile.ts
index.php
logo.svg
package-lock.json
package.json
tslint.json

README.md

Scenario Editor

The UURAGE Scenario Editor is a web application component for editing communication scenarios.

Prerequisites

A server stack that includes PHP >= 5.5.

For online use, any small web hosting package should do; Linux environments are more common and better supported than Windows servers. For offline, local use on Windows, XAMPP and UwAmp are reasonable options.

Installation

Simply place all files in the web root.

Configuration

Create a configuration XML file based on the config language with the namespace http://uurage.github.io/ScenarioEditor/config/namespace and put it in the editor directory with the filename config.xml. A tutorial is also available.

Development

NPM package

The purpose of the NPM package is to manage development dependencies. We use technologies that involve building (transforming) files (see below). The NPM package allows you to build everything at once and to build files that have changed since the last build every time you save a file.

Setup

Install Node.js and execute the following commands to install the development dependencies:

npm install -g gulp-cli
npm install

Command-line usage

To build and watch for file changes run: gulp

Visual Studio Code

The Scenario Editor has a Visual Studio Code task for executing gulp. After installing the dependencies, this task can be executed with Ctrl+Shift+B in the code editing window.

Sass

The Scenario Editor uses a collection of Sass files for its styling. There are several ways to compile Sass to CSS.

Using Node.js

See "NPM package" above. Run gulp sass to compile once.

Using Sass Compiler

When compiling using the standard Sass compiler, you need to watch the folder editor/sass to compile to editor/css.

Live-reload

You can live-reload the changes to your stylesheets in your browser by running gulp stream, which uses Browsersync and uses localhost as the proxy hostname.