0.0.1-beta.2
This commit is contained in:
parent
db37b9b06c
commit
3c3311f80f
59
README.md
59
README.md
@ -1,5 +1,3 @@
|
||||
Here’s a suggestion for your npm package description in English:
|
||||
|
||||
```markdown
|
||||
# ddmt-tool
|
||||
|
||||
@ -12,12 +10,63 @@ npm install ddmt-tool
|
||||
```
|
||||
|
||||
## Usage Example
|
||||
|
||||
General usage.
|
||||
```javascript
|
||||
import { Name } from 'ddmt-tool';
|
||||
|
||||
Name();
|
||||
```
|
||||
Refers specifically to the usage of animateStart.
|
||||
|
||||
```javascript
|
||||
import { animateStart } from 'ddmt-tool';
|
||||
|
||||
/**
|
||||
* animateStart
|
||||
* @param {HTMLElement} HTMLElement Animation needs to be played in HTMLElement
|
||||
* @param {string} classname The corresponding CSS for the animation
|
||||
* @param {boolean} forceExecute Whether to force execute the animation or not
|
||||
* @returns {void}
|
||||
*/
|
||||
animateStart(event, className, forceExecute=false);
|
||||
```
|
||||
Here's an example of how to use CSS
|
||||
```css
|
||||
.box-item {
|
||||
position: absolute;
|
||||
background-color: rgb(255, 223, 181);
|
||||
border-radius: 10px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
margin: 2px;
|
||||
text-align: center;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.box-item.animate {
|
||||
animation-name: boxbing;
|
||||
animation-duration: 0.7s;
|
||||
animation-iteration-count: 1;
|
||||
/* 设置动画只播放一次 */
|
||||
animation-fill-mode: forwards;
|
||||
/* 保持动画结束时的状态 */
|
||||
}
|
||||
|
||||
@keyframes boxbing {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Features
|
||||
|
||||
@ -26,6 +75,4 @@ Name();
|
||||
- Custom utilities
|
||||
|
||||
For more features and usage instructions, please refer to the documentation.
|
||||
```
|
||||
|
||||
This should give users a clear understanding of your package's purpose and how to use it.
|
||||
```
|
@ -1,7 +1,7 @@
|
||||
/*
|
||||
* @Author: ddmt
|
||||
* @Date: 2024-9-29 20:50:12
|
||||
* @LastEditTime: 2024-9-29 20:50:12
|
||||
* @LastEditTime: 2024-9-30 0:12:12
|
||||
* @LastEditors: ddmt
|
||||
* @Description: ddmt-index file
|
||||
* @FilePath: /Tool/animate.js
|
||||
@ -9,13 +9,15 @@
|
||||
|
||||
/**
|
||||
* 动画函数
|
||||
* @param {HTMLElement} event
|
||||
* @param {HTMLElement} HTMLElement
|
||||
* @param {string} classname
|
||||
* @param {boolean} forceExecute
|
||||
* @returns {void}
|
||||
*/
|
||||
export function animateStart(event, className, forceExecute) {
|
||||
if (forceExecute) event.target.classList.remove(className); // 清洗动画
|
||||
event.classList.add(className);
|
||||
event.addEventListener('animationend', (event) => {
|
||||
export function animateStart(HTMLElement, className, forceExecute=false) {
|
||||
if (forceExecute) HTMLElement.target.classList.remove(className); // 清洗动画
|
||||
HTMLElement.classList.add(className);
|
||||
HTMLElement.addEventListener('animationend', (event) => {
|
||||
event.target.classList.remove(className); // 清洗动画
|
||||
});
|
||||
}
|
||||
|
@ -1,7 +1,7 @@
|
||||
/*
|
||||
* @Author: ddmt
|
||||
* @Date: 2024-9-29 20:50:12
|
||||
* @LastEditTime: 2024-9-29 20:50:12
|
||||
* @LastEditTime: 2024-9-30 0:13:12
|
||||
* @LastEditors: ddmt
|
||||
* @Description: ddmt-index file
|
||||
* @FilePath: /Tool/number.js
|
||||
@ -29,3 +29,43 @@ export function nextArray(arr, index) {
|
||||
index--;
|
||||
return arr.slice(index + 1, arr.length).concat(arr.slice(0, index + 1));
|
||||
}
|
||||
|
||||
/*
|
||||
* 获取相对时间(中文)
|
||||
* @param {Date} date
|
||||
*/
|
||||
export function getRelativeTime(date) {
|
||||
const now = new Date();
|
||||
const diffInSeconds = Math.floor((now.getTime() - date.getTime()) / 1000);
|
||||
|
||||
if (diffInSeconds < 60) {
|
||||
return '刚刚';
|
||||
}
|
||||
|
||||
const diffInMinutes = Math.floor(diffInSeconds / 60);
|
||||
if (diffInMinutes < 60) {
|
||||
return `${diffInMinutes}分钟前`;
|
||||
}
|
||||
|
||||
const diffInHours = Math.floor(diffInMinutes / 60);
|
||||
if (diffInHours < 24) {
|
||||
return `${diffInHours}小时前`;
|
||||
}
|
||||
|
||||
const diffInDays = Math.floor(diffInHours / 24);
|
||||
if (diffInDays < 30) {
|
||||
return `${diffInDays}天前`;
|
||||
}
|
||||
|
||||
const diffInMonths = Math.floor(diffInDays / 30);
|
||||
if (diffInMonths < 12) {
|
||||
return `${diffInMonths}个月前`;
|
||||
}
|
||||
|
||||
const diffInYears = Math.floor(diffInMonths / 12);
|
||||
if (diffInYears < 5) {
|
||||
return `${diffInYears}年前`;
|
||||
}
|
||||
|
||||
return '很久以前';
|
||||
}
|
@ -1,12 +1,16 @@
|
||||
{
|
||||
"name": "ddmt-tool",
|
||||
"version": "0.0.1-beta.1",
|
||||
"version": "0.0.1-beta.2",
|
||||
"description": "A utility library that provides commonly used functions to simplify everyday development tasks. Whether it's string manipulation, array operations, or other frequent functionalities, `ddmt-tool` helps you work more efficiently.",
|
||||
"main": "index.js",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "node index.js"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git@git.ddmt.top:ddmt/ddmt-tool.git"
|
||||
},
|
||||
"keywords": [
|
||||
"ddmt",
|
||||
"tool",
|
||||
|
Loading…
x
Reference in New Issue
Block a user