You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@age.apache.org by ey...@apache.org on 2021/02/09 20:55:45 UTC

[incubator-age] 01/18: Initial commit

This is an automated email from the ASF dual-hosted git repository.

eya pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-age.git

commit 1a8c3f999f5e46eeb68e3702c5ed66288f752e92
Author: Nick Sorrell <ni...@cint.io>
AuthorDate: Tue Dec 1 14:26:12 2020 -0500

    Initial commit
---
 .prettierrc                                |   7 +
 assets/images/favicon/apple-touch-icon.png | Bin 0 -> 12028 bytes
 assets/images/favicon/favicon-16x16.png    | Bin 0 -> 1893 bytes
 assets/images/favicon/favicon-32x32.png    | Bin 0 -> 2837 bytes
 assets/images/logo.png                     | Bin 0 -> 15864 bytes
 assets/scripts/index.js                    |  21 +++
 assets/styles/index.css                    | 120 ++++++++++++
 index.html                                 | 285 +++++++++++++++++++++++++++++
 8 files changed, 433 insertions(+)

diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..daf741e
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,7 @@
+{
+    "useTabs": false,      
+    "printWidth": 180,      
+    "tabWidth": 2,         
+    "singleQuote": false,  
+    "trailingComma": "none"
+}
\ No newline at end of file
diff --git a/assets/images/favicon/apple-touch-icon.png b/assets/images/favicon/apple-touch-icon.png
new file mode 100755
index 0000000..755da9c
Binary files /dev/null and b/assets/images/favicon/apple-touch-icon.png differ
diff --git a/assets/images/favicon/favicon-16x16.png b/assets/images/favicon/favicon-16x16.png
new file mode 100755
index 0000000..7e3e4c3
Binary files /dev/null and b/assets/images/favicon/favicon-16x16.png differ
diff --git a/assets/images/favicon/favicon-32x32.png b/assets/images/favicon/favicon-32x32.png
new file mode 100755
index 0000000..325f38b
Binary files /dev/null and b/assets/images/favicon/favicon-32x32.png differ
diff --git a/assets/images/logo.png b/assets/images/logo.png
new file mode 100755
index 0000000..da70215
Binary files /dev/null and b/assets/images/logo.png differ
diff --git a/assets/scripts/index.js b/assets/scripts/index.js
new file mode 100644
index 0000000..6b19243
--- /dev/null
+++ b/assets/scripts/index.js
@@ -0,0 +1,21 @@
+var handleClick = function (el) {
+  decorateSidebar(el);
+  showMainContent(el);
+}
+
+var decorateSidebar = function (el) {
+  let items = document.getElementsByClassName("sidebar-item");
+  for (let i = 0; i < items.length; i++) {
+    items[i].classList.remove("sidebar--selected");
+  }
+  el.parentElement.classList.add("sidebar--selected");
+}
+
+var showMainContent = function (el) {
+  let items = document.getElementsByClassName("main-item");
+  for (let i = 0; i < items.length; i++) {
+    items[i].classList.remove("main--selected");
+  }
+  let divId = "main-" + el.parentElement.id.split("-")[1];
+  document.getElementById(divId).classList.add("main--selected");
+}
\ No newline at end of file
diff --git a/assets/styles/index.css b/assets/styles/index.css
new file mode 100644
index 0000000..8b6e3cd
--- /dev/null
+++ b/assets/styles/index.css
@@ -0,0 +1,120 @@
+.root {
+  display: grid;
+  grid-template-columns: 1.5fr 5fr;
+  grid-template-rows: 20vh 80vh;
+  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
+  max-width: 1600px;
+  margin: auto;
+}
+
+/*
+ *   HEADER 
+ */
+
+.header {
+  grid-column: 1 / -1;
+  background-color: black;
+  padding-bottom: 0.5rem;
+}
+
+.header--title {
+  color: antiquewhite;
+  font-size: 1.3rem;
+  padding-left: 1rem;
+}
+
+.header--hamburger {
+  display: none;
+  float: right;
+  top: 1rem;
+  right: 1rem;
+  position: fixed;
+}
+
+.header--hamburger-div {
+  width: 35px;
+  height: 5px;
+  background-color: white;
+  margin: 6px 0;
+}
+
+/*
+ *   SIDEBAR
+ */
+
+.sidebar {
+  grid-column: 1 / 2;
+  grid-row: 2;
+  background-color: rgb(240, 239, 239);
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+.sidebar--selected {
+  border-bottom: 1px dotted blue;
+}
+
+.sidebar--selected::before {
+  content: "➔";
+}
+
+.sidebar-link {
+  text-decoration: none;
+  color: black;
+}
+
+/*
+ *   MAIN AREA 
+ */
+
+.main {
+  grid-column: 2 / 3;
+  grid-row: 2;
+  padding-right: 2rem;
+}
+
+.main-body {
+  padding-left: 1rem;
+}
+
+.main-item {
+  display: none;
+}
+
+.main--selected {
+  display: contents;
+}
+
+/*
+ *   GENERAL 
+ */
+
+.emph {
+  font-weight: 700;
+}
+
+.title {
+  font-size: 3rem;
+  padding-bottom: 1rem;
+  padding-left: 1rem;
+}
+
+.subtitle {
+  font-size: 2rem;
+  padding-left: 1rem;
+}
+
+.code {
+  margin: 1rem;
+  background-color: lightgoldenrodyellow;
+  font-family: "Courier New", Courier, monospace;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-bottom: 1rem;
+  white-space: pre-line;
+}
+
+.external-link::after {
+  color: blue;
+  content: "➚";
+}
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..8f0a151
--- /dev/null
+++ b/index.html
@@ -0,0 +1,285 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta name="description" content="Apache AGE - PostgreSQL extension for graph database functionality" />
+    <meta name="theme-color" content="#ffffff" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <link rel="stylesheet" href="assets/styles/index.css" />
+    <link rel="apple-touch-icon" sizes="180x180" href="assets/images/favicon/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="assets/images/favicon/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicon/favicon-16x16.png" />
+
+    <title>Apache AGE - PostgreSQL extension for graph database functionality</title>
+
+    <script type="text/javascript" src="assets/scripts/index.js"></script>
+  </head>
+
+  <body>
+    <div class="root">
+      <div class="header">
+        <img src="assets/images/logo.png" width="250px" />
+        <div class="header--title">A Graph Extension for PostgreSQL</div>
+        <div class="header--hamburger" id="menu">
+          <div class="header--hamburger-div"></div>
+          <div class="header--hamburger-div"></div>
+          <div class="header--hamburger-div"></div>
+        </div>
+      </div>
+
+      <div class="sidebar">
+        <p class="sidebar--section">
+          <span class="emph">APACHE AGE</span><br />
+          <span id="sidebar-overview" class="sidebar-item sidebar--selected"> <a class="sidebar-link" href="#" onclick="handleClick(this)">Overview</a></span> <br />
+          <!-- FAQs <br /> -->
+          <span id="sidebar-license" class="sidebar-item"> <a class="sidebar-link" href="#" onclick="handleClick(this)">License</a></span> <br />
+          <!-- Downloads <br /> -->
+          <span id="sidebar-roadmap" class="sidebar-item"> <a class="sidebar-link" href="#" onclick="handleClick(this)">Roadmap</a></span> <br />
+        </p>
+
+        <p class="sidebar--section">
+          <span class="emph">DOCUMENTATION</span> <br />
+          <span id="sidebar-installing" class="sidebar-item"> <a class="sidebar-link" href="#" onclick="handleClick(this)">Installing AGE</a></span> <br />
+          <span id="sidebar-gettingstarted" class="sidebar-item"> <a class="sidebar-link" href="#" onclick="handleClick(this)">Getting Started</a></span> <br />
+          Glossary <br />
+        </p>
+
+        <p class="sidebar--section">
+          <span class="emph">CONTRIBUTION</span> <br />
+          Welcome <br />
+          Committer Guide <br />
+          Coding Guideline <br />
+        </p>
+
+        <p class="sidebar--section">
+          <span class="emph">COMMUNITY</span> <br />
+          Team <br />
+          Mailing List <br />
+          <a class="sidebar-link external-link" target="_" href="https://issues.apache.org/jira/projects/AGE/issues">Issue Tracker</a> <br />
+          <a class="sidebar-link external-link" target="_" href="https://github.com/apache/incubator-age">Github</a> <br />
+        </p>
+
+        <p class="sidebar--section">
+          <span class="emph">ASF</span> <br />
+          <a class="sidebar-link external-link" target="_" href="https://www.apache.org/foundation/">Apache Software Foundation</a> <br />
+          <a class="sidebar-link external-link" target="_" href="https://www.apache.org/foundation/how-it-works.html">How Apache Works</a> <br />
+          <a class="sidebar-link external-link" target="_" href="https://www.apache.org/foundation/sponsorship.html">Sponsorship</a> <br />
+          <a class="sidebar-link external-link" target="_" href="https://www.apache.org/foundation/thanks.html">Thanks</a> <br />
+        </p>
+      </div>
+
+      <div class="main">
+        <!-- 
+          *
+          * AGE 
+          *
+        -->
+        <div class="main-item main--selected" id="main-overview">
+          <div class="title">Apache AGE (Incubating)</div>
+          <div class="main-body">
+            <p class="main-content">
+              Apache AGE a PostgreSQL extension that provides graph database functionality. AGE is an acronym for AgensGraph Extension, and is inspired by Bitnine's fork of
+              PostgreSQL 10, AgensGraph, which is a multi-model database. The goal of the project is to create single storage that can handle both relational and graph model data
+              so that users can use standard ANSI SQL along with openCypher, the Graph query language.
+            </p>
+
+            <div class="subtitle">Features</div>
+          </div>
+        </div>
+        <div class="main-item" id="main-license">
+          <div class="title">License</div>
+          <div class="main-body">Apache AGE is licensed under <a target="_" href="http://www.apache.org/licenses/LICENSE-2.0.html">Apache License, version 2.0</a></div>
+        </div>
+        <div class="main-item" id="main-roadmap">
+          <div class="title">Roadmap</div>
+          <div class="main-body">here is the roadmap</div>
+        </div>
+
+        <!-- 
+          *
+          * DOCUMENTATION 
+          *
+        -->
+        <div class="main-item" id="main-installing">
+          <div class="title">Installing AGE</div>
+          <div class="subtitle">Using Docker</div>
+          <div class="main-body">
+            Docker images are available on Docker Hub and are based on the official PostgreSQL 11 Debian and Alpine images. <br />
+            <ul>
+              <li><a class="external-link" target="_" href="https://hub.docker.com/r/sorrell/agensgraph-extension">Debian AGE</a></li>
+              <li><a class="external-link" target="_" href="https://hub.docker.com/r/sorrell/agensgraph-extension-alpine">Alpine AGE</a></li>
+            </ul>
+          </div>
+          <div class="subtitle">Installing from source</div>
+          <div class="main-body">
+            Building AGE from source depends on the following Linux libraries (Ubuntu package names shown below):
+
+            <div class="code">$ sudo apt-get install bison build-essential flex postgresql-server-dev-11</div>
+
+            The build process will attempt to use the first path in the PATH environment variable when installing AGE. If the pg_config path if located there, run the following
+            command in the source code directory of Apache AGE to build and install the extension.
+
+            <div class="code">$ make install</div>
+
+            If the path to your Postgres installation is not in the PATH variable, add the path in the arguements:
+
+            <div class="code">$ make PG_CONFIG=/path/to/postgres/bin/pg_config install</div>
+
+            Since Apache AGE will be installed in the directory of the PostgreSQL installation, proper permissions on the directory are required. Run the following statements in
+            psql to create and load age in PostgreSQL.
+
+            <div class="code">
+              =# CREATE EXTENSION age; -- run this statement only once
+              CREATE EXTENSION
+              =# LOAD 'age'; 
+              LOAD 
+              =# SET search_path = ag_catalog, "$user", public; 
+              SET
+            </div>
+          </div>
+        </div>
+        <div class="main-item" id="main-gettingstarted">
+          <div class="title">Getting Started</div>
+          <div class="main-body">
+            <div class="subtitle">Loading AGE</div>
+            Connect to your containerized Postgres instance and then run the following commands:
+
+            <div class="code">
+            CREATE EXTENSION age;
+            LOAD 'age';
+            SET search_path = ag_catalog, "$user", public;
+            </div>
+            
+            <div class="subtitle">Using AGE</div>
+            First you will need to create a graph:
+
+            <div class="code">
+              SELECT create_graph('my_graph_name');
+            </div>
+
+            To execute Cypher queries, you will need to wrap them in the following syntax:
+
+            <div class="code">
+              SELECT * from cypher('my_graph_name', $$
+                CypherQuery
+              $$) as (a agtype);
+            </div>
+
+            For example, if we wanted to create a graph with 4 nodes, we could do something as shown below:
+
+            <div class="code">
+              SELECT * from cypher('my_graph_name', $$
+                CREATE (a:Part {part_num: '123'}), 
+                      (b:Part {part_num: '345'}), 
+                      (c:Part {part_num: '456'}), 
+                      (d:Part {part_num: '789'})
+              $$) as (a agtype);
+  
+              --- RESULTS
+              a
+              ---
+              (0 rows)
+            </div>
+
+            Then we could query the graph with the following:
+
+            <div class="code">
+              SELECT * from cypher('my_graph_name', $$
+                MATCH (a)
+                RETURN a
+              $$) as (a agtype);
+  
+              --- RESULTS
+                                                        a
+              -------------------------------------------------------------------------------------
+              {"id": 844424930131969, "label": "Part", "properties": {"part_num": "123"}}::vertex
+              {"id": 844424930131970, "label": "Part", "properties": {"part_num": "345"}}::vertex
+              {"id": 844424930131971, "label": "Part", "properties": {"part_num": "456"}}::vertex
+              {"id": 844424930131972, "label": "Part", "properties": {"part_num": "789"}}::vertex
+              (4 rows)
+            </div>
+
+            Next, we could create a relationship between a couple of nodes:
+
+            <div class="code">
+              SELECT * from cypher('my_graph_name', $$
+                MATCH (a:Part {part_num: '123'}), (b:Part {part_num: '345'})
+                CREATE (a)-[u:used_by { quantity: 1 }]->(b)
+              $$) as (a agtype);
+  
+              --- RESULTS
+              a
+              ---
+              (0 rows)
+            </div>
+
+            Next we can return the path we just created (results have been formatted for readability):
+            
+            <div class="code">
+              SELECT * from cypher('age', $$
+                MATCH p=(a)-[]-(b)
+                RETURN p
+              $$) as (a agtype);
+  
+              // RESULTS
+              // ROW 1
+              [
+                {
+                    "id":844424930131969,
+                    "label":"Part",
+                    "properties":{
+                      "part_num":"123"
+                    }
+                }::"vertex",
+                {
+                    "id":1125899906842625,
+                    "label":"used_by",
+                    "end_id":844424930131970,
+                    "start_id":844424930131969,
+                    "properties":{
+                      "quantity":1
+                    }
+                }::"edge",
+                {
+                    "id":844424930131970,
+                    "label":"Part",
+                    "properties":{
+                      "part_num":"345"
+                    }
+                }::"vertex"
+              ]::"path"
+              // ROW 2
+              [
+                {
+                    "id":844424930131970,
+                    "label":"Part",
+                    "properties":{
+                      "part_num":"345"
+                    }
+                }::"vertex",
+                {
+                    "id":1125899906842625,
+                    "label":"used_by",
+                    "end_id":844424930131970,
+                    "start_id":844424930131969,
+                    "properties":{
+                      "quantity":1
+                    }
+                }::"edge",
+                {
+                    "id":844424930131969,
+                    "label":"Part",
+                    "properties":{
+                      "part_num":"123"
+                    }
+                }::"vertex"
+              ]::"path"
+              (2 rows)
+            </div>
+
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>