Greensock GSAP: Translating CSS cubic-bezier to GSAP - gsap

Looking at the bezier plugin, http://greensock.com/docs/#/HTML5/GSAP/Plugins/BezierPlugin/
It doesn't make a lot of sense to me.
I couldn't translate my CSS cubic-bezier of cubic-bezier(0.7,0,0.3,1) to GSAP using that plugin.
How would you do that?
Cheers,
V.

The administrator from GSAP has replied me.
They told me bezier plugin is for animating values along a bezier path.
I will have to resort to the predefined, power1, power2, power3, power4 etc built in easing.
Or pay to be a Greensock member and use the customease plugin
https://greensock.com/customease
Solution:
Some kind folks out there has made a plugin for the translation.
https://github.com/gre/bezier-easing
TweenLite.to("#yourElement", 1, {x:100, ease:new Ease(BezierEasing(0.7,0,0.3,1))});

Related

Difference in HTML generated between Vue files between dev and prod

I'm new to Vue and I hope someone can help. I have an app that uses Vuetify (2.2.23), and when I render it locally for development, the HTML contains:
So, v-main is a class, and it's being located in my CSS for styling. However, in another installation from the same files (I've checked the versions of everything too), I get:
So, v-main is now an element, so the CSS is not being applied.
I realise that I can duplicate my styling so that they look the same to the user, but I'd like to understand what to look for in the setup of the projects that would make this happen in the first place?
The versions I'm using are:
Vue 2.6.11
Vuetify 2.2.23
Thanks in advance!
Why is it the thing you've checked the most is the thing that's the problem? This was a version problem after all. I used the ^ minimum requirement, and the two servers ended up using different versions. Bumping both to a minimum of Vuetify 2.3.9 solved it.
Posting this answer in case it helps someone else.

intelliJ shows Bootstrap classes as typos

I just created a new static web project using the Bootstrap template. In my html files it is marking the names of Bootstrap css classes as typos. Surely the worlds smartest IDE is better than that? How do I make it aware of Bootstrap classes? I know I can disable spell checking but that seems like an awful solution.
Please follow WI-4762 for updates to be notified on any progress with it. For now, I can only suggest to either disable the spell checker or add the words shown as typos to dictionary

#ng-bootstrap/ng-bootstrap multi item slider

I have installed a package #ng-bootstrap/ng-bootstrap for my angular project, I already implemented the carousel by it, but I need a multi-item carousel, can anybody suggest whether I can achieve it by this package or not, please suggest some tutorials.
In some research, I have not found that ng-bootstrap has a function for this at this time--Please correct me if I'm wrong.
https://github.com/ng-bootstrap/ng-bootstrap/issues/2083
If I ammm correct, since you already have the bootstrap dependency, I would import the 3 required js dependencies (popper, jquery, bootstrap.min.js)
and attempt to use something like this? (Is this what you are talking about?)
https://www.codeply.com/go/HDu8lT7NxJ

Quill Editor and Vue.js

I'm a vue.js beginner and I've been trying to integrate the Quill editor into Vue modules. At first, I tried with the vue-quill plugin but documentation is very poor and I couldn't understand how to use it. Very frustrating.
Now I don't know if I'm better off trying to create my own plugin or if I give the existing plugin a second try and maybe try to enhance it.
What I want is someone to please provide some sample working code to get this going.
Upon inspecting the vue-quill package.json file I noticed it depended on an old version of quill :
"dependencies": {
"quill": "^0.20.1",
...
}
Since I was getting fragment errors from that build I decided to take the original code to suit my needs. At this point, you can copy this modified component and use something like vue-cli to use it.
I can't give you precise steps on vue-cli because my project is based on Laravel, but the idea of storing different .vue files into a components folder should be similar.
Finally, I simply use the component in one of my views :
<quill :content.sync="content"></quill>
Note : I am still fiddling around the component that I uploaded on gist, so take it as a starting point. The code is fairly simple.

dijit tree example

I've been trying to copy and paste dijit tree examples from the web that use the ajax.google.com version of dojo 1.7.2 and I cannot get anything to work. Does anyone know of a single page whose source I can view, copy, and paste, and have a functional tree right away? There are lots of examples of bits and pieces of trees (just the javascript, trees with dijit installed on a server, etc.) but nothing that anyone could copy and paste to get a fully functional tree.
Thanks for your help!
Although uses <1.7 syntax... its good for headstart as minor modifications need to be done for 1.7.2 version
http://dojocampus.com/explorer/#Dijit_Tree_Basic