Muhammad Rifqi: 2024

Sunday, December 15, 2024

Menambahkan AutoTextfield Dengan Fungsi Klik

<!DOCTYPE html>

<html>

<head>

<title>Menambahkan TextField</title>

</head>

<body>

<button onclick="tambahTextField()">Tambah TextField</button>

var count = 0;

function tambahTextField() {

const container = document.getElementById('container');

const newTextField = document.createElement('div');

newTextField.innerHTML = `<input type="text" id="textField${count}" value="${count}"><button onclick="hapusTextField(${count})">Hapus</button>`;

container.appendChild(newTextField);

count++;

}

function hapusTextField(id) {

const textField = document.getElementById(`textField${id}`);

textField.parentNode.removeChild(textField);

}

</script>

</body>

</html>

Friday, September 27, 2024

Create Own square Function With PHP

<?php

$angka1 = 2;

$angka2 = 3;

$output = 1;

for($i=1; $i <= $angka2; $i++){

$output *= $angka1;

}

echo $output;

Sunday, July 28, 2024

Chiper Crypto Sample With PHP

<?php

function Cipher($ch, $key)

{

if (!ctype_alpha($ch))

return $ch;

$offset = ord(ctype_upper($ch) ? 'A' : 'a');

return chr(fmod(((ord($ch) + $key) - $offset), 26) + $offset);

}

function Encipher($input, $key)

{

$output = "";

$inputArr = str_split($input);

foreach ($inputArr as $ch)

$output .= Cipher($ch, $key);

return $output;

}

function Decipher($input, $key)

{

return Encipher($input, 26 - $key);

}

$text = "rifqi";

$cipherText = Encipher($text, 3);

$plainText = Decipher($cipherText, 3);

echo $cipherText."\n";

echo $plainText;

Wednesday, May 15, 2024

Flex Css Tuturial

<style>

.main{

display: flex;

width: 600px;

height: 400px;

flex-wrap: wrap;

align-content:normal;

}

.main > div{

background-color: aquamarine;

border: 1px solid #000;

width: 80px;

height: 80px;

text-align: center;

}

</style>

</div>

Grid Css Tutorial

<style>

.main{

display: grid;

grid-template-columns: auto auto auto;

gap: 10px;

}

.main > div{

background-color: aquamarine;

border: 1px solid #000;

height: 100px;

text-align: center;

}

</style>

</div>

Sunday, March 17, 2024

Remove Unique Array Javascript

function uniqArray(array){

var a = [];

for(var i = 0; i < array.length; i++){

if(a.indexOf(array[i] === -1) && array[i] !== ''){

a.push(array[i]);

}

return a;

}

console.log(["A","B","A","C"]);

Number to Hours Javascript

function StringChallenge(num) {

var hours = Math.floor(num / 60);

var minutes = num % 60;

return hours + ":" + minutes;

}

console.log(StringChallenge(readline()));

Wednesday, February 21, 2024

<!DOCTYPE html>
<html>

<head>
    <title>Hello HTML</title>
</head>

<body>
    <h3> Halo dunia HTML</h3>
    <hr>
    <img src="https://cdn.pixabay.com/photo/2022/01/28/18/32/leaves-6975462_1280.png" width="200"
        crossorigin="anonymous" />
    <hr>
    <span id="new_img"></span>
</body>
<script type="module" src="./js/main.js"></script>

</html>

2. Javascript

const image = document.querySelector("img");
const width = image.offsetWidth
const height = image.offsetHeight;
image.getAttribute('src');

const canvas = document.createElement('canvas');
canvas.width = width;
canvas.height = height;
const context = canvas.getContext('2d');
context.drawImage(image, 0, 0, width, height);
let base64 = canvas.toDataURL('image/jpeg');

console.log(base64)

TITLE CASE VANILLA JS

Saturday, February 17, 2024

Split UpperCase Javascript

function solution(string) {

let splitStr = string.split("");

let newStr = string.split("");

let capStr = string.toUpperCase().split("");

console.log(capStr);

for (i = splitStr.length - 1; i >= 0; i--) {

if (splitStr[i] === capStr[i]) {

newStr.splice(i, 0, ' ');

}

return newStr.join("");

}

console.log('camelCasing: ', solution('camelCasing'));

console.log('camelCasingTest: ', solution('camelCasingTest'));

</script>

Saturday, February 10, 2024

Upload Video And ( Resize & Thumbnail ) With FFMPEG For Windows

1. DB ffmpeg

2. Install FFMEPG

=> https://phoenixnap.com/kb/ffmpeg-windows

3 . Source Code : https://github.com/muhammad-rifqi/upload_video_ffmpeg_php.git

Friday, February 9, 2024

Api Map Reference

1. https://nominatim.org/release-docs/3.4/api/Search/

2. https://nominatim.openstreetmap.org/?addressdetails=1&q=bakery+in+berlin+wedding&format=json&limit=1

3. https://nominatim.openstreetmap.org/search?q=ragamukti&format=geojson

4. https://nominatim.org/release-docs/latest/api/Lookup/#examples

Example Code:

<!DOCTYPE html>

<head>

integrity="sha256-kLaT2GOSpHechhsozzB+flnD+zUyjE2LlfWPgU04xyI=" crossorigin="" />

integrity="sha256-WBkoXOwTeyKclOHuWtc+i2uENFpDZ9YPdf5Hf+D7ewM=" crossorigin=""></script>

<style>

#map {

height: 350px

}

</style>

</head>

<body>

</body>

const map = L.map('map');

// Initializes map

map.setView([51.505, -0.09], 13);

// Sets initial coordinates and zoom level

L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {

maxZoom: 19,

}).addTo(map);

// Sets map data source and associates with map

let marker, circle, zoomed;

navigator.geolocation.watchPosition(success, error);

function success(pos) {

const lat = pos.coords.latitude;

const lng = pos.coords.longitude;

const accuracy = pos.coords.accuracy;

if (marker) {

map.removeLayer(marker);

map.removeLayer(circle);

}

// Removes any existing marker and circule (new ones about to be set)

marker = L.marker([lat, lng]).addTo(map);

circle = L.circle([lat, lng], { radius: accuracy }).addTo(map);

// Adds marker to the map and a circle for accuracy

if (!zoomed) {

zoomed = map.fitBounds(circle.getBounds());

}

// Set zoom to boundaries of accuracy circle

map.setView([lat, lng]);

// Set map focus to current user position

}

function error(error) {

console.log(error)

}

</script>

</html>

Thursday, January 25, 2024

Print Preview Vanilla JS

Muhammad Rifqi

Sunday, December 15, 2024

Menambahkan AutoTextfield Dengan Fungsi Klik

Friday, September 27, 2024

Create Own square Function With PHP

Sunday, July 28, 2024

Chiper Crypto Sample With PHP

Wednesday, May 15, 2024

Flex Css Tuturial

Grid Css Tutorial

Sunday, March 17, 2024

Remove Unique Array Javascript

Number to Hours Javascript

Wednesday, February 21, 2024

Preview Canvas from Image

TITLE CASE VANILLA JS

Saturday, February 17, 2024

Split UpperCase Javascript

Saturday, February 10, 2024

Upload Video And ( Resize & Thumbnail ) With FFMPEG For Windows

Friday, February 9, 2024

Api Map Reference

Thursday, January 25, 2024

Print Preview Vanilla JS

Set Cookie dan Remove Cookie dengan php vanilla.js

Report Abuse

Labels