index.jade

block vars
  - var bodyClass = 'home'
  - var description = "Vorlon.JS is an open source tool for remotely debugging and testing JavaScript."

extends layout

block content

  header.site-header
    .container
      .logo Vorlon.JS
        .spaceship
          .exhaust
      .tube.tube-left
        .data
      .tube.tube-top
        .data
      .tube.tube-right
        .data
      .planets
    .satellite

  section.centered
    .container.narrow
      h1 Introducing Vorlon.JS
      p.centered
          a.npm-shield(href='https://npmjs.org/package/vorlon')
          img(src='https://badge.fury.io/js/vorlon.svg')
        span   
        
      p An open source, extensible, platform-agnostic tool for remotely debugging and testing your JavaScript. Powered by node.js and socket.io.

  section.features
    .container.cf
      .feature
        h2 Easy setup
        p Install Vorlon.JS and add a single line of JavaScript to your web app. Run your server and start the Vorlon.JS dashboard.
        a.btn.btn-secondary(href='/#getting-started') Get Started
      .feature
        h2 Multi-device
        p Remotely connect up to 50 devices simultaneously. Run your code on each or all of them with a single click.
        a.btn.btn-secondary(href='/#demo') View Demo
      .feature
        h2 Extensible
        p Debug JavaScript on nearly any platform with a web environment. Plugins allow you to add new features and resources.
        a.btn.btn-secondary(href='/plugins') View Plugins

  section#demo
    .container.cf
      h2 See a Vorlon.JS Demo
      .video
        .video-embed
          iframe(width='560', height='315', src='https://www.youtube.com/embed/akmiqohFOM0', frameborder='0', allowfullscreen)
      
      .container.cf
      h2 Remote debug a Tesla!
      .video
        .video-embed
          iframe(width='560', height='315', src='https://www.youtube.com/embed/r7nDvWS3n1o', frameborder='0', allowfullscreen)
      
  hr
  
  section#getting-started
    .container.cf
      h2 Learn more about Vorlon.js in this 10 minutes video
      .video
        .video-embed
         iframe(width='560', height='315', src='https://www.youtube.com/embed/77u73mD9MKE?t=2812', frameborder='0', allowfullscreen)

  hr   
   
  section#getting-started
    .container.narrow
      h2 Getting Started
      p <strong>Prerequisites:</strong> please note that Vorlon.js doesn't work for now with Node v18, please use v16 until we fix it.
      p Learn everything you need to about Vorlon.js 0.1.0 in <a href='https://channel9.msdn.com/Shows/codechat/046' target="_blank">this video</a>
      p Install and run the Vorlon.JS server from npm:
      pre
        code
          | $ npm i -g vorlon 
          | $ vorlon 
      p If you are on a mac
      pre
        code
          | $ sudo npm i -g vorlon
          | $ sudo vorlon
      p(style={color: 'red'}) You may receive an error from npm during installation about Python, node-gyp and socket.io. You can ignore this error as it is related to an optional module. Socket.io team is already aware of this issue.
      p Once Vorlon.JS is done installing, you can now run the server:
      pre
        code
          | $ vorlon
          | The Vorlon server is running
      p With the server is running, open <code>http://localhost:1337</code> in your browser to see the Vorlon.JS dashboard.
      p The last step is to enable Vorlon.JS by adding this script tag to your app:
        pre
          code
            | &lt;script src="http://localhost:1337/vorlon.js"&gt;&lt;/script&gt;
      p Now when you open your app you should see your client appear on the dashboard.
      p.centered
        a.btn.btn-primary(href='documentation/') Read the Docs
        
  hr

  section#vorlon-desktop
    .container.narrow
      h2 Use Vorlon as a desktop application
      p (See this as another way to install the Vorlon.js server)
      img(src='images/vorlon-desktop.png').img-desktop
      p You could also download the desktop version of Vorlon. It is a standalone executable working on Windows and MacOS (Linux version is coming soon).
      p Vorlon desktop is built using the awesome
        a(href='http://electron.atom.io/')  Github Electron
        | .
      h3 Install Windows version
      ul 
        li Download zip file by clicking the button bellow. 
        li Unzip content in a temp folder and run the installer
      p.centered
        a.btn.btn-primary(href='./desktop/vorlon-desktop.zip') Download Windows version
      h3 Install MacOSX version
      ul
        li Download dmg file by clicking the button bellow. 
        li Double-click the .DMG file to mount it. 
        li A new Finder window showing its contents should appear. 
        li If the window also contains a shortcut icon to 'Applications', drag and drop the app onto the shortcut. 
        li If not, double-click the mounted volume on your desktop and drag the app icon from there to the 'Applications' icon in the Finder sidebar.
      p.centered
        a.btn.btn-primary(href='./desktop/vorlon-desktop_0.1.0.dmg') Download Mac OSX version