Support
Quality
Security
License
Reuse
kandi has reviewed elara and discovered the below as its top functions. This is intended to give you an instant insight into elara implemented functionality, and help decide if they suit your requirements.
Offers three modes of execution - normal, cache and secure - secure mode generates a key file and encrypts the database for additional security.
Manipulate data structures in-memory.
Fast and flexible in-memory caching mechanism.
Choose between manual commits after performing operations in-memory or automatically commit every change into the storage.
Includes methods to export certain keys from the database or the entire storage.
Incorporates checksums to verify database file integrity.
default
$ pip install elara
Installation
$ pip install elara
License
Copyright (c) 2021, Saurabh Pujari
All rights reserved.
This source code is licensed under the BSD-style license found in the LICENSE file in the root directory of this source tree.
Basic usage :
import elara
# exe_secure() encrypts the db file
db = elara.exe_secure("new.db", True, "newdb.key")
db.set("name", "Elara")
print(db.get("name"))
# Elara
Cache:
import elara
import time
cache_param = {
"max_age": 900,
"max_size": 4,
"cull_freq": 25
}
cache = elara.exe_cache("new.db", cache_param)
cache.set("key1", "This one will be evicted in 900 seconds")
cache.set("key2", "This one will not be evicted", "i") # 'i' signifies it will never be evicted
cache.set("key3", "This one will be evicted in 50 seconds", 50)
print(cache.getkeys())
# ["key3", "key2", "key1"]
time.sleep(50)
print(cache.getkeys())
# ["key2", "key1"]
cache.set("key3", 5)
cache.set("key4", 10)
print(cache.getkeys())
# ["key4", "key3", "key2", "key1"]
cache.set("key1", 7, "i") # overwrite "key1" to never expire
print(cache.getkeys())
# ["key1", "key4", "key3", "key2"]
print(cache.get("key1"))
# 7
cache.set("key5", 20) # Automatic culling when max_size is reached
print(cache.getkeys())
# ["key5", "key1", "key4", "key3"]
Serialization and Storage:
import elara
cache = elara.exe("new.db") # commit = False by default
class MyObj():
def __init__(self, num):
self.num = num
obj = MyObj(19)
cache.set("obj", obj)
print(cache.get("obj").num)
# 19
Lists :
import elara
db = elara.exe('new.db', True)
db.lnew('newlist')
db.lpush('newlist', 3)
db.lpush('newlist', 4)
db.lpush('newlist', 5)
print(db.lpop('newlist'))
# 5
print(db.lindex('newlist', 0))
# 3
new_list = [6, 7, 8, 9]
db.lextend('newlist', new_list)
print(db.get('newlist'))
# [3, 4, 6, 7, 8, 9]
Update key and Secure DB :
import elara
# exe_secure() encrypts the db file
db = elara.exe_secure("new.db", True, "newdb.key")
db.set("name", "Elara")
print(db.get("name"))
# Elara
db.updatekey('newkeypath.key')
# Regular program flow doesn't get affected by key update
print(db.get("name"))
# Elara
Export data :
import elara
db = elara.exe('new.db', False)
db.set("one", 100)
db.set("two", 200)
db.commit()
db.set("three", 300)
db.exportdb('exportdb.txt')
db.exportmem('exportmem.txt')
db.exportkeys('exportkeys.txt', keys = ['one', 'three'])
"""
# exportdb.txt
{
"one": 100,
"two": 200
}
# exportmem.txt
{
"one": 100,
"three": 300,
"two": 200
}
# exportkeys.txt
{
"one": 100,
"three": 300
}
"""
Tests
$ python -m unittest -v
Save completed css animation in class
$(document).ready(function(){
$(".link--elara").click(function(e){
$(".link--elara").addClass("clicked");
});
});
.link {
cursor: pointer;
position: relative;
white-space: nowrap;
}
.link::before,
.link::after {
position: absolute;
width: 100%;
height: 1px;
background: currentColor;
top: 100%;
left: 0;
pointer-events: none;
}
.link::before {
content: '';
}
.link--elara {
font-family: aktiv-grotesk-extended, sans-serif;
font-size: 1.375rem;
}
.link--elara::before {
transform-origin: 50% 100%;
transition: clip-path 0.3s, transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
clip-path: polygon(0% 0%, 0% 100%, 0 100%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara:hover::before,
.clicked::before {
transform: translate3d(0, 2px, 0) scale3d(1.08, 3, 1);
clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 50% 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara span {
display: inline-block;
transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
}
.link--elara:hover span,
.clicked span {
transform: translate3d(0, -2px, 0);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="link">
<div class="link--elara">
<span>Click me!</span>
</div>
</div>
-----------------------
$(document).ready(function(){
$(".link--elara").click(function(e){
$(".link--elara").addClass("clicked");
});
});
.link {
cursor: pointer;
position: relative;
white-space: nowrap;
}
.link::before,
.link::after {
position: absolute;
width: 100%;
height: 1px;
background: currentColor;
top: 100%;
left: 0;
pointer-events: none;
}
.link::before {
content: '';
}
.link--elara {
font-family: aktiv-grotesk-extended, sans-serif;
font-size: 1.375rem;
}
.link--elara::before {
transform-origin: 50% 100%;
transition: clip-path 0.3s, transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
clip-path: polygon(0% 0%, 0% 100%, 0 100%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara:hover::before,
.clicked::before {
transform: translate3d(0, 2px, 0) scale3d(1.08, 3, 1);
clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 50% 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara span {
display: inline-block;
transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
}
.link--elara:hover span,
.clicked span {
transform: translate3d(0, -2px, 0);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="link">
<div class="link--elara">
<span>Click me!</span>
</div>
</div>
-----------------------
$(document).ready(function(){
$(".link--elara").click(function(e){
$(".link--elara").addClass("clicked");
});
});
.link {
cursor: pointer;
position: relative;
white-space: nowrap;
}
.link::before,
.link::after {
position: absolute;
width: 100%;
height: 1px;
background: currentColor;
top: 100%;
left: 0;
pointer-events: none;
}
.link::before {
content: '';
}
.link--elara {
font-family: aktiv-grotesk-extended, sans-serif;
font-size: 1.375rem;
}
.link--elara::before {
transform-origin: 50% 100%;
transition: clip-path 0.3s, transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
clip-path: polygon(0% 0%, 0% 100%, 0 100%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara:hover::before,
.clicked::before {
transform: translate3d(0, 2px, 0) scale3d(1.08, 3, 1);
clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 50% 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara span {
display: inline-block;
transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
}
.link--elara:hover span,
.clicked span {
transform: translate3d(0, -2px, 0);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="link">
<div class="link--elara">
<span>Click me!</span>
</div>
</div>
QUESTION
Save completed css animation in class
Asked 2021-May-19 at 22:36Hi I have a css animation for a link hover, and I'd like to be able to save the completed state of the animation in a css class and add it to the link on click
.link {
cursor: pointer;
position: relative;
white-space: nowrap;
}
.link::before,
.link::after {
position: absolute;
width: 100%;
height: 1px;
background: currentColor;
top: 100%;
left: 0;
pointer-events: none;
}
.link::before {
content: '';
}
.link--elara {
font-family: aktiv-grotesk-extended, sans-serif;
font-size: 1.375rem;
}
.link--elara::before {
transform-origin: 50% 100%;
transition: clip-path 0.3s, transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
clip-path: polygon(0% 0%, 0% 100%, 0 100%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara:hover::before {
transform: translate3d(0, 2px, 0) scale3d(1.08, 3, 1);
clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 50% 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara span {
display: inline-block;
transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
}
.link--elara:hover span {
transform: translate3d(0, -2px, 0);
}
I've tried other solutions such as animation-fill-mode: forwards;
and other solutions here but I haven't had any luck..
I'd really appreciate any help. Thanks!
ANSWER
Answered 2021-May-19 at 22:36The code below works probably the way you want, but it is not "saving the completed animation in a class".
Rather, it adds a class clicked
to the button upon clicking. This class has the finished tranlation that also happens on hover and takes over when the cursor exits the element.
$(document).ready(function(){
$(".link--elara").click(function(e){
$(".link--elara").addClass("clicked");
});
});
.link {
cursor: pointer;
position: relative;
white-space: nowrap;
}
.link::before,
.link::after {
position: absolute;
width: 100%;
height: 1px;
background: currentColor;
top: 100%;
left: 0;
pointer-events: none;
}
.link::before {
content: '';
}
.link--elara {
font-family: aktiv-grotesk-extended, sans-serif;
font-size: 1.375rem;
}
.link--elara::before {
transform-origin: 50% 100%;
transition: clip-path 0.3s, transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
clip-path: polygon(0% 0%, 0% 100%, 0 100%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara:hover::before,
.clicked::before {
transform: translate3d(0, 2px, 0) scale3d(1.08, 3, 1);
clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 50% 100%, 0 100%, 100% 100%, 100% 0%);
}
.link--elara span {
display: inline-block;
transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
}
.link--elara:hover span,
.clicked span {
transform: translate3d(0, -2px, 0);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="link">
<div class="link--elara">
<span>Click me!</span>
</div>
</div>
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
No vulnerabilities reported
Save this library and start creating your kit
Explore Related Topics
Save this library and start creating your kit