SOURCE CODE: JOBs DONE REPORT versi WEB-PURPOSE

<h1><a href="https://drive.google.com/file/d/1y2vNqYvDkqNxSZEQOddFQ0_LvpSkqDuF/view?usp=sharing" target="_blank">APK by MEDIAN.CO DOWNLOAD LINK!</a></h1>

<br />

<hr />

<br />

<p><span><span style="color: red; font-size: 60px;"><b>Jobs Done!</b></span><br /><span style="color: #ffa400; font-size: 30px;">Household++</span></span></p>

firebase.initializeApp({

apiKey: "AIzaSyAF5r6Rvu-DmoV-vf47wYTZfarpVGmNYR0",

authDomain: "ronin-11938.firebaseapp.com",

databaseURL: "https://ronin-11938-default-rtdb.firebaseio.com",

projectId: "ronin-11938",

storageBucket: "ronin-11938.firebasestorage.app",

messagingSenderId: "823368889742",

appId: "1:823368889742:web:609e16ace214b94a0df"

});

var rdb = firebase.database();

var refCRUD = rdb.ref("JobDoneData");

</script>

<style>

:root {

--bg: #ffffff;

--card: #ffffff;

--glass: rgba(255,255,255,0.82);

--border: #dcdcdc;

--shadow: rgba(0,0,0,0.14);

--text: #222;

}

@media (prefers-color-scheme: dark) {

:root {

--bg: #111;

--card: lightgrey;

--glass: rgba(40,40,40,0.72);

--border: #333;

--shadow: rgba(0,0,0,0.55);

--text: #f5f5f5;

}

body { background: lightgrey; color: var(--text); }

.crud-box, .table-box {

background: var(--card);

border:1px solid var(--border);

padding:18px;

border-radius:12px;

margin-bottom:20px;

box-shadow:0 4px 12px var(--shadow);

}

input, select, textarea {

padding:10px;

width:100%;

border-radius:8px;

border:1px solid var(--border);

box-shadow:0 1px 3px var(--shadow) inset;

}

.icon-btn {

cursor:pointer;

font-size:22px;

margin-right:6px;

transition:0.15s;

}

.icon-btn:hover { transform:scale(1.28); }

/* ========================================= */

/* NEW DATE COLUMN — TWO ROWS (Month + Year) */

/* ========================================= */

.date-cell {

width: 150px;

min-width: 150px;

text-align: center;

white-space: normal;

line-height: 1.25;

font-weight: 600;

}

.date-year {

display:block;

font-size:0.9em;

margin-top:2px;

color:#666;

}

.glass-modal {

position:fixed; top:0; left:0; width:100%; height:100%;

background:lime;

display:none;

align-items:center;

justify-content:center;

z-index:9999;

}

.glass-modal-content {

background:lime;

backdrop-filter:blur(12px);

padding:20px;

border-radius:15px;

width:90%;

max-width:420px;

box-shadow:0 4px 18px var(--shadow);

color:var(--text);

}

.table-clean { border-collapse:collapse; width:100%; }

.table-clean th {

background:lime;

padding:10px;

border-bottom:2px solid var(--border);

}

.table-clean td {

padding:10px;

border-bottom:1px solid var(--border);

}

.table-clean tr:nth-child(even) {

background:white;

}

.table-clean tr:nth-child(odd) {

background:white;

}

</style>

<label><b><span style="color: #04ff00;">Month</span></b></label>

<label><b><span style="color: #04ff00;">Description</span></b></label>

💾 Save

</button>

</div>

<label><b><span style="color: #01ffff;">Search</span></b></label>

</span><select id="sortSelect" onchange="renderTable()">

<option value="desc">Newest First</option>

<option value="asc">Oldest First</option>

</select>

</div>

<thead>

<tr>

<th><span style="color: #fcff01; font-size: x-large;">DESCRIPTION</span></th>

</tr>

</thead>

</table>

</div>

</span><div class="glass-modal" id="modalGlass">

<button onclick="closeModal()" style="padding: 8px 15px;">Close</button></span>

</div>

var allData = [];

var monthNames = ["January","February","March","April","May","June","July","August","September","October","November","December"];

function loadMonthYear() {

var mSel = document.getElementById("monthSelect");

var ySel = document.getElementById("yearSelect");

var today = new Date();

var curM = today.getMonth() + 1;

var curY = today.getFullYear();

for (var i=1; i<=12; i++) {

var o = document.createElement("option");

o.value = i;

o.text = monthNames[i-1];

if (i === curM) o.selected = true;

mSel.appendChild(o);

}

for (var y=2023; y<=curY+5; y++) {

var o2 = document.createElement("option");

o2.value = y;

o2.text = y;

if (y === curY) o2.selected = true;

ySel.appendChild(o2);

}

loadMonthYear();

function addRecord() {

var m = document.getElementById("monthSelect").value;

var y = document.getElementById("yearSelect").value;

var desc = document.getElementById("jobDesc").value;

if (m==="" || y==="" || desc.trim()==="") {

alert("Please complete all fields.");

return;

}

var id = refCRUD.push().key;

refCRUD.child(id).set({

id:id,

month:m,

year:y,

description:desc,

sortKey:(parseInt(y)*100)+parseInt(m)

});

document.getElementById("jobDesc").value="";

}

refCRUD.on("value", function(snap) {

allData=[];

snap.forEach(function(c){ allData.push(c.val()); });

renderTable();

});

function renderTable() {

var tbody=document.getElementById("dataList");

tbody.innerHTML="";

var search=document.getElementById("searchInput").value.toLowerCase();

var sort=document.getElementById("sortSelect").value;

var filtered=[];

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

var text = monthNames[allData[i].month-1] + " " + allData[i].year + " " + allData[i].description;

if (text.toLowerCase().indexOf(search)!==-1) filtered.push(allData[i]);

}

filtered.sort(function(a,b){

return sort==="desc" ? b.sortKey-a.sortKey : a.sortKey-b.sortKey;

});

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

var d=filtered[i];

var tr=document.createElement("tr");

tr.innerHTML =

"<td class='date-cell'>" +

monthNames[d.month-1] +

"<span class='date-year'>" + d.year + "</span>" +

"</td>" +

"<td>"+ d.description.replace(/\\n/g,'<br>') +"</td>" +

"<td>" +

"<span class='icon-btn' onclick=\"viewRecord('" + d.id + "')\">👁️</span>" +

"<span class='icon-btn' onclick=\"editRecord('" + d.id + "')\">✏️</span>" +

"<span class='icon-btn' onclick=\"deleteRecord('" + d.id + "')\">🗑️</span>" +

"</td>";

tbody.appendChild(tr);

}

function viewRecord(id){

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

if (allData[i].id===id){

openModal(

"View Record",

monthNames[allData[i].month-1]+" "+allData[i].year+"\n\n"+allData[i].description

);

return;

}

function editRecord(id){

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

if (allData[i].id===id){

var newDesc=prompt("Edit description:", allData[i].description);

if (newDesc!==null){

refCRUD.child(id).update({description:newDesc});

}

return;

}

function deleteRecord(id){

if (confirm("Delete this record?")){

refCRUD.child(id).remove();

}

function openModal(title,body){

document.getElementById("modalTitle").textContent=title;

document.getElementById("modalBody").textContent=body;

document.getElementById("modalGlass").style.display="flex";

}

function closeModal(){

document.getElementById("modalGlass").style.display="none";

}

</script>

[ERROR BUG]
ChatGPT+Gemini: TikTok → Blogger Embed Converter using Cloudflare/Online Server

🔄 Refresh Page ERROR BUG: The connection is blocked because it was initiated by a public page to connect to devices or servers on your local network. Planning: Revise Program CODE Code USING Javascript/Online Server Code NOT USING Javascript Sample Working Code aka Already Repaired! Temporary Solution is by Asking AI Assistant to do REPAIR CODE of (Not yet Repaired) Current Conversion Program Code-Output TikTok Archive – Embedded Preview TikTok Embed ▶ View this video on TikTok ⚠️ DISCLAIMER: INPUT URL LIMITATION This program is currently restricted to processing Full Browser URLs only. It does not support TikTok’s mobile "short-link" format (e.g., vt.tiktok.com ). Required Action: Users must open the video in a web browser and copy the expanded URL from the address bar before pasting it into this program. URL Conversion Example ❌ UNSUPPORTED: https://vt.tiktok.com/ZSaXoFyov/ ✅ REQ...

Search This Blog

ANDREAS TOMMY PARLAUNGAN MANURUNG

SHARED POOLING ACCOUNT

MY ANDROID APKs PAGE
please download here!