Lots more docs and a couple of minor fixes

CONTRIBUTING.md

@@ -1,20 +1,3 @@
 # Contributing
 
-## C++
-
-Doogie follows the [Chromium Style Guide](https://chromium.googlesource.com/chromium/src/+/master/styleguide/c++/c++.md)
-for C++ code except for anything listed below.
-
-* Forward decls only when necessary. No need to worry about compile times (yet).
-* We use a singleton here and there as necessary
-* Avoid slots, use method references
-* Class decls are usually public, protected, and private. But here they are public, signals, public slots, protected,
-  protected slots, private, and private slots
-* Prefer default by-value capture on local lambdas
-* Obviously, some styles have to be broken to confirm to Qt, e.g. name format for overridden methods
-* No file-level comments
-* Passing around raw pointers is ok in Qt land, at least for now
-
-## JavaScript
-
-For JS code in tests, follow [Standard Style](https://www.npmjs.com/package/standard).
+See the [contributing section in the user guide](docs/guide/develop.md#contributing).

README.md

@@ -1,95 +1,7 @@
 
 # Doogie
 
-A power browser
+A Chromium-based web browser with tree-style pages. MIT licensed.
 
-## Building
-
-### Windows Prerequisites
-
-Before running the build script on Windows, you must have the prerequisites:
-
-* Latest Qt (5.x) installed w/ `qmake.exe` on the `PATH`
-* Latest CMake installed w/ `cmake.exe` on the `PATH`
-* Latest Python (2.x) installed w/ `python.exe` on the `PATH`
-* Latest Go installed w/ `go.exe` on the `PATH`
-* [MSVC 2015 Build Tools](http://landinghub.visualstudio.com/visual-cpp-build-tools) installed w/ the following
-  executed to put 64-bit VC compiler on the `PATH`:
-  `"C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\vcvarsall.bat" amd64`
-* Latest [Windows 64-bit standard dist of CEF](http://opensource.spotify.com/cefbuilds/index.html#windows64_builds)
-  extracted w/ `CEF_DIR` environment variable set to the base CEF extracted dir
-* This repo cloned w/ the shell at the `src` folder
-
-### Linux Prerequisites
-
-(NOTE: Linux support is not yet complete)
-
-Before running the build script on Windows, you must have the prerequisites:
-
-* Latest Qt (5.x) installed w/ `qmake` on the `PATH`
-* Latest CMake installed w/ `cmake` on the `PATH`
-* Latest Python (2.x) installed w/ `python` on the `PATH`
-* Latest Go installed w/ `go` on the `PATH`
-* Latest GCC installed w/ `gcc` and `g++` on the `PATH`
-* Latest Make installed w/ `make` on the `PATH`
-* Latest [Linux 64-bit standard dist of CEF](http://opensource.spotify.com/cefbuilds/index.html#linux64_builds)
-  extracted w/ `CEF_DIR` environment variable set to the base CEF extracted dir
-* Latest GTK 2.x installed and on the library path
-* This repo cloned w/ the shell at the `src` folder
-
-### MacOS Prerequisites
-
-(TODO)
-
-### Running Build
-
-The application uses the CEF C++ wrapper, which can be built via:
-
-    go run build.go build-cef
-
-Now the application can easily be run via:
-
-    go run build.go run
-
-That will run the `debug` version. For the `release` version, run:
-
-    go run build.go run release
-
-Internally, that just builds and runs the exe. To just build, call `build` instead. To package a deployment artifact
-from a previously run build, `package` is used. For example, to package a `release` deployment artifact from a
-previously run `release` build, run:
-
-    go run build.go package release
-
-Once complete, the package(s) will in `release/package` (e.g. doogie.zip in Windows)
-
-### Testing
-
-There are two types of tests, unit and integration tests at `tests/unit` and `tests/integration` respectively.
-
-#### Integration Tests
-
-The integration tests are not yet integrated in `build.go`. The tests are written in node.js. Make sure you have the
-latest LTS release of node installed and navigate to `src/tests/integration`. To setup the test infrastructure, run:
-
-    npm install
-
-To run the tests, make sure a debug instance of Doogie is running then run
-
-    npm test
-
-#### Unit Tests
-
-Assuming CEF is built (see the first "Running Build" step), unit tests can be run with:
-
-    go run build.go unit-test
-
-Like the `run` command, the `unit-test` command can be given a `release` target, otherwise it defaults to `debug`.
-
-### Development
-
-To do a lint check of the code, have the
-[Chromium depot_tools](https://chromium.googlesource.com/chromium/tools/depot_tools.git) cloned somewhere and set the
-`DEPOT_TOOLS_DIR` env var to the dir. Then run:
-
-    go run build.go lint
+See the [website](https://cretz.github.io/doogie/) or look directly at the guide pages in [docs/guide/](docs/guide/) for
+things like [build instructions](docs/guide/develop.md#building).

docs/404.html

@@ -1,5 +1,6 @@
 ---
-layout: default
+layout: page
+title: Not Found
 ---
 
 <style type="text/css" media="screen">

docs/_layouts/default.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <meta name="keywords" content="doogie, browser, web browser, chromium, tree style" />
-    <meta name="description" content="Doogie is a Chromium-based power browser with tree-style pages" />
+    <meta name="description" content="Doogie is a Chromium-based web browser with tree-style pages" />
     <link rel="shortcut icon" href="{{ site.github.url }}/img/doogie-icon.png">
     <title>
       {% if page.title %}{{ page.title }} - Doogie{% else %}Doogie - A Power Browser{% endif %}

docs/_layouts/guide.html

@@ -2,8 +2,20 @@
 layout: page
 ---
 
-<!-- Super simple hiding menu on mobile -->
+<!-- Guide-specific CSS -->
 <style type="text/css">
+  /* Don't let the images stretch the width */
+  img {
+    max-width: 100%;
+    max-height: 100%;
+  }
+
+  /* Move code blocks out a bit */
+  pre {
+    margin-left: 20px;
+  }
+
+  /* Super-simple hiding menu on mobile */
   @media screen and (max-width: 500px) {
     .guide-menu {
       display: none;

docs/guide/browser.md

@@ -5,22 +5,79 @@ title: Browser Usage
 
 # Browser Usage
 
+![Browser Area](../img/screenshot-browser-area.png)
+
+The central area of Doogie is the browser window which changes depending upon which browser is current in the
+[page tree](page-tree). The top of the page tree has an address bar and buttons for navigating and reloading the page.
+Hovering over a link will show the URL for the link at the bottom of the browser area.
+
 ## Navigation
 
-### Address Bar
+![Navigation Bar](../img/screenshot-navigation-bar.png)
+
+In the top bar, there are buttons for navigating backwards and forwards which are disabled if there are no more pages in
+that direction. By holding down the mouse button on either button, a list will appear that shows all pages that can be
+jumped to. The back button may also be triggered by pressing `Ctrl+PgDn`, `Ctrl+Shift+PgUp`, or `Backspace` (while
+an edit field is not focused in the browser). The front button may also be triggered by pressing `Ctrl+PgUp`,
+`Ctrl+Shift+PgDn`, or `Shift+Backspace` (whild an edit field is not focused in the browser).
+
+When there is not a page loading, there is a refresh button to the right of the address bar. Pressing this button will
+refresh the page, utilizing the cache if available. This can also be triggered via `F5`. Pressing `Ctrl` while clicking
+the button, pressing `Ctrl+F5`, or pressing `Ctrl+R` will do a refresh without utilizing the cache (i.e. a full reload).
+
+If a page is loading, the refresh button becomes a stop button. Clicking this or pressing `Escape` will cause the page
+to stop loading.
+
+## Address Bar
+
+![Autocomplete](../img/screenshot-autocomplete-simple.png)
+
+The address bar is at the top of the browser. It contains the current URL of the page. The bar can be focused for edit
+by clicking on it, pressing `Alt+2`, or pressing `Ctrl+D`.
 
-* Getting to the address bar
+While typing a URL, an autocomplete box appears with 10 matching entries based on what has been visited before. These
+are ordered by a combination of most recent and most frequent visits. Simply use the arrow keys or the mouse to select
+which autocomplete item to navigate to. Otherwise, press enter to attempt to navigate to the URL in the field.
 
-#### Autocomplete
+An item also appears in the autocomplete for searching [DuckDuckGo](https://duckduckgo.com/) for the entered phrase. To
+use another search engine, simply use the [!bang syntax](https://duckduckgo.com/bang).
 
-### Page Load (stop/start)
+## SSL/TLS Info
 
-### Direction
+Once a page has finished loading, a lock icon will appear to the left of the address bar showing how secure the page is.
+The lock has four states:
 
-### SSL Info
+* ![No HTTPS](../img/screenshot-ssl-unlock-gray.png) unlocked and grayed out - The page is not secured by HTTPS.
+* ![Good HTTPS](../img/screenshot-ssl-lock-green.png) locked and green - The page is validly secured via HTTPS.
+* ![Mixed Content](../img/screenshot-ssl-unlock-orange.png) unlocked and orange - Only some of the page is secured via
+  HTTPS.
+* ![Bad HTTPS](../img/screenshot-ssl-unlock-red.png) locked and green - The page is on HTTPS but invalidly secured.
 
-### Zoom/fullscreen
+Unless the lock icon is grayed out, it can be clicked to see more SSL information such as the certificate itself.
+
+![SSL Info](../img/screenshot-ssl-popup.png)
 
 ## Find in Page
 
-## Dev Tools
+![Find in Page](../img/screenshot-find-in-page.png)
+
+Pressing `Ctrl+F` in a page opens the find bar at the bottom of the page. Typing in this field highlights found items
+and shows the total number of items. Clicking the down button or pressing `Enter` moves to the first item and
+continually doing so `Enter` goes forward. Clicking the up button or pressing `Shift+Enter` goes backwards. To remove
+the find bar, simply press `Escape` while in the find box.
+
+## Zoom and Fullscreen
+
+To zoom in on a page, press `Ctrl` and `+` (or `Ctrl` and `=`). This will zoom in the page by 10%. To zoom out by 10%,
+press `Ctrl` and `-`. To reset the zoom back to the normal 100%, press `Ctrl` and `0`.
+
+To fullscreen the current page, press `F11`. To exit fullscreen, press `F11` again or press `Escape`.
+
+## Dev Tools
+
+![Dev Tools](../img/screenshot-dev-tools.png)
+
+If the dev tools dock window is not open, pressing `F12` will open the window and open dev tools for the current page.
+If the dev tools dock window is open, but dev tools is not open for the current page, pressing `F12` or clicking the
+"open" button in the dock window will open dev tools for the current page. If the dev tools is visible and open for the
+current page, pressing `F12` will close dev tools for all pages and close the dock window.

docs/guide/bubble.md

@@ -5,8 +5,61 @@ title: Bubbles
 
 # Bubbles
 
-## On page tree
+A bubble is a context a page resides in. A bubble has its own settings including the cache path which means two pages
+can be side-by-side in the page tree but open in different bubbles set to different paths meaning things like cookies
+aren't shared. Or a bubble may have JavaScript disabled and a user can easily have the "no JS" bubble be the default and
+switch to a more full-featured bubble as needed.
 
-## Settings
+## On Page Tree
 
-## Examples
+Each bubble has a name and may have an icon that identifies it. Every page is opened in a bubble. The default bubble
+when Doogie is first installed is named "(default)" and has no icon. The icon for a page's bubble appears on the page
+tree just to the left of the **X** close button. For example, if there is a bubble for "Home" that is a green bed icon
+and another for "Work" that is a blue briefcase, here's how the pages might look opened in both:
+
+![Bubbles Simple](../img/screenshot-bubbles-simple.png)
+
+By default, a page is opened in the bubble of its parent page. If there is no parent page, a bubble is opened in the
+top-most bubble in the profile's bubble list (see [Management](#management)).
+
+### Changing a Page's Bubble
+
+To change a bubble for an individual page, right click the bubble icon (or where the icon would be if it existed) which
+is just to the left of the **X** close button for the tree.
+
+![Change Bubble](../img/screenshot-change-bubble.png)
+
+The currently selected bubble will be checked and not selectable. Select any other bubble to change it. To change the
+page to a new bubble, click `New Bubble...` and the [settings](#settings) dialog will appear. Upon successful save of
+the new bubble, the page will be changed to it.
+
+Changing the bubble for multiple pages is also supported via [page actions](page-tree#page-actions). For example, to
+change a bubble for several pages, select them and right-click.
+
+![Change Multiple Bubble](../img/screenshot-change-bubble-multiple.png)
+
+This menu can be used the same way as the individual page bubble menu. The same applies to clicked-on page, current
+page, and all pages via the page tree menu.
+
+## Management
+
+The `Bubbles` tab in the [profile settings dialog](general#profile-settings) is where bubbles are managed.
+
+![Bubbles Settings](../img/screenshot-profile-settings-bubbles.png)
+
+The top-most bubble is the bubble that top-level pages will be opened in by default. To move a bubble around in the
+list, select it and click the button for moving it down or up.
+
+Bubbles can be added, edited, or deleted here. Note, bubbles that currently have visible pages in them cannot be edited
+or deleted until all of the pages within them are closed. A new bubble can be created with `New Bubble` or via the page
+tree menu item. An eligible bubble can be edited by double clicking on it or clicking the `Edit Selected` button.
+
+### Settings
+
+The bubble's setting dialog appears when adding or editing a bubble.
+
+![Bubble Settings](../img/screenshot-bubble-settings.png)
+
+The settings dialog includes a way to set the name and icon of the bubble. The name must be unique. The icon is
+optional and, if present, a color override can be applied. All other settings are basically overrides for 
+[profile settings](general#profile-settings).