Özetle:
1. Browse/Göz at tıklandığında ekranda bir popup açıldı 300x300px
2. Image file seçildi. Arkaplanda FTP'ye upload edildi.
3. site.com/upload/abcde.jpg url oluşturuldu.
4. Popup otomatik kapandı ve bu URL dosyası bir arka sayfadaki textarea alanına olarak yapıştırıldı.
Olay bundan ibaret. Back-end kısmını ben yapabilirim. Popup açıp dosyayı yükledikten sonra dönen yanıtı arka sayfadaki textarea alanına yapıştırılması işlevi yapılacak.
Detaylı incelemek isteyen aşağıdaki dosyayı inceleyebilir.
// MOD Title: Simple Image Upload
// MOD Author: Sium < admin@imgbb.com > (N/A) http://imgbb.com/mod
// MOD Version: 2.0.0
if (typeof(imgbb_add_text) == 'undefined') {
var imgbb_lang = "en";
var imgbb_add_text = "Add image to post";
var imgbb_style = "padding:10px 0px 0px 0px;font-weight:bold;";
var imgbb_skip_textarea = new RegExp("username_list|search|recipients|signature", "i");
if (imgbb_lang == "en") {
imgbb_lang = "";
} else if (imgbb_lang.indexOf(".") === -1) {
imgbb_lang += ".";
}
if (window.location.hash) {
var imgbb_text;
var imgbb_hash;
if (window.name.indexOf("imgbb_") === -1) {
imgbb_text = window.name;
imgbb_hash = window.location.hash.substring(1).split("_");
} else {
imgbb_text = window.location.hash.substring(1);
imgbb_hash = window.name.split("_");
}
if (imgbb_text != "" && imgbb_hash.length > 1) {
if (imgbb_hash[0] == "imgbb") {
var imgbb_id = imgbb_hash[1];
imgbb_text = decodeURIComponent(imgbb_text);
if (imgbb_text.length > 20) {
if (opener != null && !opener.closed) {
var imgbb_area = opener.document.getElementsByTagName('textarea');
for (var i = 0; i < imgbb_area.length; i++) {
if (i == imgbb_id) {
var editor = false;
if (typeof opener.smf_editorArray === 'object') {
for (var A in opener.smf_editorArray) {
if (opener.smf_editorArray[A].opt.sUniqueId == imgbb_area[i].id) {
opener.smf_editorArray[A].insertText(imgbb_text.replace(new RegExp("\n", 'g'), "<br />"));
editor = true;
}
}
}
if (editor == false) {
imgbb_area[i].value = imgbb_area[i].value + imgbb_text;
}
opener.focus();
window.close();
}
}
}
}
window.location.replace("//" + imgbb_lang + "imgbb.com/upload?mode=code&url=" + encodeURIComponent(document.location.href));
}
}
}
function imgbb_insert() {
var imgbb_area = document.getElementsByTagName('textarea');
for (var i = 0; i < imgbb_area.length; i++) {
if (imgbb_area[i].name && !imgbb_skip_textarea.test(imgbb_area[i].name)) {
var attr = imgbb_area[i].getAttribute('data-imgbb');
if (attr != "true") {
var imgbb_div = document.createElement('div');
imgbb_div.setAttribute('class', "imgbb");
var imgbb_a = document.createElement('a');
imgbb_a.innerHTML = imgbb_add_text;
imgbb_a.href = "javascript:imgbb_upload(" + i + ");";
var imgbb_bullet = document.createElement('span');
imgbb_bullet.setAttribute('class', "imgbb_bullet");
imgbb_bullet.innerHTML = " ";
imgbb_div.appendChild(imgbb_bullet);
imgbb_div.appendChild(imgbb_a);
imgbb_area[i].setAttribute('data-imgbb', "true");
if (new RegExp("quick", "i").test(imgbb_area[i].name) == false && imgbb_area[i].parentNode.nextElementSibling && new RegExp("resize", "i").test(imgbb_area[i].parentNode.nextElementSibling.id)) {
imgbb_div.setAttribute('style', imgbb_style);
imgbb_area[i].parentNode.parentNode.appendChild(imgbb_div);
} else if (new RegExp("quick", "i").test(imgbb_area[i].name) == false && imgbb_area[i].nextElementSibling && new RegExp("resize", "i").test(imgbb_area[i].nextElementSibling.id)) {
imgbb_div.setAttribute('style', imgbb_style);
imgbb_area[i].parentNode.insertBefore(imgbb_div, imgbb_area[i].nextSibling);
} else if (new RegExp("quick", "i").test(imgbb_area[i].name) == false && imgbb_area[i].nextElementSibling && imgbb_area[i].nextElementSibling.nextElementSibling && new RegExp("resize", "i").test(imgbb_area[i].nextElementSibling.nextElementSibling.id)) {
imgbb_div.setAttribute('style', imgbb_style);
imgbb_area[i].parentNode.insertBefore(imgbb_div, imgbb_area[i].nextSibling.nextSibling);
} else {
if (imgbb_area[i].nextSibling.nextSibling) {
imgbb_area[i].parentNode.insertBefore(imgbb_div, imgbb_area[i].nextSibling.nextSibling);
} else if (imgbb_area[i].nextSibling) {
imgbb_area[i].parentNode.insertBefore(imgbb_div, imgbb_area[i].nextSibling);
} else {
imgbb_area[i].parentNode.appendChild(imgbb_div);
}
}
}
}
}
}
function imgbb_upload(areaid) {
window.open("//" + imgbb_lang + "imgbb.com/upload?mode=smf&url=" + encodeURIComponent(document.location.href), "imgbb_" + areaid, "resizable=yes,width=720,height=540");
return void(0);
}
if (typeof(window.addEventListener) == 'function') {
window.addEventListener('DOMContentLoaded', imgbb_insert, false);
window.addEventListener('load', imgbb_insert, false);
} else if (typeof(window.attachEvent) == 'function') {
window.attachEvent('onload', imgbb_insert);
} else {
if (window.onload != null) {
var old_onload = window.onload;
window.onload = function(e) {
old_onload(e);
imgbb_insert();
};
} else {
window.onload = imgbb_insert;
}
}
for (var i = 1; i < 12; i += 2) {
setTimeout("imgbb_insert()", i * 1000);
}
imgbb_insert();
} 