curtainsjs | lightweight vanilla WebGL javascript library | Canvas library

by martinlaxenaire JavaScript Version: 8.1.5 License: MIT

X-Ray Key Features Code Snippets Community Discussions(2)Vulnerabilities Install Support

kandi X-RAY | curtainsjs Summary

curtainsjs is a JavaScript library typically used in User Interface, Canvas, WebGL applications. curtainsjs has no bugs, it has no vulnerabilities, it has a Permissive License and it has medium support. You can install using 'npm i curtainsjs' or download it from GitHub, npm.

Shaders are the new front-end web developpment big thing, with the ability to create very powerful 3D interactions and animations. A lot of very good javascript libraries already handle WebGL but with most of them it's kind of a headache to position your meshes relative to the DOM elements of your web page. curtains.js was created with just that issue in mind. It is a small vanilla WebGL javascript library that converts HTML elements containing images and videos into 3D WebGL textured planes, allowing you to animate them via shaders. You can define each plane size and position via CSS, which makes it super easy to add WebGL responsive planes all over your pages.

Support

Quality

Security

License

Reuse

Support

curtainsjs has a medium active ecosystem.

It has 1410 star(s) with 94 fork(s). There are 19 watchers for this library.

There were 1 major release(s) in the last 12 months.

There are 4 open issues and 90 have been closed. On average issues are closed in 43 days. There are 2 open pull requests and 0 closed requests.

It has a neutral sentiment in the developer community.

The latest version of curtainsjs is 8.1.5

Quality

curtainsjs has 0 bugs and 0 code smells.

Security

curtainsjs has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.

curtainsjs code analysis shows 0 unresolved vulnerabilities.

There are 0 security hotspots that need review.

License

curtainsjs is licensed under the MIT License. This license is Permissive.

Permissive licenses have the least restrictions, and you can use them in most projects.

Reuse

curtainsjs releases are not available. You will need to build from source code and install.

Deployable package is available in npm.

Installation instructions are not available. Examples and code snippets are available.

curtainsjs saves you 10305 person hours of effort in developing the same functionality from scratch.

It has 20954 lines of code, 0 functions and 129 files.

It has low code complexity. Code complexity directly impacts maintainability of the code.

Top functions reviewed by kandi - BETA

kandi's functional review helps you automatically verify the functionalities of the libraries and avoid rework.
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of curtainsjs

Get all kandi verified functions for this library.

curtainsjs Key Features

No Key Features are available at this moment for curtainsjs.

curtainsjs Examples and Code Snippets

No Code Snippets are available at this moment for curtainsjs.

Community Discussions

Trending Discussions on curtainsjs

CurtainsJS GSAP WebGL list items mouseover issue

curtains.js — Unable to initialize the shader program

QUESTION

CurtainsJS GSAP WebGL list items mouseover issue

Asked 2021-Feb-01 at 09:28

I'm trying to integrate a WebGL animation on list items: images who give place to a video on mouseover.

The transitions are same as http://taotajima.jp/ and I'm inspired of the frag and vertex from https://github.com/watab0shi/taotajimajp-transition

For this, I work with Angular and CurtainsJS with GSAP.

My problem is the first textures hides the video at the end of animation (more details at end of this post)

I created a TS class after my component (home.page.ts):

...

ANSWER

Answered 2021-Feb-01 at 09:28

There are a couple errors in your fragment shader.

You're using the fractional value of your uProgress uniform, but when uProgress equals to 1, its fractional value equals to 0 and your mix operation then falls back to color0 again.
Your translate1 value needs to be multiplied by progress1 so when uProgress equals 1, the second texture is not translated anymore.

This fragment shader should fix your issue:

Source https://stackoverflow.com/questions/65851718

QUESTION

curtains.js — Unable to initialize the shader program

Asked 2020-Oct-15 at 04:42

I'm attempting to add a fragment shader to plane created via curtains. I've used this fragment shader with other libraries before — namely, canvas-sketch — however I can't seem to get the shader to run as the console prompts me with the error: Program: Unable to initialize the shader program.

...

ANSWER

Answered 2020-Oct-10 at 10:11

curtains doesn't have a varying called vUv. It has one called vTextureCoord

Source https://stackoverflow.com/questions/64290336

Community Discussions, Code Snippets contain sources that include Stack Exchange Network

Vulnerabilities

No vulnerabilities reported

Install curtainsjs

You can install using 'npm i curtainsjs' or download it from GitHub, npm.

Support

The library is split into classes modules. Most of them are used internally by the library but there are however a few classes meant to be used directly, exported in the src/index.mjs file.

Find more information at: