Light

sketchpunk / neditorjs Goto Github PK

View Code? Open in Web Editor NEW

184.0 184.0 36.0 10 KB

CSS 9.16% JavaScript 79.92% HTML 10.92%

neditorjs's Introduction

Sketchpunk Labs

Bio :

A solo player born with the name Pedro but known to most of the world as VoR. You can describe me as :

✨ IK Necromancer
🎨 Wannabe 3D Modeler
🔥 Javascript Developer
🥒 Open Source Enthusiast
🤪 Wakadoodle Extraordinar

Writing EBooks :

Learn WebGPU : Writing tutorials about learning WebGPU's API to create a basic renderer
IK Wonderland : Book about how to build a character animation system from scratch, skinning all the way to animating with inverse kinematics

Active Projects :

Ossos : Character animation library to create IK Rigs for use on the web
GLTF2 Parser : Library that focuses on piecemeal loading of GLTF content
Gizmos : Library to create gizmos/widgets/manipulators for use in Threejs prototyping
Threejs Starter : Starting project for prototyping things using threejs
Mapping & Terrains : Repo containing various prototypes on 3d mapping tiles & procedurally generated terrains
Irregular Grids : Repto containing prototypes related to irregular grids & procedurally generating content with them.
Game Physics : Prototyping basic ridgid body & collision detections
Baller XR : Creating an experience of driving fortnite's baller vehicle on a 3D map rendering of hyrule from zelda's breath of the wild game. All this to run in web VR on the Oculus Quest 2.

Projects in Hiatus :

Fungi RS : A version of Fungi built with Rust, WebGL and WebAssembly.
FunWithWebGL2 : Source for all my Youtube Tutorials related to building a game engine using WebGL.
Fungi : 3D Game engine built with WebGL & JavaScript, also includes IK Rigs Animation System
Ecs : Entity-Component-System framework being created to run the next version of Fungi.
Prop Panel : Collection of UI Web Components I created for use in my 3D Prototyping
Webbased Software Renderer : Learning to create a software renderer for 3d content using javascript
Oito : TypeScript Math Library geared toward 3D Prototyping.
- Oito Curves : Extension that handles curves & splines
- Oito Geometry : Extension that handles procedurally generated geometries
- Oito Ray : Extension that handles various intersections & collisions.

Inactive Projects :

Open Keyboard : Virtual keyboard / Macroboard with dynamic user defined layouts
Shader Blocks : Prototype for a web based Shader Graph Tool.
Open Comic Reader : Android app for reading comics in CBZ and CBR Formats
Speech CMD : Tool to run macros from Voice Commands.
Texture Painter : Prototype of a webbased texture painter/

neditorjs's People

Contributors

Stargazers

Watchers

neditorjs's Issues

Connector not connected

Hi,
After playing with your demo I found a little bug maybe you can fix it.

Click on the output of the starting node and connect to the input of Sketchup Lab.

After that move the starting node the connector is not much longer connected

If you move the sketchup labs the connector will be reconnected to the starting node

PS: nice work :)

Possible Zoom in/Zoom out and Minimap?

Hey man, I really loved this repository of yours. I have been trying to replicate this in Svelte, and it has been pretty successful. I would like to add some extra functionality like zooming in and out of the Editor div and possibly adding a minimap.

Do you have any suggestions for how to achieve that? I have tried encapsulating all the nodes in a div and scaling them, but that causes issues with dragging the nodes (It's too fast when zoomed in, and too slow when zoomed out), and most of all, the svg paths go really haywire and all over the place.

Any help here would be really appreciated :))

stroke-dashoffset Infinite Linear Animation Lag

Hey @sketchpunk and everyone else,

I tried ShaderBlocks the other day, and loved that animations, and so I'm now trying to enable these animations on NEditorJS since it's less complex to work with, but I found a weird bug I would like help solving please:

Every 30 seconds the animation lags (tried other intervals, same same new name, also it should only affect speed since it's set to infinite linear)

I attached a full test that I've made (: https://vimeo.com/675896726/fe03a1e87a

@keyframes moveDashOffset{
  from{ stroke-dashoffset: 500; }
  to{ stroke-dashoffset: 0; }
}
path{
  animation: moveDashOffset 30s linear infinite;
}
----------------------------------------------------------
@keyframes path-move {
  from {
    stroke-dashoffset: 0%;
  }
  to {
    stroke-dashoffset: 100%;
  }
}

path{
  animation: path-move 30s infinite linear;
}
----------------------------------------------------------
@keyframes path-move-reverse {
  to {
    stroke-dashoffset: 0%;
  }
  from {
    stroke-dashoffset: 100%;
  }
}

path{
  animation: path-move-reverse 30s infinite linear;
}

None of the solutions above work properly :/

Any other solution will be highly appreciated!

Thanks for the helpers!

Also can you please add a license file for us to work with please? ✋

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.