First commit. Module is in D8 structure

.github/workflows/phpunit.yml

@@ -0,0 +1,115 @@
+
+name: Run PHPUnit Tests
+
+# Controls when the workflow will run.
+# Run this workflow every time a new commit is pushed to your repository
+on: [push, pull_request]
+
+jobs:
+  # This key is the name of the job.
+  run-tests:
+    # The type of system that the job will run on.
+    runs-on: ubuntu-latest
+    # Matrix Build for this job.
+    strategy:
+      matrix:
+        php-versions: ['7.1', '7.2']
+    # Name the matrix build so we can tell them apart.
+    name: PHP Unit Testing of Tripal D3 (PHP ${{ matrix.php-versions }})
+
+    # Service containers to run with `run-tests`
+    services:
+      # Label used to access the service container
+      postgres:
+        # Docker Hub image
+        image: postgres
+        env:
+          POSTGRES_USER: tripaladmin
+          POSTGRES_PASSWORD: somesupersecurepassword
+          POSTGRES_DB: testdb
+        # Set health checks to wait until postgres has started
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+        ports:
+          # Maps tcp port 5432 on service container to the host
+          - 5432:5432
+
+    steps:
+    # 1) Checkout the repository and setup workspace.
+    - uses: actions/checkout@v2
+
+    # 2) Setup PHP according to the version passed in.
+    - name: Setup PHP
+      uses: shivammathur/setup-php@v2
+      with:
+        php-version: ${{ matrix.php-versions }}
+        extensions: mbstring, intl, php-pgsql, php-gd, php-xml
+        ini-values: memory_limit=2G
+        coverage: xdebug
+        tools: composer, phpunit
+
+    # 3) Install Drush/Drupal8/Tripal4
+    - name: Setup Drush, Drupal 8.x, Tripal 4.x
+      id: tripalsetup
+      uses: tripal/t4d8@9.x-4.x
+      with:
+        postgres_user: tripaladmin
+        postgres_pass: somesupersecurepassword
+        postgres_db: testdb
+
+
+    # LIBRARIES:
+
+    # 4) Install D3 Libraries
+    - name: Install D3 Libraries
+      id: installd3
+      env:
+        DRUSH: ${{ steps.tripalsetup.outputs.drush_path }}
+        DRUPAL_ROOT: ${{ steps.tripalsetup.outputs.drupal_root }}
+      run: |
+        cd $DRUPAL_ROOT/sites/all/assets/vendor
+        wget https://github.com/d3/d3/releases/download/v3.5.14/d3.zip && unzip d3.zip
+        mkdir d3 && mv d3.js d3/ && mv d3.min.js d3/
+
+
+    # DEPENDENCIES:
+
+    # 5) Install Libraries Dependencies
+    - name: Install Libraries Dependencies
+      id: installlibraries
+      env:
+        DRUSH: ${{ steps.tripalsetup.outputs.drush_path }}
+        DRUPAL_ROOT: ${{ steps.tripalsetup.outputs.drupal_root }}
+      run: |
+        cd $DRUPAL_ROOT
+        $DRUSH en libraries -y
+
+
+    # 6) Install Tripal D3.
+    - name: Install Tripal D3
+      id: installtripald3
+      env:
+        DRUSH: ${{ steps.tripalsetup.outputs.drush_path }}
+        DRUPAL_ROOT: ${{ steps.tripalsetup.outputs.drupal_root }}
+      run: |
+        cd $DRUPAL_ROOT/sites/all/modules
+        git clone https://github.com/tripal/tripald3.git
+        git checkout checkout 9.x-2.x
+        cd $DRUPAL_ROOT
+        $DRUSH en -y tripald3
+
+    # 7) Runs the PHPUnit tests.
+    # https://github.com/mheap/phpunit-github-actions-printer is used
+    # to report PHPUnit fails in a meaningful way to github in PRs.
+    - name: PHPUnit Tests
+      env:
+        DRUSH: ${{ steps.tripalsetup.outputs.drush_path }}
+        DRUPAL_ROOT: ${{ steps.tripalsetup.outputs.drupal_root }}
+      run: |
+        cd $DRUPAL_ROOT/modules/tripald3
+        composer require --dev mheap/phpunit-github-actions-printer --quiet
+        composer update --quiet
+        ./vendor/bin/phpunit --printer mheap\\GithubActionsReporter\\Printer

.gitignore

@@ -1,3 +1,2 @@
-
+**/.DS_Store
 _build/
-

README.md

@@ -5,14 +5,14 @@ Provides d3.js integration for Tripal. It provides an API for developing consist
 NOTE: This module is an API and does not provide user facing diagrams. Rather, you would use this API to easily draw common diagrams within your own fields. For an example of how to use this module, see [Tripal Fancy Fields](https://github.com/tripal/trpfancy_fields).
 
 ## Quickstart
-1. Unpack the [D3 v3 javascript library](https://github.com/d3/d3/releases?after=v4.0.0) in your Drupal Libraries directory (quick check, you should have a libraries/d3/d3.min.js file; for more information see the drupal.org documentation).
-2. Download and install this module as you would any other Drupal module ([Documentation](https://www.drupal.org/documentation/install/modules-themes>))
+1. Unpack the [D3 v3 javascript library](https://github.com/d3/d3/releases/download/v3.5.14/d3.zip) in your Drupal 8 Libraries directory (sites/all/assets/vendor/d3).
+2. Download and install this module as you would any other Drupal module ([Documentation](https://www.drupal.org/docs/extending-drupal/installing-modules))
 3. (Optional) Go to Admin » Tripal » Extension Modules » Tripal D3 Diagrams to configure colour schemes, etc.
 
 ### Dependencies
-1. [Tripal 3.x](https://www.drupal.org/project/tripal)
+1. [Tripal 4.x](https://www.drupal.org/project/tripal)
 2. [Drupal Libraries API](https://www.drupal.org/project/libraries)
-3. [D3 v3 javascript library](https://github.com/d3/d3/releases?after=v4.0.0)
+3. [D3 v3 javascript library](https://github.com/d3/d3/releases/download/v3.5.14/d3.zip)
 
 ## Browser Support
 All Diagrams Tested on:

config/install/tripald3.settings.yml

@@ -0,0 +1,6 @@
+# Auto-resize svg canvass, default to false
+tripald3_autoResize: FALSE
+# Colour scheme, default to Blue orange.
+tripald3_colorScheme: BlOr
+# Stock pedigree terms used, default to empty.
+tripald3_stock_pedigree_rels: 

css/testpage.css

@@ -0,0 +1,33 @@
+div.test, pre.data, div.chart {
+  border: 1px solid #e0e0d8;
+}
+
+div.test {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  height: 400px;
+}
+
+div.test div.chart {
+  padding: 15px;
+}
+
+div.test pre {
+  margin: 0;
+  overflow: scroll;
+  font-size: 10px;
+  flex-grow: 1;
+}
+
+div.test svg {
+  border: 1px solid #e0e0d8;
+}
+
+div#test0 {
+  height: 100px;
+}
+
+div#test0 .data {
+  color: red;
+}

css/tripald3.css

@@ -1,4 +1,3 @@
-
 .tripald3-diagram {
   width: 500px;
 }
@@ -66,5 +65,5 @@ svg.tripald3-tree .tree-node {
 }
 
 .tripald3-default-watermark {
-  background-image: url(watermark.png);
+  background-image: url('../templates/image/watermark.png');
 }

css/watermark.css

@@ -13,5 +13,5 @@
 }
 
 .tripald3-default-watermark {
-  background-image: url(watermark.png);
+  background-image: url('../templates/image/watermark.png');
 }

docs/api/placeWatermark.rst

@@ -14,7 +14,7 @@ This function places a watermark overlay to diagrams to indicate proprietary con
     // Draw.
     tripalD3.drawFigure(data, {'chartType' : 'multidonut', 'elementId' : 'multidonut', ....});
 
-    // Watermark. Use default image in ``/css/watermark.png`` as watermark.
+    // Watermark. Use default image in ``/templates/image/watermark.png`` as watermark.
     tripalD3.placeWatermark();
 
     // OR use alternate image.
@@ -31,7 +31,7 @@ def ``placeWatermark(options)``:
 
   :options: A javascript object with the following key:
 
-    :watermark: by default this function will use the image located in ``/css/watermark.png`` as the preselected watermark. This can be
+    :watermark: by default this function will use the image located in ``/templates/image/watermark.png`` as the preselected watermark. This can be
     used when site requires a unified watermark across all visualizations (site-wide), simply by replacing the said image with
     the desired logotype (be sure to use the same filename). If the site requires a different image for one diagram in a page to another
     diagram in another page, this option can be used to alter the default watermark by supplying a path to an image (see example).

docs/dev_guide.rst

@@ -17,5 +17,5 @@ This guide contains tutorials for using the Tripal D3.js API to add diagrams to
 Additional Information
 ------------------------
 
- - Examples on how to use each chart in ``templates/tripald3_demo_page.tpl.php`` and viewed at Admin » Tripal » Extension Modules » Tripal D3 Diagrams » Demo
+ - Examples on how to use each chart in ``templates/tripald3_demo_page.html.twig`` and viewed at Admin » Tripal » Extension Modules » Tripal D3 Diagrams » Demo
  - In-code documentation for all functions and chart types in `js/tripalD3.*.js`

docs/dev_guide/color_scheme.rst

@@ -13,9 +13,9 @@ Making your own colour scheme available to this module is as simple as implement
     $color_schemes = array();
 
     // This key should be unique across colour schemes.
-    $color_schemes['PrpGr'] = array(
+    $color_schemes['BlkGr'] = array(
       // This name will show up in the colour scheme configuration
-      'name' => 'Purple-Green',
+      'name' => 'Black-Green',
       // These are the colours your colour scheme consists of.
       'colors' => array('#3d4051', '#753fb0', '#8f7abf', '#294090', '#6683c3', '#0C6758', '#7AB318', '#A0C55E', '#9fa7a3'),
       'pick order' => array(