Merge branch 't'
Suvodip
commit
083494bd4d
|
|
@ -6,13 +6,13 @@ require_once('.htac_header.php');
|
|||
<section class="diZContainer diZmxAuto">
|
||||
<h1 class="diZBorderBottom">SiliconPin - Tools</h1>
|
||||
<div class="diZFlexRow diZmy8 diZFlexRow">
|
||||
<a href="/tools" class="diZButtonDefault diZmr2">All</a>
|
||||
<a href="/tools/image" class="diZButtonDefault diZmr2">Image</a>
|
||||
<a href="/tools/text" class="diZButtonDefault diZmr2">Text</a>
|
||||
<a href="/tools/html" class="diZButtonDefault diZmr2">HTML</a>
|
||||
<a href="/tools/color" class="diZButtonDefault diZmr2">Color</a>
|
||||
<a href="/tools/info" class="diZButtonDefault diZmr2">Info</a>
|
||||
<a href="/tools/encrypt-decrypt" class="diZButtonDefault diZmr2">Encrypt / Decrypt</a>
|
||||
<a href="/tools" class="diZButtonDefault diZmr2"><span>All</span></a>
|
||||
<a href="/tools/image" class="diZButtonDefault diZmr2"><span>Image</span></a>
|
||||
<a href="/tools/text" class="diZButtonDefault diZmr2"><span>Text</span></a>
|
||||
<a href="/tools/html" class="diZButtonDefault diZmr2"><span>HTML</span></a>
|
||||
<a href="/tools/color" class="diZButtonDefault diZmr2"><span>Color</span></a>
|
||||
<a href="/tools/info" class="diZButtonDefault diZmr2"><span>Info</span></a>
|
||||
<a href="/tools/encrypt-decrypt" class="diZButtonDefault diZmr2"><span>Encrypt / Decrypt</span></a>
|
||||
</div>
|
||||
<div class="diZGridCols1-3">
|
||||
<?php
|
||||
|
|
@ -31,9 +31,9 @@ require_once('.htac_header.php');
|
|||
foreach($rows as $row){
|
||||
// echo $row['name'].'<br>';
|
||||
if($row['status']==1){
|
||||
$link_button = '<a href="/tools/'.$row['slug'].'" ><p class="diZButtonDefault">'.$row['name'].'</p></a>';
|
||||
$link_button = '<a class="diZButtonDefault" href="/tools/'.$row['slug'].'" ><span class="">'.$row['name'].'</span></a>';
|
||||
} else{
|
||||
$link_button = '<p class="diZButtonDefault">'.$row['name'].'</p>';
|
||||
$link_button = '<a class="diZButtonDefault"><span>'.$row['name'].'</span></a>';
|
||||
}
|
||||
echo '
|
||||
<div class="diZblogStyle diZPadding10px">
|
||||
|
|
|
|||
18
_home.php
18
_home.php
|
|
@ -6,13 +6,13 @@ require_once('.htac_header.php');
|
|||
<section class="diZContainer diZmxAuto">
|
||||
<h1 class="diZBorderBottom">SiliconPin - Tools</h1>
|
||||
<div class="diZFlexRow diZmy8 diZFlexRow diZOverflowAuto diZWhiteSpaceNowrap">
|
||||
<a href="/tools" class="diZButtonDefault diZmr2">All</a>
|
||||
<a href="/tools/image" class="diZButtonDefault diZmr2">Image</a>
|
||||
<a href="/tools/text" class="diZButtonDefault diZmr2">Text</a>
|
||||
<a href="/tools/html" class="diZButtonDefault diZmr2">HTML</a>
|
||||
<a href="/tools/color" class="diZButtonDefault diZmr2">Color</a>
|
||||
<a href="/tools/info" class="diZButtonDefault diZmr2">Info</a>
|
||||
<a href="/tools/encrypt-decrypt" class="diZButtonDefault diZmr2">Encrypt / Decrypt</a>
|
||||
<a href="/tools" class="diZButtonDefault diZmr2"><span>All</span></a>
|
||||
<a href="/tools/image" class="diZButtonDefault diZmr2"><span>Image</span></a>
|
||||
<a href="/tools/text" class="diZButtonDefault diZmr2"><span>Text</span></a><br>
|
||||
<a href="/tools/html" class="diZButtonDefault diZmr2"><span>HTML</span></a>
|
||||
<a href="/tools/color" class="diZButtonDefault diZmr2"><span>Color</span></a>
|
||||
<a href="/tools/info" class="diZButtonDefault diZmr2"><span>Info</span></a>
|
||||
<a href="/tools/encrypt-decrypt" class="diZButtonDefault diZmr2"><span>Encrypt / Decrypt</span></a>
|
||||
</div>
|
||||
<div class="diZGridCols1-3">
|
||||
<?php
|
||||
|
|
@ -26,9 +26,9 @@ require_once('.htac_header.php');
|
|||
foreach($rows as $row){
|
||||
// echo $row['name'].'<br>';
|
||||
if($row['status']==1){
|
||||
$link_button = '<a href="/tools/'.$row['slug'].'" ><p class="diZButtonDefault">'.$row['name'].'</p></a>';
|
||||
$link_button = '<a class="diZButtonDefault" href="/tools/'.$row['slug'].'" ><span class="">'.$row['name'].'</span></a>';
|
||||
} else{
|
||||
$link_button = '<p class="diZButtonDefault">'.$row['name'].'</p>';
|
||||
$link_button = '<a class="diZButtonDefault"><span>'.$row['name'].'</span></a>';
|
||||
}
|
||||
echo '
|
||||
<div class="diZblogStyle diZPadding10px">
|
||||
|
|
|
|||
72
bar-code.php
72
bar-code.php
|
|
@ -1,17 +1,46 @@
|
|||
<section class="container-zz mx-auto my-20 flex-direction-col">
|
||||
<h1 style="font-size: 25px;">Generate BAR Code</h1>
|
||||
<!-- <h2 class="text-center">Alert: Text should not exceed 165 characters.</h2> -->
|
||||
<form id="barGenerator" action="" class="flex-direction-col">
|
||||
<textarea class="" name="" id="barCodeText" cols="36" rows="10" required style="background-color: #3d3d3d; padding: 6px;" autofocus></textarea>
|
||||
<input class="" onclick="displayBarCode();" id="generatButton" type="submit" value="Generate BAR Code" style="background-color: #3d3d3d; padding: 10px 20px 10px 20px; border-radius: 10px; cursor: pointer; margin-top: 10px;">
|
||||
</form>
|
||||
<div class="">
|
||||
<svg id="barCode"></svg>
|
||||
<div class="" id="buttonContainer">
|
||||
<button class="" id="download-button" style="background-color: #3d3d3d; padding: 10px 20px 10px 20px; border-radius: 10px; cursor: pointer; margin-top: 10px;">Download</button>
|
||||
<button class="" onclick="getNewCode();" style="background-color: #3d3d3d; padding: 10px 20px 10px 20px; border-radius: 10px; cursor: pointer; margin-top: 10px;">New BAR Code</button>
|
||||
<section class="diZContainer diZmxAuto">
|
||||
<h1 class="diZBorderBottom">Generate BAR Code</h1>
|
||||
<p class="diZTextJustify">This tool allows you to generate BAR codes from any text you input. The generated BAR code can be downloaded and used in various applications such as inventory management, product labeling, and more.</p>
|
||||
<div class="diZMaxW600 diZFlexColumn diZmxAuto toolsSection diZmy20">
|
||||
<form id="barGenerator" action="" class="diZFlexColumn">
|
||||
<textarea class="" name="" id="barCodeText" rows="12" required autofocus></textarea><br>
|
||||
<button onclick="displayBarCode();" id="generatButton"><span>Generate BAR Code</span></button>
|
||||
<!-- <input class="" onclick="displayBarCode();" id="generatButton" type="submit" value="Generate BAR Code" > -->
|
||||
</form>
|
||||
<div class="diZJustifyCenter diZFlexColumn diZItemsCenter">
|
||||
<svg id="barCode"></svg>
|
||||
<div class="diZmt4 diZFlexRow" id="buttonContainer">
|
||||
<button class="" id="download-button" ><span>Download</span></button>
|
||||
<button class="" onclick="getNewCode();" ><span>New BAR Code</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Text:</strong> Input your desired text into the text area provided.</li>
|
||||
<li><strong>Generate BAR Code:</strong> Click the "Generate BAR Code" button to convert the text into a BAR code.</li>
|
||||
<li><strong>View BAR Code:</strong> The generated BAR code will appear in the area below the button.</li>
|
||||
<li><strong>Download BAR Code:</strong> Click the "Download" button to save the BAR code as an image file.</li>
|
||||
<li><strong>Generate New BAR Code:</strong> Click the "New BAR Code" button to clear the text area and generate a new BAR code.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Generates BAR codes quickly and efficiently.</li>
|
||||
<li>Supports various text inputs.</li>
|
||||
<li>Provides a download option for the generated BAR code.</li>
|
||||
<li>Easy-to-use interface with clear instructions.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Businesses creating product labels for inventory management.</li>
|
||||
<li>Retail stores generating BAR codes for pricing and checkout systems.</li>
|
||||
<li>Developers testing BAR code generation in their applications.</li>
|
||||
<li>Individuals organizing personal collections with BAR code labels.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<script src="/assets/html2canvas.min.js"></script>
|
||||
<script>
|
||||
|
|
@ -22,7 +51,8 @@
|
|||
const barText = document.getElementById('barCodeText');
|
||||
document.getElementById('barCodeText').style.display = 'block';
|
||||
document.getElementById('buttonContainer').style.display = 'none';
|
||||
document.getElementById('generatButton').style.display = 'block';
|
||||
document.getElementById('generatButton').style.display = 'flex';
|
||||
document.getElementById('barCode').style.display = 'none';
|
||||
barGenerator.addEventListener('submit', async function (event) {
|
||||
event.preventDefault();
|
||||
const formData = {
|
||||
|
|
@ -34,8 +64,9 @@
|
|||
function displayBarCode(){
|
||||
JsBarcode("#barCode", barCodeText.value);
|
||||
document.getElementById('barCodeText').style.display = 'none';
|
||||
document.getElementById('buttonContainer').style.display = 'block';
|
||||
document.getElementById('buttonContainer').style.display = 'flex';
|
||||
document.getElementById('generatButton').style.display = 'none';
|
||||
document.getElementById('barCode').style.display = 'block';
|
||||
|
||||
// console.log(barCodeText)
|
||||
}
|
||||
|
|
@ -68,15 +99,4 @@
|
|||
function getNewCode(){
|
||||
window.location.reload();
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.container-zz{width:100%}@media (min-width: 640px){.container-zz{max-width:640px}}@media (min-width: 768px){.container-zz{max-width:768px}}@media (min-width: 1024px){.container-zz{max-width:1024px}}@media (min-width: 1280px){.container-zz{max-width:1280px}}@media (min-width: 1536px){.container-zz{max-width:1536px}}
|
||||
.mx-auto{margin-left:auto;margin-right:auto}
|
||||
.my-20{margin-top:5rem;margin-bottom:5rem}
|
||||
.flex-direction-col{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
|
|
@ -3,15 +3,15 @@
|
|||
<div class="diZMaxW500 diZmxAuto diZFlexColumn toolsSection diZmy20">
|
||||
<textarea rows="10" class="base64-textarea" placeholder="Enter base64 encoded image data"></textarea>
|
||||
<p class="diZDisplayNone diZDengerText" id="no-select-message"></p>
|
||||
<button class="convert-button diZmt2">Convert to Image</button>
|
||||
<button class="convert-button diZmt2"><span>Convert to Image</span></button>
|
||||
<div class="" id="preview"></div>
|
||||
|
||||
<div class="diZFlexColumn diZDisplayNone diZJustifyCenter" id="download-options" >
|
||||
<p>Choose Image Format & Download:</p>
|
||||
<div>
|
||||
<button class="format-button" data-format="png">PNG</button>
|
||||
<button class="format-button" data-format="jpeg">JPEG</button>
|
||||
<button class="format-button" data-format="webp">WebP</button>
|
||||
<div class="diZFlexRow">
|
||||
<button class="format-button" data-format="png"><span>PNG</span></button>
|
||||
<button class="format-button" data-format="jpeg"><span>JPEG</span></button>
|
||||
<button class="format-button" data-format="webp"><span>WebP</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,54 @@
|
|||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h2 class="diZBorderBottom">Get Current Location's Latitude & Longitude</h2>
|
||||
<p class="diZTextJustify">The Geolocation Tool is a powerful and user-friendly web application designed to pinpoint your exact geographical location. With just a click, this tool leverages advanced geolocation technology to provide you with accurate latitude and longitude coordinates of your current position</p>
|
||||
<div class="diZFlexColumn diZItemsCenter diZMaxW500 diZmxAuto diZmy20 toolsSection">
|
||||
<p class="diZDisplayNone" id="copiedNotice"></p>
|
||||
<div class="diZFlexRow diZItemsCenter diZFlexBetween">
|
||||
<h2 class="" id="demo"></h2>
|
||||
<span title="Click to copy Latitude & Longitude!" onclick="copyToClipboard()" class="diZCursorPointer"><img src="/assets/svg/copy.svg" /></span>
|
||||
</div>
|
||||
</div>
|
||||
<h2>Features:</h2>
|
||||
<ul>
|
||||
<li><strong>Real-Time Location Tracking:</strong> Instantly fetches and displays your current latitude and longitude.</li>
|
||||
<li><strong>User-Friendly Interface:</strong> Simple and intuitive design makes it easy for anyone to use.</li>
|
||||
<li><strong>High Accuracy:</strong> Utilizes modern geolocation APIs to ensure precise location data.</li>
|
||||
<li><strong>Privacy-Conscious:</strong> Only accesses your location when you allow it, ensuring your privacy is respected.</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
const x = document.getElementById("demo");
|
||||
const copiedNoticeSection = document.getElementById('copiedNotice');
|
||||
|
||||
function getLocation() {
|
||||
if (navigator.geolocation) {
|
||||
navigator.geolocation.getCurrentPosition(showPosition);
|
||||
} else {
|
||||
x.innerHTML = "Geolocation is not supported by this browser.";
|
||||
}
|
||||
}
|
||||
getLocation();
|
||||
|
||||
function showPosition(position) {
|
||||
x.innerHTML = "Latitude: " + position.coords.latitude +
|
||||
"<br>Longitude: " + position.coords.longitude;
|
||||
}
|
||||
|
||||
|
||||
function copyToClipboard() {
|
||||
const copyText = document.getElementById("demo").innerText;
|
||||
const textArea = document.createElement("textarea");
|
||||
textArea.value = copyText;
|
||||
document.body.appendChild(textArea);
|
||||
textArea.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(textArea);
|
||||
setTimeout(() => {
|
||||
copiedNoticeSection.style.display = 'none';
|
||||
}, 1000);
|
||||
copiedNoticeSection.style.display = 'block';
|
||||
copiedNoticeSection.innerHTML = 'Coordinates copied to clipboard!';
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
@ -17,13 +17,41 @@ function generateRandomName($length = 6) {
|
|||
$randomFirstName = generateRandomName(mt_rand(4, 8));
|
||||
$randomLastName = generateRandomName(mt_rand(4, 8));
|
||||
?>
|
||||
<div class="container-zz mx-auto my-20">
|
||||
<h2 style="font-size: 25px; text-align: center;">Get a Random Name</h2>
|
||||
<p style="font-size: 25px;">First Name: <?php echo $randomFirstName; ?> </p>
|
||||
<p style="font-size: 25px;">Last Name: <?php echo $randomLastName; ?> </p>
|
||||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h2 class="diZBorderBottom">Get a Random Name</h2>
|
||||
<div class="diZMaxW500 diZFlexColumn diZItemsCenter diZJustifyCenter diZmxAuto toolsSection diZmy20">
|
||||
<span class="diZDisplayNone" id="copiedNoticeName">Copied to clipboard</span>
|
||||
<div class="diZFlexRow diZItemsCenter diZJustifyCenter">
|
||||
<h2 id="randomName"><?php echo $randomFirstName . ' ' . $randomLastName; ?></h2>
|
||||
<span class="diZCursorPointer" onclick="copyNameToClipboard()"><img src="/assets/svg/copy.svg" alt="Copy to Clipboard"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<h3>Random Name Usage:</h3>
|
||||
<ul>
|
||||
<li class="diZTextJustify diZmt2">Generate random names for testing or placeholder purposes in applications or websites.</li>
|
||||
<li class="diZTextJustify diZmt2">Use randomly generated names in mockups or design prototypes.</li>
|
||||
<li class="diZTextJustify diZmt2">Create unique usernames or profile names in development environments.</li>
|
||||
<li class="diZTextJustify diZmt2">Generate fictional character names for creative writing or gaming applications.</li>
|
||||
<li class="diZTextJustify diZmt2">Provide random names for demo accounts or example data in presentations.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<style>
|
||||
.container-zz{width:100%}@media (min-width: 640px){.container-zz{max-width:640px}}@media (min-width: 768px){.container-zz{max-width:768px}}@media (min-width: 1024px){.container-zz{max-width:1024px}}@media (min-width: 1280px){.container-zz{max-width:1280px}}@media (min-width: 1536px){.container-zz{max-width:1536px}}
|
||||
.mx-auto{margin-left:auto;margin-right:auto}
|
||||
.my-20{margin-top:5rem;margin-bottom:5rem}
|
||||
</style>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
function copyNameToClipboard() {
|
||||
var copyText = document.getElementById('randomName');
|
||||
var textArea = document.createElement('textarea');
|
||||
textArea.value = copyText.textContent.trim();
|
||||
document.body.appendChild(textArea);
|
||||
textArea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textArea);
|
||||
|
||||
var copiedNotice = document.getElementById('copiedNoticeName');
|
||||
copiedNotice.style.display = 'block';
|
||||
setTimeout(function() {
|
||||
copiedNotice.style.display = 'none';
|
||||
}, 1000);
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,20 +1,61 @@
|
|||
<?php
|
||||
function generateRandomUniqueNumber($length = 10) {
|
||||
$randomNumber = '';
|
||||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h2 class="diZBorderBottom">Random Unique Number Generator</h2>
|
||||
<p class="diZTextJustify">This tool generates a random and unique number sequence every time it's called. It combines a random string of digits with a unique identifier based on the current microtime, ensuring that each generated number is both unpredictable and unique. This ensures that generated IDs do not conflict in the future. Use it for various applications where unique identifiers or random tokens are required, such as in cryptographic nonce generation, session identifiers, or unique transaction IDs.</p>
|
||||
<div class="diZmy20">
|
||||
<?php
|
||||
function generateRandomUniqueNumber($length = 10) {
|
||||
$randomNumber = '';
|
||||
|
||||
for ($i = 0; $i < $length; $i++) {
|
||||
$randomNumber .= mt_rand(0, 9);
|
||||
}
|
||||
|
||||
// Append a unique identifier (based on microtime)
|
||||
$uniqueId = uniqid();
|
||||
$randomUniqueNumber = $randomNumber . $uniqueId;
|
||||
|
||||
return $randomUniqueNumber;
|
||||
}
|
||||
// Usage
|
||||
$randomUniqueNumber = generateRandomUniqueNumber();
|
||||
// echo $randomUniqueNumber;
|
||||
?>
|
||||
<div class="diZMaxW500 diZFlexColumn diZItemsCenter diZJustifyCenter diZmxAuto toolsSection">
|
||||
<span class="diZDisplayNone" id="copiedNotice">Copied to clipboard</span>
|
||||
<div class="diZFlexRow diZItemsCenter diZJustifyCenter">
|
||||
<h2 id="randomNumber"><?php echo $randomUniqueNumber; ?></h2>
|
||||
<span title="Click to copy Siliconid!" onclick="copyToClipboard()" class="diZCursorPointer"><img src="/assets/svg/copy.svg" /></span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li class="diZTextJustify"><strong>Order and Transaction IDs:</strong> Generate unique identifiers for orders and transactions in e-commerce platforms to ensure each transaction is uniquely identified and tracked.</li>
|
||||
<li class="diZTextJustify"><strong>Session IDs:</strong> Use unique numbers as session identifiers in web applications to manage user sessions securely and uniquely.</li>
|
||||
<li class="diZTextJustify"><strong>Cryptographic Nonces:</strong> Generate random tokens for cryptographic nonces in security-sensitive operations to prevent replay attacks and ensure message integrity.</li>
|
||||
<li class="diZTextJustify"><strong>API Tokens:</strong> Create unique tokens for API authentication and authorization purposes, ensuring secure and verifiable access to APIs.</li>
|
||||
<li class="diZTextJustify"><strong>Coupon and Voucher Codes:</strong> Generate unique codes for promotional coupons and vouchers to track redemptions and prevent duplication.</li>
|
||||
<li class="diZTextJustify"><strong>Database Keys:</strong> Generate unique primary keys or identifiers for database records to ensure data integrity and efficient data retrieval.</li>
|
||||
<li class="diZTextJustify"><strong>Logging and Tracking:</strong> Use unique numbers as tracking IDs in logging systems to uniquely identify and trace events or actions within applications.</li>
|
||||
<li class="diZTextJustify"><strong>Password Reset Tokens:</strong> Generate unique tokens for password reset links sent via email to securely verify and authorize password changes.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
function copyToClipboard() {
|
||||
var copyText = document.getElementById('randomNumber');
|
||||
var textArea = document.createElement('textarea');
|
||||
textArea.value = copyText.textContent.trim();
|
||||
document.body.appendChild(textArea);
|
||||
textArea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textArea); //copiedNotice
|
||||
setTimeout(() => {
|
||||
document.getElementById('copiedNotice').style.display = 'none';
|
||||
}, 1000);
|
||||
document.getElementById('copiedNotice').style.display = 'block';
|
||||
|
||||
|
||||
// Generate a random string of digits
|
||||
for ($i = 0; $i < $length; $i++) {
|
||||
$randomNumber .= mt_rand(0, 9);
|
||||
}
|
||||
|
||||
// Append a unique identifier (based on microtime)
|
||||
$uniqueId = uniqid();
|
||||
$randomUniqueNumber = $randomNumber . $uniqueId;
|
||||
|
||||
return $randomUniqueNumber;
|
||||
}
|
||||
|
||||
// Usage
|
||||
$randomUniqueNumber = generateRandomUniqueNumber();
|
||||
echo $randomUniqueNumber;
|
||||
?>
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -5,8 +5,10 @@
|
|||
<input style="width: 96%;" onchange="visibleColor();" type="text" id="hex" value="#" pattern="^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$" required ><br>
|
||||
<br>
|
||||
<div id="result"></div><br>
|
||||
<button id="convert-button" onclick="convertHexToRgb()">Convert</button>
|
||||
<button id="copyButton" onclick="copyToClipboard()">Copy</button>
|
||||
<div class="diZFlexRow">
|
||||
<button id="convert-button" onclick="convertHexToRgb()"><span>Convert</span></button>
|
||||
<button id="copyButton" onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
152
html-cleaner.php
152
html-cleaner.php
|
|
@ -1,88 +1,76 @@
|
|||
<?php
|
||||
require_once('.htac_header.php');
|
||||
?>
|
||||
|
||||
<div class="page-container">
|
||||
<div class="container-dxc">
|
||||
<h1 style="text-align: center; font-size: 25px;">HTML Remover</h1>
|
||||
<label for="htmlInput">Input Text with HTML:</label>
|
||||
<textarea class="cleanhtml-textarea" id="htmlInput" placeholder="Paste your text with html here..."></textarea>
|
||||
<button class="button-style" onclick="cleanHTML()" style="width: 100%;">Remove</button>
|
||||
|
||||
<label for="cleanedHTML">Cleaned Text:</label>
|
||||
<textarea class="cleanhtml-textarea" id="cleanedHTML" readonly placeholder="Cleaned Text will appear here..."></textarea>
|
||||
<P style="display: none; text-align: center;" id="copied-notice"></P>
|
||||
<button class="button-style" onclick="copyToClipboard()" style="width: 100%;">Copy</button>
|
||||
<section class="diZContainer diZmxAuto diZmy4">
|
||||
<h1 class="diZBorderBottom">HTML Remover</h1>
|
||||
<p class="diZTextJustify">The HTML Remover tool helps you clean text by removing all HTML tags, leaving only plain text. It's perfect for extracting content from HTML code without any formatting.</p>
|
||||
<div class="diZFlexColumn diZMaxW600 diZmxAuto diZmy20 toolsSection">
|
||||
<div class="diZmt2 diZFlexColumn">
|
||||
<label for="htmlInput">Input Text with HTML:</label>
|
||||
<textarea class="diZTextAreaResizeNone" rows="10" id="htmlInput" placeholder="Paste your text with html here..."></textarea>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZItemsCenter">
|
||||
<button class="diZmt2 " onclick="cleanHTML()"><span>Remove</span></button>
|
||||
</div>
|
||||
<div class="diZmt2 diZFlexColumn">
|
||||
<label for="cleanedHTML">Cleaned Text:</label>
|
||||
<textarea class="diZTextAreaResizeNone" rows="10" id="cleanedHTML" readonly placeholder="Cleaned Text will appear here..."></textarea>
|
||||
</div>
|
||||
<p class="diZDisplayNone" id="copied-notice"></p>
|
||||
<div class="diZFlexColumn diZItemsCenter">
|
||||
<button class="diZmt2 " onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<!-- diZwFit diZJustifyCenter diZItemsCenter -->
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Text with HTML:</strong> Paste your desired text with HTML into the text area provided.</li>
|
||||
<li><strong>Remove HTML:</strong> Click the "Remove" button to clean the text, stripping out all HTML tags.</li>
|
||||
<li><strong>View Cleaned Text:</strong> The cleaned, plain text will appear in the output text area below.</li>
|
||||
<li><strong>Copy Cleaned Text:</strong> Click the "Copy" button to copy the cleaned text to your clipboard.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Effortlessly removes all HTML tags from the input text.</li>
|
||||
<li>Provides a user-friendly interface for inputting and viewing text.</li>
|
||||
<li>Includes a copy function to quickly copy the cleaned text to your clipboard.</li>
|
||||
<li>Displays a notification when the text is successfully copied to the clipboard.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Writers and editors extracting plain text content from HTML-formatted documents.</li>
|
||||
<li>Developers cleaning up text before using it in applications or databases.</li>
|
||||
<li>Content creators preparing text for use in plain text editors or word processors.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<script>
|
||||
function cleanHTML() {
|
||||
const inputHTML = document.getElementById("htmlInput").value;
|
||||
|
||||
// Create a temporary element to hold the input HTML
|
||||
const tempDiv = document.createElement("div");
|
||||
tempDiv.innerHTML = inputHTML;
|
||||
|
||||
// Remove all HTML tags
|
||||
const plainText = tempDiv.textContent || tempDiv.innerText || "";
|
||||
|
||||
document.getElementById("cleanedHTML").value = plainText;
|
||||
}
|
||||
|
||||
function copyToClipboard() {
|
||||
const cleanedHTML = document.getElementById("cleanedHTML").value;
|
||||
navigator.clipboard.writeText(cleanedHTML)
|
||||
.then(() => {
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
document.getElementById('copied-notice').innerHTML = 'Slug copied to clipboard!';
|
||||
})
|
||||
.catch(err => {
|
||||
console.error('Failed to copy: ', err);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.page-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
/* background-color: #f4f4f4; */
|
||||
function cleanHTML() {
|
||||
const inputHTML = document.getElementById("htmlInput").value;
|
||||
|
||||
// Create a temporary element to hold the input HTML
|
||||
const tempDiv = document.createElement("div");
|
||||
tempDiv.innerHTML = inputHTML;
|
||||
|
||||
// Remove all HTML tags
|
||||
const plainText = tempDiv.textContent || tempDiv.innerText || "";
|
||||
|
||||
document.getElementById("cleanedHTML").value = plainText;
|
||||
}
|
||||
|
||||
.container-dxc {
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
background-color: #3d3d3d;
|
||||
padding: 30px;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.1);
|
||||
function copyToClipboard() {
|
||||
const cleanedHTML = document.getElementById("cleanedHTML").value;
|
||||
navigator.clipboard.writeText(cleanedHTML)
|
||||
.then(() => {
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
document.getElementById('copied-notice').innerHTML = 'Text copied to clipboard!';
|
||||
setTimeout(() => {
|
||||
document.getElementById('copied-notice').style.display = 'none';
|
||||
}, 1000);
|
||||
|
||||
})
|
||||
.catch(err => {
|
||||
// console.error('Failed to copy: ', err);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
.cleanhtml-textarea {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
margin-bottom: 15px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
resize: vertical;
|
||||
background-color: #3d3d3d;
|
||||
}
|
||||
|
||||
.button-style{
|
||||
padding: 10px 20px;
|
||||
background-color: #7d7d7d;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.button-style:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
|
|
@ -1,15 +1,12 @@
|
|||
<?php
|
||||
require_once('.htac_header.php');
|
||||
?>
|
||||
|
||||
<section class="diZContainer diZmxAuto diZmy20">
|
||||
<div class="diZMaxW600 diZmxAuto">
|
||||
<h1>HTML Decoder</h1>
|
||||
<div class="diZFlexColumn">
|
||||
<section class="diZContainer diZmxAuto ">
|
||||
<h1 class="diZBorderBottom">HTML Decoder</h1>
|
||||
<div class="diZMaxW600 diZmxAuto toolsSection diZmy20">
|
||||
<div class="diZFlexColumn diZJustifyCenter">
|
||||
<textarea class="diZScrollBarNone" rows="10" id="encodedText" placeholder="Enter encoded HTML here..."></textarea>
|
||||
<button class="diZmt4" onclick="decodeHtml()">Decode</button>
|
||||
<div></div>
|
||||
<button class="diZmt4 diZmxAuto" onclick="decodeHtml()"><span>Decode</span></button>
|
||||
<textarea class="diZmt4 diZScrollBarNone" rows="10" id="decodedText" readonly placeholder="Decoded HTML will appear here..."></textarea>
|
||||
<button class="diZmt4" id="copyButton" onclick="copyToClipboard()">Copy</button>
|
||||
<button class="diZmt4 diZmxAuto" id="copyButton" onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -2,16 +2,16 @@
|
|||
require_once('.htac_header.php');
|
||||
?>
|
||||
<section class="diZContainer diZmxAuto diZmy20">
|
||||
<div class="diZMaxW600 diZmxAuto">
|
||||
<div class="diZMaxW600 diZmxAuto toolsSection">
|
||||
<h1>HTML Encoder</h1>
|
||||
<div class="diZFlexColumn">
|
||||
<textarea class="diZScrollBarNone" rows="10" id="inputText" placeholder="Enter HTML code here..."></textarea>
|
||||
|
||||
<button class="diZmt4" onclick="encodeHtml()">Encode</button>
|
||||
<button class="diZmt4 diZmxAuto" onclick="encodeHtml()"><span>Encode</span></button>
|
||||
|
||||
<textarea class="diZmt4 diZScrollBarNone" rows="10" id="outputText" readonly placeholder="Encoded HTML will appear here..."></textarea>
|
||||
|
||||
<button class="diZmt4" id="copyButton" onclick="copyToClipboard()">Copy</button>
|
||||
<button class="diZmt4 diZmxAuto" id="copyButton" onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<section class="diZContainer diZmxAuto ">
|
||||
<h1 class="diZBorderBottom">Image Compression Tool</h1>
|
||||
<div class="toolsSection diZMaxW500 diZmxAuto diZmy20">
|
||||
<div class="toolsSection diZMaxW600 diZmxAuto diZmy20">
|
||||
<div>
|
||||
<input type="file" id="imageInput" accept="image/*">
|
||||
</div>
|
||||
|
|
@ -16,8 +16,8 @@
|
|||
<span id="imageSize" class="image-size"></span>
|
||||
</div>
|
||||
<div class="diZFlexBetween">
|
||||
<button class="comp-button" onclick="compressImage()">Compress Image</button>
|
||||
<a class="diZDisplayNone diZButtonDefault" id="downloadLink" href="#" download="compressed_image.jpg">Download Compressed Image</a>
|
||||
<button class="comp-button" onclick="compressImage()"><span>Compress Image</span></button>
|
||||
<a class="diZDisplayNone diZButtonDefault" id="downloadLink" href="#" download="compressed_image.jpg"><span>Download Compressed Image</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -57,7 +57,7 @@ function compressImage() {
|
|||
|
||||
preview.src = url;
|
||||
downloadLink.href = url;
|
||||
downloadLink.style.display = 'block';
|
||||
downloadLink.style.display = 'flex';
|
||||
|
||||
const imageSizeSpan = document.getElementById('imageSize');
|
||||
const compressedSize = (blob.size / 1024).toFixed(2); // Convert bytes to kilobytes and round to 2 decimal places
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<section class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Convert Image to Base64</h2>
|
||||
<div class="diZMaxW500 diZmxAuto toolsSection diZmy20">
|
||||
<div class="diZMaxW600 diZmxAuto toolsSection diZmy20">
|
||||
<div class="diZFlexColumn ">
|
||||
<input type="file" class="image-input diZmt2" accept="image/*">
|
||||
<textarea rows="10" class="base64-textarea diZmt2" readonly></textarea>
|
||||
<p class="diZDisplayNone diZTextCenter diZmt2" id="copied-notice"></p>
|
||||
<div class="diZmt2" id="preview" ></div>
|
||||
<button class="copy-button diZmt2">Copy Base64</button>
|
||||
<button class="copy-button diZmt2 diZmxAuto"><span>Copy Base64</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -4,17 +4,19 @@
|
|||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h1 class="diZBorderBottom">JSON Formatter</h1>
|
||||
<div class="diZFlexRowCol">
|
||||
<div class="diZw100 jsonCustomHeight diZFlexColumn diZJsonInputBorder">
|
||||
<div class="diZw100 jsonCustomHeight diZFlexColumn diZJsonInputBorder diZBorderRadius5px diZmr2">
|
||||
<textarea oninput="parseJSON()" id="jsonInput" class="diZJsonInput diZScrollBarNone" rows="40" placeholder="Enter JSON here"></textarea><br>
|
||||
</div>
|
||||
<div class="diZw100 jsonCustomHeight diZFlexColumn diZJsonInputBorder">
|
||||
<div class="diZw100 jsonCustomHeight diZFlexColumn diZJsonInputBorder diZBorderRadius5px">
|
||||
<div id="output" class="diZJsonViewer"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diZFloatRight diZFlexRow diZJustifyCenter diZItemsCenter">
|
||||
<p class=" diZJsonKey" id="countArray">Array Length: 0</p>
|
||||
<button class="diZmt4 diZmb4 diZml2" onclick="copyToClipboard()"><span>Copy JSON</span></button>
|
||||
<button class="diZmt4 diZmb4 diZml2" onclick="downloadJsonData()"><span>Download JSON</span></button>
|
||||
</div>
|
||||
|
||||
<button class="diZFloatRight diZmt4 diZmb4 diZml2 diZJsonCopyButton" onclick="copyToClipboard()">Copy JSON</button>
|
||||
<button class="diZFloatRight diZmt4 diZmb4 diZml2 diZJsonCopyButton" onclick="downloadJsonData()">Download JSON</button>
|
||||
<p class="diZFloatRight diZJsonKey diZmt4" id="countArray">Array Length: 0</p>
|
||||
</section>
|
||||
<script>
|
||||
function parseJSON() {
|
||||
|
|
@ -29,7 +31,6 @@
|
|||
document.getElementById('countArray').innerHTML = 'Array Length: '+ totalObjects;
|
||||
} catch (error) {
|
||||
outputElement.textContent = 'Error parsing JSON: ' + error.message;
|
||||
outputElement.style.color = '#fff';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,47 +1,75 @@
|
|||
<div class="container-cc">
|
||||
<div class="content-cc">
|
||||
<h2 class="title-cc">Case Converter</h2>
|
||||
<form class="form-cc">
|
||||
<label class="label-cc" for="inputString">Input Text:</label>
|
||||
<textarea id="inputString" class="textarea-cc" name="inputString" rows="4" cols="50" oninput="convertCase()"></textarea>
|
||||
|
||||
<div class="case-options-cc">
|
||||
<div class="case-option-cc" onclick="setActive(this)" data-case="uppercase">Uppercase</div>
|
||||
<div class="case-option-cc" onclick="setActive(this)" data-case="lowercase">Lowercase</div>
|
||||
<div class="case-option-cc" onclick="setActive(this)" data-case="titlecase">Titlecase</div>
|
||||
<section class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Case Converter</h2>
|
||||
<p class="diZTextJustify">The Letter Case Converter tool allows you to effortlessly change the case of your text to Uppercase, Lowercase, or Title Case. Whether you're writing a document, formatting code, or preparing content for publication, this tool provides a quick and easy way to ensure your text is in the desired case format.</p>
|
||||
<div class="diZMaxW600 diZmxAuto toolsSection diZmt20 ">
|
||||
<form class="diZFlexColumn">
|
||||
<label class="" for="inputString">Input Text:</label>
|
||||
<textarea id="inputString" class="diZTextAreaResizeNone" name="inputString" rows="8" oninput="convertCase()"></textarea>
|
||||
<div class="diZFlexBetween diZmt4">
|
||||
<div class="caseOptionButton diZButtonDefault" onclick="setActive(this)" data-case="uppercase"><span>Uppercase</span></div>
|
||||
<div class="caseOptionButton diZButtonDefault" onclick="setActive(this)" data-case="lowercase"><span>Lowercase</span></div>
|
||||
<div class="caseOptionButton diZButtonDefault" onclick="setActive(this)" data-case="titlecase"><span>Titlecase</span></div>
|
||||
</div>
|
||||
</form>
|
||||
<div id="result" class="result-cc"></div>
|
||||
<P style="display: none; text-align: center;" id="copied-notice"></P>
|
||||
<button type="button" class="copy-button-cc" onclick="copyToClipboard()" style="background-color: #7d7d7d; width: 100%; margin-top: 10px;">Copy</button>
|
||||
<div class="diZFlexColumn">
|
||||
<textarea id="result" rows="7" readonly class="result-cc diZTextAreaResizeNone diZmt4"></textarea>
|
||||
<p class="diZDisplayNone diZmt4" id="copied-notice"></p>
|
||||
<button type="button" class="copy-button-cc diZmt4 diZmxAuto" onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diZmb20">
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Text:</strong> Input your desired text into the text area provided.</li>
|
||||
<li><strong>Choose Case Conversion:</strong> Select the type of conversion you want: Uppercase, Lowercase, or Title Case.</li>
|
||||
<!-- <li><strong>Convert Text:</strong> Click the "Convert" button to apply the selected case transformation to your text.</li> -->
|
||||
<li><strong>Copy Converted Text:</strong> Once converted, the text will appear in the output text area. Click the "Copy" button to copy it to your clipboard.</li>
|
||||
<li><strong>Paste and Use:</strong> Paste the copied text into your document, email, or any other text field where you need the transformed text.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Converts text to uppercase.</li>
|
||||
<li>Converts text to lowercase.</li>
|
||||
<li>Converts text to title case.</li>
|
||||
<li>Provides instant feedback with a "Text copied to clipboard!" notification upon copying.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Writers ensuring consistent capitalization in their documents.</li>
|
||||
<li>Developers needing text transformations for various programming tasks.</li>
|
||||
<li>Students formatting essays and assignments according to specific case requirements.</li>
|
||||
<li>Content creators adjusting the text case for social media posts, emails, or presentations.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
function convertCase() {
|
||||
var inputString = document.getElementById("inputString").value;
|
||||
var targetCase = document.querySelector('.case-option-cc.active').getAttribute('data-case');
|
||||
var targetCase = document.querySelector('.caseOptionButton.active').getAttribute('data-case');
|
||||
var result = document.getElementById("result");
|
||||
|
||||
if (inputString.trim() === "") {
|
||||
result.innerHTML = "Please enter a string.";
|
||||
result.value = "Please enter a string.";
|
||||
return;
|
||||
}
|
||||
|
||||
if (targetCase === 'uppercase') {
|
||||
result.innerHTML = inputString.toUpperCase();
|
||||
result.value = inputString.toUpperCase();
|
||||
} else if (targetCase === 'lowercase') {
|
||||
result.innerHTML = inputString.toLowerCase();
|
||||
result.value = inputString.toLowerCase();
|
||||
} else if (targetCase === 'titlecase') {
|
||||
result.innerHTML = inputString.replace(/\w\S*/g, function (txt) {
|
||||
result.value = inputString.replace(/\w\S*/g, function (txt) {
|
||||
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
|
||||
});
|
||||
} else {
|
||||
result.innerHTML = "Invalid target case specified.";
|
||||
result.value = "Invalid target case specified.";
|
||||
}
|
||||
}
|
||||
|
||||
function setActive(button) {
|
||||
var buttons = document.querySelectorAll('.case-option-cc');
|
||||
var buttons = document.querySelectorAll('.caseOptionButton');
|
||||
buttons.forEach(function(btn) {
|
||||
btn.classList.remove('active');
|
||||
});
|
||||
|
|
@ -59,111 +87,18 @@
|
|||
document.execCommand("copy");
|
||||
window.getSelection().removeAllRanges();
|
||||
// alert("Copied to clipboard!");
|
||||
|
||||
setTimeout(() => {
|
||||
document.getElementById('copied-notice').style.display = 'none';
|
||||
}, 1000);
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
document.getElementById('copied-notice').innerHTML = 'Copied to clipboard!';
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.container-cc {
|
||||
font-family: Arial, sans-serif;
|
||||
/* background-color: #3d3d3d; */
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 30px;
|
||||
/* padding-bottom: 30px; */
|
||||
}
|
||||
|
||||
.content-cc {
|
||||
/* background-color: #7d7d7d; */
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
padding: 20px;
|
||||
width: 500px;
|
||||
}
|
||||
.content-cc {
|
||||
background-color: #3d3d3d;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(255, 255, 255, 0.1);
|
||||
padding: 20px;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
.content-cc {
|
||||
width: 800px; /* Width for large screens */
|
||||
}
|
||||
}
|
||||
|
||||
.title-cc {
|
||||
font-size: 25px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.form-cc {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.label-cc {
|
||||
margin-bottom: 5px;
|
||||
/* color: #555; */
|
||||
}
|
||||
|
||||
.textarea-cc {
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
resize: none;
|
||||
margin-bottom: 15px;
|
||||
background-color: #3d3d3d;
|
||||
}
|
||||
|
||||
.case-options-cc {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.case-option-cc {
|
||||
flex-grow: 1;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
border: 1px solid #007bff;
|
||||
color: #FFF;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
.case-option-cc:hover {
|
||||
background-color: #007bff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.result-cc {
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
min-height: 100px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.copy-button-cc {
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
padding: 10px 20px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
.copy-button-cc:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
.active{
|
||||
background-color: #05b3a4;
|
||||
border: 2px solid #4caf50;
|
||||
background: transparent;
|
||||
color: #4caf50;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<?php
|
||||
require '.hta_lib/vendors/maxmind-db-reader/vendor/autoload.php';
|
||||
|
||||
use GeoIp2\Database\Reader;
|
||||
|
||||
if (isset($_GET['ip'])) {
|
||||
try {
|
||||
$reader = new Reader('.hta_lib/data/GeoLite2-City.mmdb');
|
||||
|
||||
$records = $reader->city($_GET['ip']);
|
||||
|
||||
$city = $records->city->name;
|
||||
|
||||
echo json_encode(['city' => $city]);
|
||||
} catch (Exception $e) {
|
||||
echo json_encode(['error' => $e->getMessage()]);
|
||||
}
|
||||
} else {
|
||||
echo json_encode(['error' => 'Invalid parameters']);
|
||||
}
|
||||
?>
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
<?php
|
||||
echo 'Current Location';
|
||||
?>
|
||||
|
|
@ -1,121 +1,94 @@
|
|||
<style>
|
||||
.button-style-md5{
|
||||
padding: 20px 20px;
|
||||
background-color: #7d7d7d;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
}
|
||||
.button-style-md5:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
|
||||
.custom-container {
|
||||
max-width: 500px;
|
||||
margin: 50px auto;
|
||||
background-color: #3d3d3d;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0px 0px 10px 0px rgba(255,255,255,0.1);
|
||||
}
|
||||
.custom-heading {
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
.custom-label {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.custom-input {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.custom-submit {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
.custom-submit:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
</style>
|
||||
<?php require_once ('.hta_config/siliconpin_sp.php'); ?>
|
||||
<?php
|
||||
|
||||
if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
try {
|
||||
$db = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
||||
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
||||
$stmt = $db->prepare("SELECT * FROM md5_data WHERE md5 = :md5");
|
||||
$stmt->bindParam(':md5', $_POST["md5-hash"]);
|
||||
$stmt->execute();
|
||||
$result = $stmt->fetch(PDO::FETCH_ASSOC);
|
||||
|
||||
if ($result) {
|
||||
echo '<div style="display: flex; justify-content: center;">
|
||||
<div style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<p style="text-align: center; font-size: 25px; ">Given MD5 Vlue: </p>
|
||||
<p style="display: none; text-align: center;" id="copied-notice"></p>
|
||||
<div style="display: flex; flex-direction: row;">
|
||||
<input id="output" type="text" readonly value="'.$result['value'].'" style="color: #fff; padding: 10px 10px 10px 10px; font-size: 25px; outline: none;" />
|
||||
<button class="button-style-md5" id="copyButton" onclick="copyOutputText()">Copy</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>';
|
||||
echo '
|
||||
<script>
|
||||
function copyOutputText() {
|
||||
const outputText = document.getElementById(\'output\').value;
|
||||
const textarea = document.createElement(\'textarea\');
|
||||
textarea.value = outputText;
|
||||
document.body.appendChild(textarea);
|
||||
textarea.select();
|
||||
document.execCommand(\'copy\');
|
||||
document.body.removeChild(textarea);
|
||||
document.getElementById(\'copied-notice\').style.display = \'block\';
|
||||
document.getElementById(\'copied-notice\').innerHTML = \'MD5 value copied to clipboard!\';
|
||||
}
|
||||
</script>
|
||||
';
|
||||
} else {
|
||||
echo '<div style="display: flex; justify-content: center;">
|
||||
<div style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<p style="text-align: center; font-size: 25px; ">No data found for the given MD5 hash </p>
|
||||
<div style="display: flex; flex-direction: row;">
|
||||
<button class="button-style-md5" id="" onclick="tryAgain()">Try Again</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>';
|
||||
echo ' <script>
|
||||
function tryAgain() {
|
||||
window.location.href="/tools/md5-decryption";
|
||||
}
|
||||
</script>' ;
|
||||
// echo json_encode(array('success' => false, 'message' => 'No data found for the given MD5 hash'));
|
||||
}
|
||||
exit();
|
||||
} catch (PDOException $e) {
|
||||
echo json_encode(array('success' => false, 'message' => 'Database error: ' . $e->getMessage()));
|
||||
exit();
|
||||
}
|
||||
}
|
||||
require_once ('.hta_config/db_config.php');
|
||||
?>
|
||||
<div class="custom-container">
|
||||
<h2 class="custom-heading">MD5 Decryption</h2>
|
||||
<form method="post" action="">
|
||||
<label for="md5-hash" class="custom-label">Enter Text:</label><br>
|
||||
<input type="text" id="md5-hash" name="md5-hash" class="custom-input"><br><br>
|
||||
<input type="submit" value="Generate MD5 Hash" class="custom-submit" style="background-color: #7d7d7d;">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h2 class="diZBorderBottom">MD5 Decryption</h2>
|
||||
<p class="diZTextJustify">The MD5 Decryption Tool is designed to help you decrypt MD5 hashes. It searches a pre-existing database for the original text corresponding to a given MD5 hash and retrieves it if available. This tool is especially useful for developers and security professionals who need to quickly look up the original value of an MD5 hash.</p>
|
||||
<div class="diZMaxW600 diZmxAuto toolsSection diZmy20">
|
||||
<?php
|
||||
if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
try {
|
||||
$db = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
||||
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
||||
$stmt = $db->prepare("SELECT * FROM md5_data WHERE md5 = :md5");
|
||||
$stmt->bindParam(':md5', $_POST["md5-hash"]);
|
||||
$stmt->execute();
|
||||
$result = $stmt->fetch(PDO::FETCH_ASSOC);
|
||||
|
||||
if ($result) {
|
||||
echo ' <div class="">
|
||||
<p>Given MD5 Vlue: </p>
|
||||
<p class="diZDisplayNone" id="copied-notice"></p>
|
||||
<div class="diZFlexColumn">
|
||||
<textarea class="diZTextAreaResizeNone" rows="8" id="output" readonly>'.$result['value'].'</textarea><br>
|
||||
<button class="diZmxAuto" id="copyButton" onclick="copyOutputText()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>';
|
||||
echo '
|
||||
<script>
|
||||
function copyOutputText() {
|
||||
const outputText = document.getElementById(\'output\').value;
|
||||
const textarea = document.createElement(\'textarea\');
|
||||
textarea.value = outputText;
|
||||
document.body.appendChild(textarea);
|
||||
textarea.select();
|
||||
document.execCommand(\'copy\');
|
||||
document.body.removeChild(textarea);
|
||||
document.getElementById(\'copied-notice\').style.display = \'block\';
|
||||
document.getElementById(\'copied-notice\').innerHTML = \'MD5 value copied to clipboard!\';
|
||||
}
|
||||
</script>';
|
||||
} else {
|
||||
echo '<div>
|
||||
<div>
|
||||
<p>No data found for the given MD5 hash </p>
|
||||
<div>
|
||||
<button class="" id="" onclick="tryAgain()">Try Again</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>';
|
||||
echo ' <script>
|
||||
function tryAgain() {
|
||||
window.location.href="/tools/md5-decryption";
|
||||
}
|
||||
</script>' ;
|
||||
// echo json_encode(array('success' => false, 'message' => 'No data found for the given MD5 hash'));
|
||||
}
|
||||
} catch (PDOException $e) {
|
||||
echo json_encode(array('success' => false, 'message' => 'Database error: ' . $e->getMessage()));
|
||||
exit();
|
||||
}
|
||||
}else{
|
||||
echo ' <form method="post" action="" class="diZFlexColumn">
|
||||
<label for="md5-hash" class="custom-label">Enter MD5 Hash:</label><br>
|
||||
<textarea id="md5-hash" name="md5-hash" class="diZTextAreaResizeNone" rows="8"></textarea><br>
|
||||
<button class="diZmxAuto" type="submit"><span>Convert MD5</span></button>
|
||||
</form>';
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter MD5 Hash:</strong> Input the MD5 hash you want to decrypt into the provided text area.</li>
|
||||
<li><strong>Decrypt MD5:</strong> Click the "Convert MD5" button to initiate the search for the corresponding value in the database.</li>
|
||||
<li><strong>View and Copy Result:</strong> If a matching value is found, it will be displayed in the output area. Click the "Copy" button to copy the result to your clipboard.</li>
|
||||
<li><strong>Try Again:</strong> If no matching value is found, click the "Try Again" button to search for another MD5 hash.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Simple and user-friendly interface for easy MD5 hash decryption.</li>
|
||||
<li>Instantly displays the original text if found in the database.</li>
|
||||
<li>Copy functionality to quickly copy the decrypted text to your clipboard.</li>
|
||||
<li>Notification message to indicate successful copying of the decrypted text.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Developers verifying the integrity of files by comparing original text and its MD5 hash.</li>
|
||||
<li>Security professionals analyzing hashed data to check for common vulnerabilities.</li>
|
||||
<li>Researchers decrypting MD5 hashes for data analysis purposes.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -1,54 +1,3 @@
|
|||
<style>
|
||||
.button-style-md5{
|
||||
padding: 20px 20px;
|
||||
background-color: #7d7d7d;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
}
|
||||
.button-style-md5:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
.custom-container {
|
||||
max-width: 500px;
|
||||
margin: 50px auto;
|
||||
background-color: #3d3d3d;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0px 0px 10px 0px rgba(255,255,255,0.1);
|
||||
}
|
||||
.custom-heading {
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
/* color: #333; */
|
||||
}
|
||||
.custom-label {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.custom-input {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.custom-submit {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
.custom-submit:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
</style>
|
||||
<?php
|
||||
// require_once ('.hta_config/siliconpin_sp.php');
|
||||
if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
|
|
@ -61,16 +10,22 @@
|
|||
$stmt->bindParam(':md5', $md5_hash);
|
||||
$stmt->bindParam(':value', $_POST["md5-text"]);
|
||||
$stmt->execute();
|
||||
echo '<div style="display: flex; justify-content: center;">
|
||||
<div style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<p style="text-align: center; font-size: 25px; ">Converted MD5: </p>
|
||||
<p style="display: none; text-align: center;" id="copied-notice"></p>
|
||||
<div style="display: flex; flex-direction: row;">
|
||||
<input id="output" type="text" readonly value="'.$md5_hash.'" style="color: #fff; padding: 10px 10px 10px 10px; font-size: 25px; outline: none;" />
|
||||
<button class="button-style-md5" id="copyButton" onclick="copyOutputText()">Copy</button>
|
||||
echo ' <div class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Generate MD5 Hash</h2>
|
||||
<p>The MD5 Hash Generator tool allows you to quickly and easily generate an MD5 hash from any text input. This is useful for creating checksums, storing passwords securely, or any other application where a unique hash representation of your data is needed.</p>
|
||||
<div class="diZMaxW600 diZmxAuto diZmy20 toolsSection">
|
||||
<div class="diZFlexColumn diZJustifyCenter ">
|
||||
<div>
|
||||
<p>Converted MD5: </p>
|
||||
<p id="copied-notice"></p>
|
||||
<div class="diZFlexColumn">
|
||||
<input id="output" type="text" readonly value="'.$md5_hash.'" /><br>
|
||||
<button class="diZmxAuto" id="copyButton" onclick="copyOutputText()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>';
|
||||
</div>';
|
||||
echo '
|
||||
<script>
|
||||
function copyOutputText() {
|
||||
|
|
@ -84,25 +39,53 @@
|
|||
document.getElementById(\'copied-notice\').style.display = \'block\';
|
||||
document.getElementById(\'copied-notice\').innerHTML = \'MD5 copied to clipboard!\';
|
||||
}
|
||||
</script>
|
||||
';
|
||||
</script>';
|
||||
// echo json_encode(array('success' => true, 'message' => 'Data inserted successfully'));
|
||||
// echo '<script>window.location.href="/admin/add-content";</script>';
|
||||
exit();
|
||||
} catch (PDOException $e) {
|
||||
echo json_encode(array('success' => false, 'message' => 'Database error: ' . $e->getMessage()));
|
||||
exit();
|
||||
}
|
||||
}else{
|
||||
echo '<section class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Generate MD5 Hash</h2>
|
||||
<div class="diZMaxW600 diZmxAuto diZmy20 toolsSection">
|
||||
<form method="post" class="diZFlexColumn diZJustifyCenter "><br>
|
||||
<label for="md5-text" class="">Enter Text Convert to MD5:</label><br>
|
||||
<textarea name="md5-text" id="md5-text" rows="10"></textarea><br>
|
||||
<button class="diZmxAuto" type="submit"><span>Generate MD5 Hash</span></button>
|
||||
</form>
|
||||
</div>
|
||||
</section>';
|
||||
}
|
||||
?>
|
||||
<div class="custom-container">
|
||||
<h2 class="custom-heading">Generate MD5 Hash</h2>
|
||||
<form method="post">
|
||||
<label for="md5-text" class="custom-label">Enter Text:</label><br>
|
||||
<input type="text" id="md5-text" name="md5-text" class="custom-input"><br><br>
|
||||
<input type="submit" value="Generate MD5 Hash" class="custom-submit" style="background-color: #7d7d7d;">
|
||||
</form>
|
||||
<div class="diZContainer diZmxAuto">
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Text:</strong> Input your desired text into the text area provided.</li>
|
||||
<li><strong>Generate MD5 Hash:</strong> Click the "Generate MD5 Hash" button to convert the text into an MD5 hash.</li>
|
||||
<li><strong>Copy Hash:</strong> Once generated, the hash will appear in the output text area. Click the "Copy" button to copy it to your clipboard.</li>
|
||||
<li><strong>Paste and Use:</strong> Paste the copied hash directly into your application, database, or any other place where you need an MD5 hash.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Generates a unique MD5 hash from any input text.</li>
|
||||
<li>Displays the generated hash in a read-only text area for easy copying.</li>
|
||||
<li>Provides a "Copy" button to quickly copy the generated hash to the clipboard.</li>
|
||||
<li>Includes error handling to manage database insertion issues gracefully.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Web developers creating checksums for file verification.</li>
|
||||
<li>Security professionals storing passwords securely in a database.</li>
|
||||
<li>Software engineers ensuring data integrity by generating unique hashes for sensitive data.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- <script>
|
||||
function copyOutputText() {
|
||||
const outputText = document.getElementById('output').value;
|
||||
|
|
|
|||
|
|
@ -2,11 +2,11 @@
|
|||
<h2 class="diZBorderBottom">Remove Multiple Whitespace</h2>
|
||||
<div class="diZMaxW600 diZFlexColumn diZmxAuto diZmy20 toolsSection">
|
||||
<textarea class="textarea-text" id="textInput" rows="10" placeholder="Enter text here..."></textarea>
|
||||
<button class="diZmt2" onclick="processText()">Remove</button>
|
||||
<button class="diZmt2 diZmxAuto" onclick="processText()"><span>Remove</span></button>
|
||||
<div class="diZFlexColumn diZDisplayNone diZmt2" id="after-procces">
|
||||
<textarea class="textarea-text" id="output" rows="10" readonly></textarea>
|
||||
<p class="diZDisplayNone diZTextCenter" id="copied-notice"></p>
|
||||
<button class="diZmt2" id="copyButton" onclick="copyOutputText()">Copy</button>
|
||||
<button class="diZmt2 diZmxAuto" id="copyButton" onclick="copyOutputText()"><span>Copy</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,36 @@
|
|||
<section class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Domain MX Information Viewer</h2>
|
||||
<p class="diZTextJustify diZmb4">The Domain MX Information Viewer is a powerful and easy-to-use tool designed to help IT professionals and website administrators retrieve detailed mail exchange (MX) records for any given domain. Simply enter a domain name, and this tool will perform a DNS lookup to fetch and display the MX records, providing insights into the domain's email routing information.</p>
|
||||
<form method="post" class="diZToolsSection diZmt4 diZmb4 diZBorderRadius diZPadding5px ">
|
||||
<div class="diZFlexRowCol diZJustifyCenter diZItemsCenter">
|
||||
<input class="diZmr2 diZw70" placeholder="Domain Name" id="Domain" name="domain" type="text" required />
|
||||
<button class="diZmr2" type="submit"><span>Check</span></button>
|
||||
</div>
|
||||
</form>
|
||||
<?php
|
||||
if (isset($_POST['domain']) && $_POST['domain']) {
|
||||
function validateDomain($domain) {
|
||||
return filter_var($domain, FILTER_VALIDATE_DOMAIN, FILTER_FLAG_HOSTNAME);
|
||||
}
|
||||
|
||||
$domain = $_POST['domain'];
|
||||
if (validateDomain($domain)) {
|
||||
$command = escapeshellcmd('dig ' . $domain . ' MX');
|
||||
$output = shell_exec($command);
|
||||
echo '<div class="diZContainer diZmxAuto diZPadding5px"><pre>' . htmlspecialchars($output, ENT_QUOTES, 'UTF-8') . '</pre></div>';
|
||||
} else {
|
||||
echo '<div class="diZContainer diZmxAuto diZPadding5px">Invalid domain.</div>';
|
||||
}
|
||||
}
|
||||
?>
|
||||
<div class="diZmy20">
|
||||
<h3>Key Features:</h3>
|
||||
<ul>
|
||||
<li><strong>Accurate Domain Validation:</strong> Ensures the entered domain name is valid and properly formatted.</li>
|
||||
<li><strong>Secure Processing:</strong> Utilizes command sanitization and output encoding to prevent security vulnerabilities like command injection and cross-site scripting (XSS).</li>
|
||||
<li><strong>Instant Results:</strong> Quickly retrieves and displays MX records for the specified domain.</li>
|
||||
<li><strong>User-Friendly Interface:</strong> Simplified input form for easy use without the need for additional styling.</li>
|
||||
</ul>
|
||||
<p>This tool is ideal for those seeking quick and reliable MX record information to manage and troubleshoot email delivery issues effectively.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1,34 +1,32 @@
|
|||
<section class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Domain DNS Information Viewer</h2>
|
||||
</section>
|
||||
<!-- <p class="diZTextJustify">NS Lookup simplifies checking DNS records. Enter any domain to instantly retrieve and explore its DNS details, including A, AAAA, MX, CNAME records, and more. Ideal for IT professionals and website administrators seeking quick and accurate DNS insights.</p> -->
|
||||
|
||||
<section class="diZContainer diZmxAuto">
|
||||
<h2 class="diZBorderBottom">Domain DNS Information Viewer</h2>
|
||||
</section>
|
||||
<!-- <p class="diZTextJustify">NS Lookup simplifies checking DNS records. Enter any domain to instantly retrieve and explore its DNS details, including A, AAAA, MX, CNAME records, and more. Ideal for IT professionals and website administrators seeking quick and accurate DNS insights.</p> -->
|
||||
<form method="post" class="diZToolsSection diZmt4 diZmb4 diZBorderRadius diZPadding5px">
|
||||
<div class="diZFlexRowCol diZJustifyCenter diZItemsCenter">
|
||||
<input class="diZmr2 diZw70" placeholder="Domain" name="domain" type="text" />
|
||||
<input class="diZmr2" type="submit" value="Check" />
|
||||
<input class="diZmr2 diZw70" placeholder="Domain Name" name="domain" type="text" />
|
||||
<button class="diZmr2" type="submit" value="Check"><span>Check</span></button>
|
||||
</div>
|
||||
</form>
|
||||
<?php
|
||||
if(isset($_POST['domain']) && $_POST['domain']){
|
||||
function validateDomain($domain) {
|
||||
$regex = "/^(?!\-)(?:[a-zA-Z0-9\-]{0,61}[a-zA-Z0-9]\.)+[a-zA-Z]{2,}$/";
|
||||
if (preg_match($regex, $domain)) {
|
||||
return true;
|
||||
if(isset($_POST['domain']) && $_POST['domain']){
|
||||
function validateDomain($domain) {
|
||||
$regex = "/^(?!\-)(?:[a-zA-Z0-9\-]{0,61}[a-zA-Z0-9]\.)+[a-zA-Z]{2,}$/";
|
||||
if (preg_match($regex, $domain)) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
$domain = isset($_POST['domain']) ? $_POST['domain'] : '';
|
||||
if ($domain && validateDomain($domain)) {
|
||||
$command = 'dig '.$_POST['domain']. ' NS';
|
||||
$escaped_command = escapeshellcmd($command);
|
||||
$output = shell_exec($escaped_command);
|
||||
echo '<div class="diZContainer diZmxAuto diZPadding5px"><pre class="diZTextJustify" style="width: fit-content;"> ',$output, '</pre> <br><br></div>';
|
||||
} else {
|
||||
return false;
|
||||
echo "Invalid domain.";
|
||||
}
|
||||
}
|
||||
|
||||
$domain = isset($_POST['domain']) ? $_POST['domain'] : '';
|
||||
if ($domain && validateDomain($domain)) {
|
||||
$command = 'dig '.$_POST['domain']. ' NS';
|
||||
$escaped_command = escapeshellcmd($command);
|
||||
$output = shell_exec($escaped_command);
|
||||
echo '<div class="diZContainer diZmxAuto diZPadding5px"><pre class="diZTextJustify" style="width: fit-content;"> ',$output, '</pre> <br><br></div>';
|
||||
} else {
|
||||
echo "Invalid domain.";
|
||||
}
|
||||
}
|
||||
?>
|
||||
?>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,157 +1,200 @@
|
|||
<div class="meta-container">
|
||||
<h1 class="og-title">Open Graph Meta Generator</h1>
|
||||
<form class="form" id="metaForm">
|
||||
<label for="ogTitle" class="form-label">Title:</label>
|
||||
<input type="text" id="ogTitle" name="ogTitle" class="form-input" required>
|
||||
|
||||
<label for="ogDescription" class="form-label">Description:</label>
|
||||
<textarea id="ogDescription" name="ogDescription" class="form-input form-textarea" rows="4" required></textarea>
|
||||
|
||||
<label for="ogImage" class="form-label">Image URL:</label>
|
||||
<input type="url" id="ogImage" name="ogImage" class="form-input" required>
|
||||
|
||||
<label for="ogUrl" class="form-label">URL:</label>
|
||||
<input type="url" id="ogUrl" name="ogUrl" class="form-input" required>
|
||||
|
||||
<label for="author" class="form-label">Author:</label>
|
||||
<input type="text" id="author" name="author" class="form-input" required>
|
||||
|
||||
<label for="keywords" class="form-label">Keywords:</label>
|
||||
<input type="text" id="keywords" name="keywords" class="form-input" required>
|
||||
|
||||
<label for="twitterTitle" class="form-label">Twitter Title:</label>
|
||||
<input type="text" id="twitterTitle" name="twitterTitle" class="form-input" required>
|
||||
|
||||
<label for="twitterDescription" class="form-label">Twitter Description:</label>
|
||||
<textarea id="twitterDescription" name="twitterDescription" class="form-input form-textarea" rows="4" required></textarea>
|
||||
|
||||
<label for="twitterImage" class="form-label">Twitter Image URL:</label>
|
||||
<input type="url" id="twitterImage" name="twitterImage" class="form-input" required>
|
||||
|
||||
<label for="twitterCard" class="form-label">Twitter Card Type:</label>
|
||||
<select id="twitterCard" name="twitterCard" class="form-input" required>
|
||||
<option value="summary">Summary</option>
|
||||
<option value="summary_large_image">Summary Large Image</option>
|
||||
</select>
|
||||
|
||||
<button type="submit" class="button-style" style="width: 100%; background-color: #7d7d7d;">Generate</button>
|
||||
</form>
|
||||
|
||||
<div style="display: none;" class="generated-meta-tags" id="generatedMetaTags"></div>
|
||||
<P style="display: none; text-align: center;" id="copied-notice"></P>
|
||||
<button id="copyButton" class="button-style" onclick="copyToClipboard()">Copy</button>
|
||||
</div>
|
||||
<div class="table-container">
|
||||
<h2 style="text-align: center; font-size: 25px; font-weight: bold;">Content Limitations</h2>
|
||||
<table class="content-table">
|
||||
<section class="diZContainer diZmxAuto diZmy4">
|
||||
<h1 class="diZBorderBottom">Open Graph Meta Generator</h1>
|
||||
<p class="diZTextJustify">The Open Graph Meta Generator is a tool designed to help web developers and content creators easily generate meta tags for optimizing content sharing on social media platforms like Facebook and Twitter. By filling out a simple form, users can create the necessary Open Graph and Twitter meta tags to enhance the visibility and appearance of their web pages when shared online.</p>
|
||||
<div class="diZFlexColumn diZMaxW600 diZmxAuto diZmy20 toolsSection">
|
||||
<form class="diZFlexColumn" id="metaForm">
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="ogTitle" class="form-label">Title:</label>
|
||||
<input type="text" id="ogTitle" name="ogTitle" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="ogDescription" class="form-label">Description:</label>
|
||||
<textarea id="ogDescription" name="ogDescription" class="diZTextAreaResizeNone" rows="4" required></textarea>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="ogImage" class="form-label">Image URL:</label>
|
||||
<input type="text" id="ogImage" name="ogImage" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="ogUrl" class="form-label">URL:</label>
|
||||
<input type="text" id="ogUrl" name="ogUrl" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="author" class="form-label">Author:</label>
|
||||
<input type="text" id="author" name="author" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="keywords" class="form-label">Keywords:</label>
|
||||
<input type="text" id="keywords" name="keywords" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="twitterTitle" class="form-label">Twitter Title:</label>
|
||||
<input type="text" id="twitterTitle" name="twitterTitle" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="twitterDescription" class="form-label">Twitter Description:</label>
|
||||
<textarea id="twitterDescription" name="twitterDescription" class="diZTextAreaResizeNone" rows="4" required></textarea>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="twitterImage" class="form-label">Twitter Image URL:</label>
|
||||
<input type="text" id="twitterImage" name="twitterImage" class="" required>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<label for="twitterCard" class="form-label">Twitter Card Type:</label>
|
||||
<select id="twitterCard" name="twitterCard" class="" required>
|
||||
<option value="summary">Summary</option>
|
||||
<option value="summary_large_image">Summary Large Image</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="diZFlexColumn diZmt2">
|
||||
<div class="diZDisplayNone generated-meta-tags" id="generatedMetaTags"></div>
|
||||
<p class="diZDisplayNone" id="copied-notice"></p>
|
||||
</div>
|
||||
<div class="diZFlexBetween diZmt2">
|
||||
<button type="submit" class="button-style"><span>Generate</span></button>
|
||||
<button id="copyButton" class="button-style" onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<h2 class="diZBorderBottom">Content Limitations</h2>
|
||||
<p>Understanding the character and word limits for various platforms and meta tags is crucial for optimizing your content. The following table provides a comprehensive guide to these limitations, ensuring that your content adheres to the best practices for SEO and social media sharing.</p>
|
||||
<table class="diZw70 diZmxAuto">
|
||||
<tr>
|
||||
<th class="name">Name</th>
|
||||
<th class="min-max">Min/Max</th>
|
||||
<th class="limit">Limit</th>
|
||||
<th class="type">Type</th>
|
||||
<th class="diZTableBorder diZPadding5px">Name</th>
|
||||
<th class="diZTableBorder diZPadding5px">Min/Max</th>
|
||||
<th class="diZTableBorder diZPadding5px">Limit</th>
|
||||
<th class="diZTableBorder diZPadding5px">Type</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Meta Title</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">55</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Meta Title</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">55</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Meta Description</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">160</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Meta Description</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">160</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Google Ideal Post Content</td>
|
||||
<td class="min-max">Min</td>
|
||||
<td class="limit">300</td>
|
||||
<td class="type">Word</td>
|
||||
<td class="diZTableBorder diZPadding5px">Google Ideal Post Content</td>
|
||||
<td class="diZTableBorder diZPadding5px">Min</td>
|
||||
<td class="diZTableBorder diZPadding5px">300</td>
|
||||
<td class="diZTableBorder diZPadding5px">Word</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Instagram Captions/Comments</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">2200</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Instagram Captions/Comments</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">2200</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Twitter Post</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">280</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Twitter Post</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">280</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Twitter Username</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">20</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Twitter Username</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">20</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Facebook Wall Post (Truncation)</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">477</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Facebook Wall Post (Truncation)</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">477</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Facebook Wall Post (All)</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">63206</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Facebook Wall Post (All)</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">63206</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Facebook Comment</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">8000</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Facebook Comment</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">8000</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Facebook Page Description</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">255</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Facebook Page Description</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">255</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Facebook Username</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">50</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Facebook Username</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">50</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Facebook Messenger Message</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">20000</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Facebook Messenger Message</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">20000</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">YouTube Video Title</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">70</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">YouTube Video Title</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">70</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">YouTube Video Description</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">5000</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">YouTube Video Description</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">5000</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Snapchat Caption</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">250</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Snapchat Caption</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">250</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="name">Pinterest Pin Description</td>
|
||||
<td class="min-max">Max</td>
|
||||
<td class="limit">500</td>
|
||||
<td class="type">Letter</td>
|
||||
<td class="diZTableBorder diZPadding5px">Pinterest Pin Description</td>
|
||||
<td class="diZTableBorder diZPadding5px">Max</td>
|
||||
<td class="diZTableBorder diZPadding5px">500</td>
|
||||
<td class="diZTableBorder diZPadding5px">Letter</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Information:</strong> Input the required information, including Title, Description, Image URL, URL, Author, Keywords, Twitter Title, Twitter Description, Twitter Image URL, and Twitter Card Type, into the respective fields in the form.</li>
|
||||
<li><strong>Generate Meta Tags:</strong> Click the "Generate" button to create the Open Graph and Twitter meta tags based on the provided information.</li>
|
||||
<li><strong>Copy Meta Tags:</strong> The generated meta tags will appear in the output area. Click the "Copy" button to copy the meta tags to your clipboard.</li>
|
||||
<li><strong>Paste and Use:</strong> Paste the copied meta tags into the head section of your HTML document to enhance your webpage's social media integration and SEO.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Generates Open Graph meta tags for improved social media sharing.</li>
|
||||
<li>Generates Twitter meta tags for optimized content sharing on Twitter.</li>
|
||||
<li>Provides a clear and user-friendly form to input all necessary information.</li>
|
||||
<li>Includes a "Copy to Clipboard" function for easy integration into your HTML code.</li>
|
||||
<li>Displays a "Meta tags copied to clipboard!" notification upon copying.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Web developers optimizing websites for social media sharing.</li>
|
||||
<li>Content creators ensuring their articles and posts are displayed attractively on social media platforms.</li>
|
||||
<li>SEO specialists enhancing webpage metadata for better search engine rankings.</li>
|
||||
<li>Bloggers and marketers improving the visibility and engagement of their content on social media.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<script>
|
||||
const form = document.getElementById('metaForm');
|
||||
const generatedMetaTags = document.getElementById('generatedMetaTags');
|
||||
const copiedNotice = document.getElementById('copied-notice');
|
||||
|
||||
form.addEventListener('submit', function(event) {
|
||||
event.preventDefault();
|
||||
|
|
@ -181,12 +224,14 @@
|
|||
<meta name="twitter:image" content="${twitterImage}">
|
||||
<meta name="twitter:card" content="${twitterCard}">
|
||||
`;
|
||||
if(metaTags.length>20){
|
||||
document.getElementById('generatedMetaTags').style.display= "block";
|
||||
}
|
||||
generatedMetaTags.innerText = `${metaTags}`;
|
||||
|
||||
if(metaTags.length > 20) {
|
||||
generatedMetaTags.style.display = "block";
|
||||
}
|
||||
|
||||
generatedMetaTags.innerText = `${metaTags}`;
|
||||
});
|
||||
|
||||
function copyToClipboard() {
|
||||
const metaTags = document.getElementById('generatedMetaTags');
|
||||
const textarea = document.createElement('textarea');
|
||||
|
|
@ -195,99 +240,11 @@
|
|||
textarea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textarea);
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
document.getElementById('copied-notice').innerHTML = 'Meta tags copied to clipboard!';
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.meta-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
max-width: 700px;
|
||||
margin: 20px auto; /* Added to center horizontally */
|
||||
padding: 20px;
|
||||
background-color: #3d3d3d;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
copiedNotice.style.display = 'block';
|
||||
copiedNotice.innerHTML = 'Meta tags copied to clipboard!';
|
||||
|
||||
/* Header Styles */
|
||||
.og-title {
|
||||
margin-top: 0;
|
||||
font-size: 24px;
|
||||
text-align: center;
|
||||
setTimeout(() => {
|
||||
copiedNotice.style.display = 'none';
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
/* Form Styles */
|
||||
.form {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
padding: 6px;
|
||||
margin-bottom: 12px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
font-size: 16px;
|
||||
background-color: #3d3d3d;
|
||||
}
|
||||
|
||||
.form-textarea {
|
||||
resize: vertical;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.button-style{
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.button-style:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
|
||||
/* Generated Meta Tags Styles */
|
||||
.generated-meta-tags {
|
||||
margin-top: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.generated-meta-tags {
|
||||
margin-top: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
background-color: #3d3d3d;
|
||||
width: 100%; /* Ensure the width spans the container */
|
||||
box-sizing: border-box; /* Include padding and border in the width */
|
||||
overflow: auto; /* Enable scrolling if content overflows */
|
||||
}
|
||||
.table-container {
|
||||
max-width: 900px;
|
||||
margin: 50px auto;
|
||||
padding: 20px;
|
||||
background-color: #3d3d3d;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.content-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.content-table th, .content-table td {
|
||||
border: 1px solid #dddddd;
|
||||
text-align: left;
|
||||
padding: 8px;
|
||||
}
|
||||
.content-table .table-head {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
|
|
@ -23,7 +23,7 @@
|
|||
|
||||
<form method="post" enctype="multipart/form-data">
|
||||
<input type="file" name="pdfFile" accept=".pdf">
|
||||
<button type="submit" name="submit">Upload PDF</button>
|
||||
<button type="submit" name="submit"><span>Upload PDF</span></button>
|
||||
</form>
|
||||
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
<h1>Image to ICO Converter</h1>
|
||||
<input type="file" id="fileInput" accept="image/*">
|
||||
<br>
|
||||
<button id="convertButton">Convert to ICO</button>
|
||||
<button id="convertButton"><span>Convert to ICO</span></button>
|
||||
<br><br>
|
||||
<a id="downloadLink" style="display: none;" download="icon.ico">Download ICO</a>
|
||||
|
||||
|
|
|
|||
77
qr-code.php
77
qr-code.php
File diff suppressed because one or more lines are too long
|
|
@ -1,30 +1,74 @@
|
|||
<?php
|
||||
$time=time();
|
||||
$gen_pass=rand(100,360).$time.rand(100,999);
|
||||
$rand_pass = base_convert($gen_pass,10,36);
|
||||
$time = time();
|
||||
$gen_pass = rand(100, 360) . $time . rand(100, 999);
|
||||
$rand_pass = base_convert($gen_pass, 10, 36);
|
||||
?>
|
||||
<div style="display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 20px;">
|
||||
<h1 style="font-size: 25px;">Get a random password</h1>
|
||||
<div style="display: flex; flex-direction: row; margin-top: 20px;">
|
||||
<p style="border: 2px solid #ddd; border-radius: 6px; padding: 5px;">Password: <span id="randPassword"> <?php echo $rand_pass; ?></span></p> <button id="copyButton" style="background-color: #7d7d7d; border-radius: 6px; padding: 0px 10px 0px 10px;">Copy</button>
|
||||
</div>
|
||||
<P style="display: none; text-align: center;" id="copied-notice"></P>
|
||||
</div>
|
||||
<!-- <div id="copyText">This text will be copied when clicked.</div> -->
|
||||
|
||||
<script>
|
||||
document.getElementById("copyButton").addEventListener("click", function() {
|
||||
// Select the text
|
||||
var copyText = document.getElementById("randPassword");
|
||||
var selection = window.getSelection();
|
||||
var range = document.createRange();
|
||||
range.selectNodeContents(copyText);
|
||||
selection.removeAllRanges();
|
||||
selection.addRange(range);
|
||||
|
||||
// Copy to clipboard
|
||||
document.execCommand("copy");
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
document.getElementById('copied-notice').innerHTML = 'Text copied to clipboard!';
|
||||
});
|
||||
</script>
|
||||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h1 class="diZBorderBottom">Get a random password</h1>
|
||||
<p class="diZTextJustify">This tool generates a random password consisting of alphanumeric characters, ideal for creating secure credentials quickly. It combines a random numeric value with the current timestamp, converting the result into a base-36 string format for enhanced security and uniqueness.</p>
|
||||
<div class="diZMaxW600 diZmxAuto diZmy20 diZFlexColumn toolsSection">
|
||||
<p class="diZDisplayNone" id="copied-notice"></p>
|
||||
<div class="diZFlexRow diZItemsCenter diZJustifyCenter">
|
||||
<h2>Password: <span id="randPassword"><?php echo $rand_pass; ?></span></h2>
|
||||
<span class="diZCursorPointer" onclick="copyToClipboard()"><img src="/assets/svg/copy.svg" alt="Copy to Clipboard"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Generate Random Password:</strong> Click the "Get a random password" button to generate a new, unique password.</li>
|
||||
<li><strong>Copy Password to Clipboard:</strong> Once generated, the password will display below the button.</li>
|
||||
<li><strong>Click the Copy Icon:</strong> Click the copy icon next to the password to copy it to your clipboard.</li>
|
||||
<li><strong>Paste and Use:</strong> Paste the copied password into any application, login form, or document where a secure password is required.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li><strong>Randomized Generation:</strong> Each password is dynamically generated using random numbers and timestamps.</li>
|
||||
<li><strong>Secure Base-36 Conversion:</strong> Converts the generated value into a base-36 string format for enhanced security.</li>
|
||||
<li><strong>Clipboard Integration:</strong> Allows easy copying of the generated password with a single click.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li><strong>User Accounts:</strong> Quickly generate secure passwords for new user registrations or account setups.</li>
|
||||
<li><strong>Password Resets:</strong> Provide users with randomly generated passwords for password recovery processes.</li>
|
||||
<li><strong>Secure Access:</strong> Ideal for securing sensitive information and access credentials across various platforms.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<script>
|
||||
function copyToClipboard() {
|
||||
var copyText = document.getElementById('randPassword').innerText; // Get the text content
|
||||
var textArea = document.createElement('textarea');
|
||||
|
||||
// Place the text in the textarea
|
||||
textArea.value = copyText;
|
||||
|
||||
// Make the textarea hidden
|
||||
textArea.style.position = 'fixed';
|
||||
textArea.style.opacity = 0;
|
||||
|
||||
// Append the textarea to the body
|
||||
document.body.appendChild(textArea);
|
||||
|
||||
// Select and copy the text
|
||||
textArea.select();
|
||||
document.execCommand('copy');
|
||||
|
||||
// Remove the textarea from the DOM
|
||||
document.body.removeChild(textArea);
|
||||
|
||||
// Show copied notice
|
||||
var notice = document.getElementById('copied-notice');
|
||||
notice.style.display = 'block';
|
||||
notice.textContent = 'Text copied to clipboard!';
|
||||
|
||||
// Hide notice after 1 second
|
||||
setTimeout(function() {
|
||||
notice.style.display = 'none';
|
||||
}, 1000);
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -14,8 +14,10 @@
|
|||
<input style="width: 97%;" type="number" id="blue" min="0" max="255" required>
|
||||
</div>
|
||||
<div id="result"></div>
|
||||
<button class="" onclick="convert()">Convert</button>
|
||||
<button id="copyButton" onclick="copyToClipboard()">Copy</button>
|
||||
<div class="diZFlexBetween">
|
||||
<button class="" onclick="convert()"><span>Convert</span></button>
|
||||
<button id="copyButton" onclick="copyToClipboard()"><span>Copy</span></button>
|
||||
</div>
|
||||
<span class="diZDisplayNone" id="copied-notice"></span>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
<div class="diZMaxW600 diZmxAuto diZFlexColumn diZmb20">
|
||||
<h1 class="diZTextCenter diZBorderBottom">Screen Recorder</h1>
|
||||
<div class="diZFlexRow ">
|
||||
<button class="diZSpaceR" id="start">Start Recording</button>
|
||||
<button class="diZSpaceR" id="stop" disabled>Stop Recording</button>
|
||||
<button class="diZSpaceR" id="download" disabled>Download Recording</button>
|
||||
<button class="diZSpaceR" id="start"><span>Start Recording</span></button>
|
||||
<button class="diZSpaceR" id="stop" disabled><span>Stop Recording</span></button>
|
||||
<button class="diZSpaceR" id="download" disabled><span>Download Recording</span></button>
|
||||
</div>
|
||||
<div class="diZTextCenter diZmb4 diZmt4" id="timer">Duration: 00:00:00</div>
|
||||
<video class="diZw100" id="video" muted controls autoplay></video>
|
||||
|
|
|
|||
|
|
@ -1,68 +1,71 @@
|
|||
<div class="container-dxe">
|
||||
<h1 style="text-align: center; font-size: 25px; padding-bottom: 6px;">Slug Generator</h1>
|
||||
<input class="slug-input" type="text" id="inputText" placeholder="Enter text">
|
||||
<button class="button-style" onclick="generateSlug()">Generate Slug</button>
|
||||
<div id="slugOutput" style="border: 2px solid #ddd; display: none; padding: 6px; border-radius: 6px; margin-top: 10px;"></div>
|
||||
<P style="display: none; text-align: center;" id="copied-notice"></P>
|
||||
<button class="button-style" style="margin-top: 10px; width: 100%; display: none;" id="copyBtn" onclick="copyToClipboard()">Copy Slug</button>
|
||||
</div>
|
||||
<section class="diZContainer diZmxAuto diZmy8">
|
||||
<h1 class="diZBorderBottom">Slug Generator</h1>
|
||||
<p class="diZTextJustify">The Slug Generator tool allows you to easily create SEO-friendly slugs from your input text. A slug is a URL-friendly version of a string, typically used in web addresses to identify a specific page or resource. This tool converts any text you input into a lowercase string, removes special characters, and replaces spaces with hyphens to generate a clean and readable URL slug.</p>
|
||||
<div class="diZMaxW600 diZmxAuto diZmy20 diZFlexColumn toolsSection">
|
||||
<textarea class="diZTextAreaResizeNone" placeholder="Enter text" id="inputText" rows="6"></textarea> <br>
|
||||
<button class="diZmxAuto" onclick="generateSlug()"><span>Generate Slug</span></button>
|
||||
<p id="copied-notice" class="diZDisplayNone"></p>
|
||||
<textarea id="slugOutput" class="diZTextAreaResizeNone diZDisplayNone diZmy4" rows="6"></textarea>
|
||||
<button id="copyBtn" class="diZDisplayNone diZmxAuto" onclick="copyToClipboard()"><span>Copy Slug</span></button>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Text:</strong> Input your desired text into the text area provided.</li>
|
||||
<li><strong>Generate Slug:</strong> Click the "Generate Slug" button to convert the text into a URL-friendly slug.</li>
|
||||
<li><strong>Copy Slug:</strong> Once generated, the slug will appear in the output text area. Click the "Copy Slug" button to copy it to your clipboard.</li>
|
||||
<li><strong>Paste and Use:</strong> Paste the copied slug directly into your web application, blog post, or any other content management system (CMS) where you need a URL slug.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Converts text to lowercase.</li>
|
||||
<li>Removes special characters and replaces spaces with hyphens.</li>
|
||||
<li>Provides instant feedback with a "Slug copied to clipboard!" notification upon copying.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Bloggers creating SEO-friendly URLs for their articles.</li>
|
||||
<li>Developers generating slugs for dynamic content pages.</li>
|
||||
<li>Content managers ensuring consistency and readability in URL structures.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
function generateSlug() {
|
||||
const inputText = document.getElementById('inputText').value;
|
||||
const slugOutput = document.getElementById('slugOutput');
|
||||
|
||||
// Generate slug
|
||||
const slug = inputText.trim().toLowerCase().replace(/[^\w\s-]/g, '').replace(/\s+/g, '-');
|
||||
// console.log(slug.length)
|
||||
// Update output
|
||||
if(slug.length > 0){
|
||||
document.getElementById('copyBtn').style.display = 'block';
|
||||
document.getElementById('slugOutput').style.display = 'block';
|
||||
}
|
||||
slugOutput.textContent = slug;
|
||||
|
||||
// Update output textarea and display copy button
|
||||
if (slug.length > 0) {
|
||||
document.getElementById('copyBtn').style.display = 'block';
|
||||
slugOutput.style.display = 'block';
|
||||
slugOutput.value = slug;
|
||||
} else {
|
||||
document.getElementById('copyBtn').style.display = 'none';
|
||||
slugOutput.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
function copyToClipboard() {
|
||||
const slugOutput = document.getElementById('slugOutput');
|
||||
const textArea = document.createElement('textarea');
|
||||
textArea.value = slugOutput.textContent;
|
||||
textArea.value = slugOutput.value;
|
||||
document.body.appendChild(textArea);
|
||||
textArea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textArea);
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
|
||||
// Show copied notice
|
||||
document.getElementById('copied-notice').innerHTML = 'Slug copied to clipboard!';
|
||||
document.getElementById('copied-notice').style.display = 'block';
|
||||
|
||||
// Hide notice after 1 second
|
||||
setTimeout(() => {
|
||||
document.getElementById('copied-notice').style.display = 'none';
|
||||
}, 1000);
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.container-dxe {
|
||||
max-width: 600px;
|
||||
margin: 50px auto;
|
||||
background-color: #3d3d3d;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.slug-input {
|
||||
width: calc(100%);
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.button-style{
|
||||
padding: 10px 20px;
|
||||
background-color: #7d7d7d;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.button-style:hover {
|
||||
background-color: #9d9d9d;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<h1>Internet Speed Test</h1>
|
||||
<button onclick="runSpeedTest()">Run Speed Test</button>
|
||||
<button onclick="runSpeedTest()"><span>Run Speed Test</span></button>
|
||||
<div id="result"></div>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ echo 'Weather Report';
|
|||
<option value="Kolkata">Kolkata</option>
|
||||
<option value="Delhi">Delhi</option>
|
||||
</select> -->
|
||||
<button type="submit" name="submit" onsubmit="getCity();">Click</button>
|
||||
<button type="submit" name="submit" onsubmit="getCity();"><span>Click</span></button>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,96 @@
|
|||
<?php
|
||||
$host_name = $_SERVER['HTTP_HOST'];
|
||||
<?php
|
||||
$errorMessage = "";
|
||||
$dns_records = [];
|
||||
|
||||
if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
$domain = filter_input(INPUT_POST, 'domain', FILTER_SANITIZE_STRING);
|
||||
|
||||
if (filter_var($domain, FILTER_VALIDATE_DOMAIN, FILTER_FLAG_HOSTNAME)) {
|
||||
$dns_records = dns_get_record($domain, DNS_ALL);
|
||||
|
||||
if ($dns_records === false) {
|
||||
$errorMessage = "Unable to retrieve DNS records for domain: $domain";
|
||||
}
|
||||
} else {
|
||||
$errorMessage = "Invalid domain format: $domain";
|
||||
}
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="container-zz mx-auto">
|
||||
<p>Hosting Name:</p>
|
||||
<p><?php echo $host_name; ?></p>
|
||||
</div>
|
||||
<style>
|
||||
.container-zz{width:100%}@media (min-width: 640px){.container-zz{max-width:640px}}@media (min-width: 768px){.container-zz{max-width:768px}}@media (min-width: 1024px){.container-zz{max-width:1024px}}@media (min-width: 1280px){.container-zz{max-width:1280px}}@media (min-width: 1536px){.container-zz{max-width:1536px}}
|
||||
.mx-auto{margin-left:auto;margin-right:auto}
|
||||
.my-20{margin-top:5rem;margin-bottom:5rem}
|
||||
</style>
|
||||
<section class="diZContainer diZmxAuto diZmy4">
|
||||
<h2 class="diZBorderBottom">DNS records for domain: <?php echo htmlspecialchars($domain); ?></h2>
|
||||
|
||||
<div class="diZmy20 toolsSection diZMaxW700 diZmxAuto">
|
||||
<form action="" method="post">
|
||||
<div class="diZFlexColumn">
|
||||
<label for="domain">Enter domain:</label>
|
||||
<p class="diZDangerText"><?php echo htmlspecialchars($errorMessage); ?></p>
|
||||
<input type="text" id="domain" name="domain" placeholder="Enter Domain Name" required>
|
||||
<button class="diZmxAuto diZmt4" type="submit"><span>Check DNS</span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<?php if (!empty($dns_records)) { ?>
|
||||
<div class="diZMaxW700 diZmxAuto diZOverflowXAuto">
|
||||
<table class="diZw100">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="diZTableBorder diZPadding5px">Type</th>
|
||||
<th class="diZTableBorder diZPadding5px">Host</th>
|
||||
<th class="diZTableBorder diZPadding5px">Class</th>
|
||||
<th class="diZTableBorder diZPadding5px">TTL</th>
|
||||
<th class="diZTableBorder diZPadding5px">Other</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($dns_records as $record) { ?>
|
||||
<tr>
|
||||
<td class="diZTableBorder diZPadding5px"><?php echo $record['type']; ?></td>
|
||||
<td class="diZTableBorder diZPadding5px"><?php echo $record['host']; ?></td>
|
||||
<td class="diZTableBorder diZPadding5px"><?php echo $record['class']; ?></td>
|
||||
<td class="diZTableBorder diZPadding5px"><?php echo $record['ttl']; ?></td>
|
||||
<td class="diZTableBorder diZPadding5px">
|
||||
<?php
|
||||
foreach ($record as $key => $value) {
|
||||
if (!in_array($key, ['type', 'host', 'class', 'ttl'])) {
|
||||
if (is_array($value)) {
|
||||
echo "$key: " . implode(', ', $value) . " <br>";
|
||||
} else {
|
||||
echo "$key: $value <br>";
|
||||
}
|
||||
}
|
||||
}
|
||||
?>
|
||||
</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<div>
|
||||
<h3>Usage:</h3>
|
||||
<ul>
|
||||
<li><strong>Enter Domain:</strong> Input the domain name you wish to check in the provided text field.</li>
|
||||
<li><strong>Check DNS:</strong> Click the "Check DNS" button to retrieve and display the DNS records for the entered domain.</li>
|
||||
<li><strong>View Results:</strong> The DNS records will be displayed in a tabular format, showing the type, host, class, TTL, and other relevant information for each record.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Features:</h3>
|
||||
<ul>
|
||||
<li>Supports all common DNS record types (A, AAAA, CNAME, MX, NS, TXT, etc.).</li>
|
||||
<li>Displays DNS records in a clear and organized table.</li>
|
||||
<li>Validates domain format before querying DNS records.</li>
|
||||
<li>Provides a user-friendly interface for easy DNS checking.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Example Use Cases:</h3>
|
||||
<ul>
|
||||
<li>Web administrators troubleshooting DNS issues for their domains.</li>
|
||||
<li>Developers needing to verify DNS settings for their applications.</li>
|
||||
<li>SEO specialists checking the DNS configuration of websites.</li>
|
||||
<li>Domain owners ensuring proper DNS setup and propagation.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Reference in New Issue