Bitcointalk Image Uploader | Image Upload has never been so easy
⭐ Merited by Halab (2) ,Z_MBFM (2) ,viljy (2) ,Ricardo11 (2) ,masulum (1) ,Mahiyammahi (1) ,Wonder Work (1) ,Dr.Osh (1) ,r_victory (1) ,crwth (1) ,Bd officer (1) ,Mia Chloe (1) ,dkbit98 (1)
I was having fun with chatgpt and found this idea. Right now, to upload an image, we are going to image hosting site and then upload the image, copy the bbcode and paste it here. Instead, we can upload the image from the forum with the help of this extension. The image will be uploaded to the image hosting site, in this case, hostmeme.com and then the bbcode will be automatically pasted in the post dialog box.
Process to run the extension
1. Create a folder with the name "Image Uploader"
2. Create 2 text files inside the folder
3. Rename one file to content.js and add the content shared below
4. Rename another file to manifest.json and add the content shared below
5. Go to Chrome extension and enable developer mode.
6. Click on "Load unpacked" and upload the folder "Image Uploader"
That's all.
content.js
Code:
function addUploadButton() {
const postBtn = document.querySelector("input[name='post']");
if (!postBtn || document.getElementById("uploadImageBtn")) return;
const uploadBtn = document.createElement("button");
uploadBtn.id = "uploadImageBtn";
uploadBtn.innerText = "Upload Image";
uploadBtn.type = "button";
uploadBtn.style.marginLeft = "10px";
uploadBtn.style.padding = "5px 10px";
postBtn.parentNode.insertBefore(uploadBtn, postBtn.nextSibling);
uploadBtn.addEventListener("click", () => {
const input = document.createElement("input");
input.type = "file";
input.accept = "image/*";
input.onchange = async () => {
const file = input.files[0];
if (!file) return;
const formData = new FormData();
formData.append("image", file);
uploadBtn.innerText = "Uploading...";
try {
const response = await fetch("https://hostmeme.com/bitcointalk.php", {
method: "POST",
body: formData
});
const data = await response.json();
if (data.success && data.url && data.width && data.height) {
const bbcode = `[img height=${data.height} width=${data.width}]${data.url}[/img]`;
const textarea = document.querySelector("textarea[name='message']");
if (textarea) {
textarea.value += `\n${bbcode}\n`;
}
} else {
alert("Upload failed: " + (data.error || "Unknown error"));
}
} catch (err) {
alert("Upload error: " + err.message);
} finally {
uploadBtn.innerText = "Upload Image";
}
};
input.click();
});
}
addUploadButton();
const postBtn = document.querySelector("input[name='post']");
if (!postBtn || document.getElementById("uploadImageBtn")) return;
const uploadBtn = document.createElement("button");
uploadBtn.id = "uploadImageBtn";
uploadBtn.innerText = "Upload Image";
uploadBtn.type = "button";
uploadBtn.style.marginLeft = "10px";
uploadBtn.style.padding = "5px 10px";
postBtn.parentNode.insertBefore(uploadBtn, postBtn.nextSibling);
uploadBtn.addEventListener("click", () => {
const input = document.createElement("input");
input.type = "file";
input.accept = "image/*";
input.onchange = async () => {
const file = input.files[0];
if (!file) return;
const formData = new FormData();
formData.append("image", file);
uploadBtn.innerText = "Uploading...";
try {
const response = await fetch("https://hostmeme.com/bitcointalk.php", {
method: "POST",
body: formData
});
const data = await response.json();
if (data.success && data.url && data.width && data.height) {
const bbcode = `[img height=${data.height} width=${data.width}]${data.url}[/img]`;
const textarea = document.querySelector("textarea[name='message']");
if (textarea) {
textarea.value += `\n${bbcode}\n`;
}
} else {
alert("Upload failed: " + (data.error || "Unknown error"));
}
} catch (err) {
alert("Upload error: " + err.message);
} finally {
uploadBtn.innerText = "Upload Image";
}
};
input.click();
});
}
addUploadButton();
manifest.json
Code:
{
"manifest_version": 3,
"name": "Bitcointalk Image Uploader",
"version": "1.0",
"description": "Upload image to hostmeme.com and insert BBCode in Bitcointalk post.",
"permissions": ["scripting", "activeTab"],
"host_permissions": ["https://hostmeme.com/*"],
"content_scripts": [
{
"matches": ["https://bitcointalk.org/*"],
"js": ["content.js"],
"run_at": "document_end"
}
],
"action": {
"default_title": "Bitcointalk Image Uploader"
}
}
"manifest_version": 3,
"name": "Bitcointalk Image Uploader",
"version": "1.0",
"description": "Upload image to hostmeme.com and insert BBCode in Bitcointalk post.",
"permissions": ["scripting", "activeTab"],
"host_permissions": ["https://hostmeme.com/*"],
"content_scripts": [
{
"matches": ["https://bitcointalk.org/*"],
"js": ["content.js"],
"run_at": "document_end"
}
],
"action": {
"default_title": "Bitcointalk Image Uploader"
}
}