Pull request Compare This branch is 882 commits ahead, 18220 commits behind ravendb:v4.1.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
..
Failed to load latest commit information.
App
Content
Properties
Scripts
fonts
pvc-packages
Index.html
Raven.Studio.Html5.csproj
compilerconfig.json
compilerconfig.json.defaults
favicon.ico
packages.config
pvc-project.json
pvcfile.csx
readme-optimized-build.md
readme.md
version.json
web.Debug.config
web.Release.config
web.config

readme.md

Introduction

Raven.Studio.Html5 is a replacement of the old Silverlight Studio, built using modern web technologies.

Raven.Studio.Html5 is a single page application (SPA) with no server-side component, communicating only with a Raven server. It uses Durandal.js to partition the app into logical modules, Twitter Bootstrap for a consistent UX, KnockoutJS for data-binding, and RequireJS for loading modules on demand.

The application code is written in TypeScript. TypeScipt 1.0 is required to compile Html5 studio.

Code layout

  • Index.html - this is the single page hosting the app.
  • /App/common - app code shared across multiple views
  • /App/commands - all communication with the server is done via a command class. Each command should derive from commandBase, which provides support for things like HTTP GET, POST, etc. as well as error handling.
  • /App/models - classes that model the data we get back from Raven, e.g. collection, document, etc.
  • /App/viewmodels - a class for every view. The class contains data and logic for a view. For example, documents.ts is the viewmodel for the documents page. Shell.ts is of particular interest, as it hosts the application shell, such as the main menu, footer, etc.
  • /App/views - HTML page for every location in the app. For example, documents.html is the view for the documents page.
  • /App/widgets - Contains custom widgets used in the app. Each widget has its own folder containing a view and view model. For example, the documents grid is a custom widget.
  • /Content - images, fonts, CSS/LESS. Of special note is App.less, which contains the styles specific to the app.
  • /Scripts - Vendor scripts (jquery, Knockout, etc.)
  • /Scripts/typings - TypeScript type definitions for 3rd party libraries.

Running the app

Build and run the Raven.Server project. Launch a web browser to locahost:8080, and the Studio will appear.

Debugging

To debug the TypeScript inside Visual Studio, set a breakpoint as usual and start debugging in Internet Explorer.

To debug TypeScript in the browser, run the app in a browser that supports source maps, such as Google Chrome. Debug using the built-in tools (CTRL+Shift+J in Chrome). Thanks to source maps, you'll be able to debug TypeScript code inside Google Chrome, just like you would with normal JavaScript.