stuzer05/random-web-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Activity

Update README.md

Browse Source
This commit is contained in:
Illya Marchenko
2024-10-12 16:08:42 +03:00
parent 1c5b0ba2ec
commit 7290787aa4
7 changed files with 52 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/views/general/ExplainCrontab.vue
View File

@ -1,57 +0,0 @@
<template>
<h2 class="tool-title">Explain crontab</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="data">Data</label>
<input id="data" class="input" v-model="toolData.data" v-on:keyup="result" placeholder="* * * * *" type="text">
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<MonacoEditor name="result" language="json" :value="toolResult"></MonacoEditor>
</div>
</template>
<script>
import cronstrue from "cronstrue";
import MonacoEditor from "@/components/MonacoEditor.vue";
export default {
components: {
MonacoEditor
},
data() {
return {
toolData: {
data: "* * * * *"
},
toolResult: ""
};
},
mounted() {
this.toolResult = cronstrue.toString(this.toolData.data, {
use24HourTimeFormat: true,
verbose: true
});
},
methods: {
result() {
try {
this.toolResult = cronstrue.toString(this.toolData.data, {
use24HourTimeFormat: true,
verbose: true
});
} catch (e) {
this.toolResult = "invalid syntax";
}
}
}
};
</script>
<style lang="scss">
</style>

104
src/views/general/FileBase64EncodeDecode.vue
View File

@ -1,104 +0,0 @@
<template>
<h2 class="tool-title">File base64 encode/decode</h2>
<hr class="mt-5 mb-5">
<div class="input-group" v-if="toolData.base64Mode === 'encode'">
<label for="data">Data</label>
<input type="file" ref="fileEncodeUpload" @change="encode" />
</div>
<div class="input-group" v-if="toolData.base64Mode === 'decode'">
<label for="data">Data</label>
<textarea id="data" v-model="toolData.data"></textarea>
</div>
<div class="input-group" v-if="toolData.base64Mode === 'encode'">
<label>Strip mime/type</label>
<div>
<input id="strip_mime" name="strip_mime" v-model="toolData.stripMime" v-on:change="encode" type="checkbox"> <label
for="strip_mime">strip mime</label>
</div>
</div>
<div class="input-group">
<label>Mode</label>
<div>
<input id="base64_mode_encode" value="encode" name="base64_mode" v-model="toolData.base64Mode" type="radio">
<label for="base64_mode_encode">file -> base64</label><br>
<input id="base64_mode_decode" value="decode" name="base64_mode" v-model="toolData.base64Mode" type="radio">
<label for="base64_mode_decode">base64 -> file</label>
</div>
</div>
<hr class="mt-5 mb-5">
<div class="input-group" v-if="toolData.base64Mode === 'encode'">
<label for="result">Result</label>
<MonacoEditor name="result" language="text" :value="toolResult"></MonacoEditor>
</div>
<div class="input-group" v-if="toolData.base64Mode === 'decode'">
<label for="result">Result</label>
<button v-on:click="decode">Decode & download</button>
</div>
</template>
<script>
import MonacoEditor from "@/components/MonacoEditor.vue";
export default {
components: {
MonacoEditor
},
data() {
return {
toolData: {
data: "",
base64Mode: "encode",
stripMime: true
},
toolResult: ""
};
},
methods: {
encode() {
const file = this.$refs.fileEncodeUpload.files[0];
const reader = new FileReader();
reader.onload = () => {
if (this.toolData.stripMime) {
this.toolResult = reader.result.split(",")[1];
} else {
this.toolResult = reader.result;
}
};
if (file) {
reader.readAsDataURL(file);
}
},
decode() {
const byteCharacters = atob(this.toolData.data.split(",")[1] ?? this.toolData.data);
const byteNumbers = new Array(byteCharacters.length);
// create file
for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: "application/octet-stream" });
// download
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.download = "file";
link.click();
}
}
};
</script>
<style lang="scss">
</style>

87
src/views/general/HtaccessGenerator.vue
View File

@ -1,87 +0,0 @@
<template>
<h2 class="tool-title">.htaccess User Entry Generator</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="username">Username</label>
<input id="username" class="input" v-model="toolData.username" v-on:keyup="result" type="text">
</div>
<div class="input-group">
<label for="password">Password</label>
<input id="password" class="input" v-model="toolData.password" v-on:keyup="result" type="text">
</div>
<div class="input-group">
<label for="algorithm">Algorithm</label>
<div>
<select id="algorithm" v-model="toolData.algorithm" v-on:change="result">
<option value="MD5">MD5</option>
<option value="SHA1">SHA1</option>
<option value="BCRYPT">BCRYPT</option>
</select>
</div>
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<MonacoEditor name="result" language="text" :value="toolResult"></MonacoEditor>
</div>
</template>
<script>
import MonacoEditor from "@/components/MonacoEditor.vue";
import bcrypt from 'bcryptjs';
import md5 from 'md5';
import sha1 from 'sha1';
export default {
components: {
MonacoEditor
},
data() {
return {
toolData: {
username: "",
password: "",
algorithm: "BCRYPT",
},
toolResult: "",
};
},
mounted() {
this.result();
},
methods: {
result() {
if (!(this.toolData.username && this.toolData.password)) {
this.toolResult = '';
return;
}
let encryptedPassword = '';
switch (this.toolData.algorithm) {
case 'MD5':
encryptedPassword = md5(this.toolData.password);
break;
case 'SHA1':
encryptedPassword = sha1(this.toolData.password);
break;
case 'BCRYPT':
encryptedPassword = bcrypt.hashSync(this.toolData.password, 10); // 10 salt rounds
break;
}
this.toolResult = `${this.toolData.username}:${encryptedPassword}`;
}
}
};
</script>
<style lang="scss">
</style>

87
src/views/general/SedGenerator.vue
View File

@ -1,87 +0,0 @@
<template>
<h2 class="tool-title">Sed Generator</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="search">Search</label>
<input id="search" class="input" v-model="toolData.search" v-on:keyup="result" type="text">
</div>
<div class="input-group">
<label for="replace">Replace</label>
<input id="replace" class="input" v-model="toolData.replace" v-on:keyup="result" type="text">
</div>
<div class="input-group">
<label for="delimiter">Delimiter</label>
<input id="delimiter" class="input" maxlength="1" v-model="toolData.delimiter" v-on:keyup="result" type="text">
</div>
<div class="input-group">
<label for="filename">Filename</label>
<input id="filename" class="input" v-model="toolData.filename" v-on:keyup="result" type="text">
</div>
<div class="input-group">
<div>
<input id="do_replace" type="checkbox" v-model="toolData.doReplace" v-on:change="result">
<label for="do_replace"> replace in file</label>
</div>
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<MonacoEditor name="result" language="bash" :value="toolResult"></MonacoEditor>
</div>
</template>
<script>
import MonacoEditor from "@/components/MonacoEditor.vue";
export default {
components: {
MonacoEditor
},
data() {
return {
toolData: {
search: "",
replace: "",
delimiter: "/",
filename: "/path/to/file",
doReplace: true,
},
toolResult: "",
};
},
mounted() {
this.result();
},
methods: {
result() {
if (!(this.toolData.search && this.toolData.replace && this.toolData.delimiter)) {
this.toolResult = '';
return
}
let command = `sed`;
if (this.toolData.doReplace) {
command += ` -i`;
}
// Escape delimiter
const search = this.toolData.search.replace(new RegExp(`\\${this.toolData.delimiter}`, 'g'), `\\${this.toolData.delimiter}`);
const replace = this.toolData.replace.replace(new RegExp(`\\${this.toolData.delimiter}`, 'g'), `\\${this.toolData.delimiter}`);
command += ` 's${this.toolData.delimiter}${search}${this.toolData.delimiter}${replace}${this.toolData.delimiter}g' ${this.toolData.filename}`;
this.toolResult = command;
},
},
};
</script>
<style lang="scss">
</style>

162
src/views/general/UnixTimestamp.vue
View File

@ -1,162 +0,0 @@
<template>
<h2 class="tool-title">Unix timestamp</h2>
<hr class="mt-5 mb-5">
<table>
<thead>
<tr>
<th>Format</th>
<th>Date & Time</th>
<th></th>
</tr>
</thead>
<tbody>
<tr v-for="(value, format) in currentTimestampFormatted" :key="format">
<td>{{ format }}</td>
<td>{{ value }}</td>
<td>
<button @click="copyTimestamp(value)">📋</button>
</td>
</tr>
</tbody>
</table>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="inputTimestamp">Enter timestamp</label>
<div>
<input id="inputTimestamp" type="number" v-model="toolData.inputTimestamp" :placeholder="currentTimestamp">
<button @click="convertFromUnix">Convert ↓</button>
</div>
</div>
<div class="input-group">
<label>Enter Date & Time</label>
<div>
<table class="table-date-and-time">
<thead>
<tr>
<th>Year</th>
<th>Month</th>
<th>Day</th>
<th>Hour (24)</th>
<th>Minute</th>
<th>Second</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="number" v-model="toolData.inputYear"></td>
<td><input type="number" v-model="toolData.inputMonth"></td>
<td><input type="number" v-model="toolData.inputDay"></td>
<td><input type="number" v-model="toolData.inputHour"></td>
<td><input type="number" v-model="toolData.inputMinute"></td>
<td><input type="number" v-model="toolData.inputSecond"></td>
<td>
<button @click="convertToUnix">Convert ↑</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</template>
<script>
import moment from "moment";
export default {
data() {
return {
toolData: {
inputTimestamp: "",
inputYear: moment().year(),
inputMonth: moment().month() + 1,
inputDay: moment().day(),
inputHour: moment().hour(),
inputMinute: moment().minute(),
inputSecond: moment().second()
},
currentTimestamp: 0,
currentTimestampFormatted: {}
};
},
mounted() {
const updateCurrentTimestamp = () => {
this.currentTimestamp = moment().unix();
this.currentTimestampFormatted = {
"UTC": moment().utc().format("YYYY-MM-DDTHH:mm:ss[Z]"),
// 'UTC (local)': moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
// 'ISO 8601': moment().toISOString(),
// 'RFC 2822': moment().format('ddd, DD MMM YYYY HH:mm:ss ZZ'),
// 'RFC 850': moment().format('dddd, DD-MMM-YY HH:mm:ss [UTC]'),
// 'RFC 1036': moment().format('ddd, DD MMM YY HH:mm:ss ZZ'),
// 'RFC 1123': moment().format('ddd, DD MMM YYYY HH:mm:ss ZZ'),
// 'RFC 822': moment().format('ddd, DD MMM YY HH:mm:ss ZZ'),
// 'RFC 3339': moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
// 'COOKIE': moment().format('dddd, DD-MMM-YYYY HH:mm:ss [UTC]'),
// 'RSS': moment().format('ddd, DD MMM YYYY HH:mm:ss ZZ'),
"Unix Epoch": moment().unix(),
"YYYY-DD-MM": moment().format("YYYY/MM/DD"),
"SQL DATETIME": moment().toISOString().replaceAll(/[ZT]|(\.[0-9]{3})/g, " "),
"YYYY/DD/MM HH:MM:SS AM/PM": moment().format("YYYY/MM/DD HH:mm:ss A")
// 'DD.MM.YYYY HH:MM:SS': moment().format('DD.MM.YYYY HH:mm:ss'),
};
};
updateCurrentTimestamp();
setInterval(updateCurrentTimestamp, 1000);
},
methods: {
convertFromUnix() {
let timestamp = this.toolData.inputTimestamp.length ? this.toolData.inputTimestamp : this.currentTimestamp;
const date = moment.unix(timestamp);
this.toolData.inputYear = date.year();
this.toolData.inputMonth = date.month() + 1;
this.toolData.inputDay = date.day();
this.toolData.inputHour = date.hour();
this.toolData.inputMinute = date.minute();
this.toolData.inputSecond = date.second();
},
convertToUnix() {
const date = moment({
year: this.toolData.inputYear,
month: this.toolData.inputMonth - 1, // Months are 0-indexed
day: this.toolData.inputDay,
hour: this.toolData.inputHour,
minute: this.toolData.inputMinute,
second: this.toolData.inputSecond
});
this.toolData.inputTimestamp = date.unix();
},
copyTimestamp(text) {
navigator.clipboard.writeText(text)
.then(() => {
// console.log('Timestamp copied to clipboard!');
})
.catch(err => {
// console.error('Failed to copy: ', err);
});
}
}
};
</script>
<style>
.table-date-and-time th {
text-align: left;
}
.table-date-and-time td input {
width: 80px;
}
</style>