React/regl client app for displaying point-in-polygon point clouds.

modules/cudf/src/column.cpp

@@ -49,6 +49,8 @@ Napi::Function Column::Init(Napi::Env const& env, Napi::Object exports) {
                        // column/filling.cpp
                        InstanceMethod<&Column::fill>("fill"),
                        InstanceMethod<&Column::fill_in_place>("fillInPlace"),
+                       // column/repeat.cpp
+                       InstanceMethod<&Column::repeat>("repeat"),
                        // column/binaryop.cpp
                        InstanceMethod<&Column::add>("add"),
                        InstanceMethod<&Column::sub>("sub"),

modules/cudf/src/column.ts

@@ -249,6 +249,16 @@ export interface Column<T extends DataType = any> {
    */
   fill(value: Scalar<T>, begin?: number, end?: number, memoryResource?: MemoryResource): Column<T>;
 
+  /**
+   * Repeats the values of this n times.
+   *
+   * @param repeats The number of times to repeat the column.
+   * @param memoryResource The optional MemoryResource used to allocate the result Column's device
+   *   memory.
+   */
+  repeat(value: Scalar<T>, begin?: number, end?: number, memoryResource?: MemoryResource):
+    Column<T>;
+
   /**
    * Fills a range of elements in-place in a column with a scalar value.
    *

modules/cudf/src/node_cudf/column.hpp

@@ -717,6 +717,11 @@ struct Column : public EnvLocalObjectWrap<Column> {
     cudf::scalar const& value,
     rmm::mr::device_memory_resource* mr = rmm::mr::get_current_device_resource());
 
+  // column/filling/repeat.cpp
+  Column::wrapper_t repeat(
+    cudf::size_type repeats,
+    rmm::mr::device_memory_resource* mr = rmm::mr::get_current_device_resource());
+
   // column/replace.cpp
   Column::wrapper_t replace_nulls(
     cudf::column_view const& replacement,

modules/cudf/src/series.ts

@@ -811,6 +811,27 @@ export class AbstractSeries<T extends DataType = any> {
       this._col.fill(new Scalar({type: this.type, value}), begin, end, memoryResource));
   }
 
+  /**
+   * Repeats a Series n times, returning a new Series.
+   *
+   * @param repeats The number of times to repeat this.
+   *
+   * @example
+   * ```typescript
+   * import {Series} from '@rapidsai/cudf';
+   *
+   * // Float64Series
+   * Series.new([1, 2, 3]).repeat(2) // [1, 2, 3, 1, 2, 3]
+   * // StringSeries
+   * Series.new(["foo", "bar", "test"]).repeat(2) // ["foo", "bar", "test", "foo", "bar", "test"]
+   * // Bool8Series
+   * Series.new([true, true, true]).repeat(2) // [true, false, false, true, false, false]
+   * ```
+   */
+  repeat(repeats: T['scalarType'], memoryResource?: MemoryResource): Series<T> {
+    return this.__construct(this._col.repeat(repeats, memoryResource));
+  }
+
   /**
    * Fills a range of elements in-place in a column with a scalar value.
    *

modules/demo/api-server/index.js

@@ -19,7 +19,7 @@ const Path = require('path');
 // Change cwd to the example dir so relative file paths are resolved
 process.chdir(__dirname);
 
-const fastify = require.resolve('fastify-cli/cli.js');
+const fastify = require.resolve('fastify-cli/cli.js')({logger: true});
 
 const {spawnSync} = require('child_process');
 

modules/demo/api-server/routes/gpu/index.js

@@ -0,0 +1,84 @@
+// Copyright (c) 2022, NVIDIA CORPORATION.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+const Fs                                                               = require('fs');
+const {Utf8String, Int32, Uint32, Float32, DataFrame, Series, Float64} = require('@rapidsai/cudf');
+const {RecordBatchStreamWriter, Field, Vector, List, Table}            = require('apache-arrow');
+const Path                                                             = require('path');
+const {promisify}                                                      = require('util');
+const Stat                                                             = promisify(Fs.stat);
+const fastifyCors                                                      = require('@fastify/cors');
+const fastify                                                          = require('fastify');
+
+const arrowPlugin = require('fastify-arrow');
+const gpu_cache   = require('../../util/gpu_cache.js');
+const root_schema = require('../../util/schema.js');
+
+module.exports = async function(fastify, opts) {
+  fastify.register(arrowPlugin);
+  fastify.register(fastifyCors, {origin: '*'});
+  fastify.decorate('setDataframe', gpu_cache.setDataframe);
+  fastify.decorate('getDataframe', gpu_cache.getDataframe);
+  fastify.decorate('gpu', gpu_cache);
+
+  const get_handler =
+    async (request, reply) => {
+    const query = request.query;
+    request.log.info('Parsing Query:');
+    request.log.info(query);
+    request.log.info('Sending query to gpu_cache');
+    request.log.info('Updating result');
+    request.log.info('Sending cache.tick');
+    let result = {
+      'params': JSON.stringify(query),
+      success: true,
+      message: `gpu method:${request.method} placeholder`,
+      statusCode: 200
+    };
+    return result
+  }
+
+  const post_handler =
+    async (request, reply) => {
+    const query = request.query;
+    request.log.info('Parsing Query:');
+    request.log.info(query);
+    request.log.info('Sending query to gpu_cache');
+    request.log.info('Updating result');
+    request.log.info('Sending cache.tick');
+    let result = {
+      'params': JSON.stringify(query),
+      success: true,
+      message: `gpu method:${request.method} placeholder`,
+      statusCode: 200
+    };
+    return result
+  }
+
+  const get_schema = {
+    logLevel: 'debug',
+    schema: {
+      response: {
+        200: {
+          type: 'object',
+          properties:
+            {success: {type: 'boolean'}, message: {type: 'string'}, params: {type: 'string'}}
+        }
+      }
+    }
+  };
+
+  fastify.get('/', {...get_schema, handler: get_handler});
+  fastify.post('/', {...get_schema, handler: post_handler});
+}

modules/demo/api-server/util/schema.js

@@ -15,6 +15,17 @@
 'use strict';
 
 const schema = {
+  gpu: {
+    description: 'An abstract interface to the node-rapids api, supported by a server.',
+    schema: {
+      '/': {
+        method: 'The name of the method to apply to gpu_cache data.',
+        caller: 'Either an object that has been stored in the gpu_cache or a static module name.',
+        arguments: 'Correctly specified arguments to the gpu_cache method.',
+        result: 'Either a result code specifying success or failure or an arrow data buffer.',
+      }
+    }
+  },
   graphology: {
     description: 'The graphology api provides GPU acceleration of graphology datasets.',
     schema: {

modules/demo/particles/.eslintrc

@@ -0,0 +1,63 @@
+{
+  "extends": [
+    "plugin:react/recommended",
+    "airbnb",
+    "plugin:import/errors",
+    "prettier",
+    "prettier/react"
+  ],
+  "parserOptions": {
+    "ecmaVersion": 11,
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "globals": {
+    "benchmark": "readonly",
+    "suite": "readonly"
+  },
+  "env": {
+    "browser": true,
+    "es2020": true,
+    "node": true,
+    "mocha": true
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "plugins": [
+    "prettier",
+    "react"
+  ],
+  "rules": {
+    "react/jsx-filename-extension": [
+      1,
+      {
+        "extensions": [
+          ".jsx"
+        ]
+      }
+    ],
+    "react/prop-types": 0,
+    "no-multi-assign": 0,
+    "arrow-body-style": [
+      "error",
+      "as-needed"
+    ],
+    "prettier/prettier": [
+      "error",
+      {
+        "trailingComma": "all",
+        "singleQuote": true,
+        "printWidth": 120
+      }
+    ],
+    "no-restricted-syntax": [
+      0,
+      "ForOfStatement"
+    ],
+    "max-classes-per-file": 0
+  }
+}

modules/demo/particles/.gitignore

@@ -0,0 +1,7 @@
+.vscode
+node_modules
+*.DS_Store
+build
+coverage
+.nyc_output
+yarn-error.log

modules/demo/particles/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Mik
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

modules/demo/particles/README.md

@@ -0,0 +1,58 @@
+# `react-webgl-app`
+
+Boilerplate to create a minimal React & WebGL app.
+
+![Example](public/images/example.png)
+
+It is made using [rollup-react-app](https://github.com/mikbry/RollupReactApp). The WebGL code is an heavily modified example from [Mozilla](https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL).
+
+## Why
+- Create a minimal from scratch React + WebGL app.
+- No Three.js
+- use React's hook
+
+It will be enhanced with more examples and an article.
+
+## How it works ?
+
+### 1 - WebGL needs a canvas
+
+`GLVIew` component  renders a `<canvas />` element. GLView iis using the [React Effect Hook](https://reactjs.org/docs/hooks-effect.html) to make the animation works. The code is very simple:
+
+```javascript
+const GLView = ({ width, height, scene }) => {
+  const ref = useRef();
+
+  useEffect(() => {
+    const canvas = ref.current;
+    const webGL = new WebGL(canvas, width, height);
+    webGL.init(scene);
+    return () => {
+      webGL.close();
+    };
+  });
+
+  return <canvas ref={ref} width={width} height={height} />;
+};
+```
+
+### 2 - All the GL stuff 
+`WebGL` is the engine where WebGL, shaders, model are intialized. 
+
+The rendering animation is done using:
+
+```javascript
+    this.render = this.render.bind(this);
+    this.requestId = requestAnimationFrame(this.render);
+```
+
+### 3 - Where the magic plays
+`scene.js`
+
+All the model, shaders, are here and also the scene rendering.
+
+## Community
+
+Don't hesitate to test, use, contribute, ...
+
+Made by [Mik BRY](http://twitter.com/mikbry) 

modules/demo/particles/commitlint.config.js

@@ -0,0 +1 @@
+module.exports = { extends: ['@commitlint/config-conventional'] };