|
Server : Apache/2 System : Linux server1.tkcorporation.co.th 2.6.32-042stab145.3 #1 SMP Thu Jun 11 14:05:04 MSK 2020 i686 User : ifixit ( 537) PHP Version : 5.3.29 Disable Function : exec,system,passthru,shell_exec,escapeshellarg,escapeshellcmd,proc_close,proc_open,dl,popen,show_source Directory : /home/ifixit/domains/ifixit.co.th/public_html/assets/ckeditor/plugins/imgbrowse/ |
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>CKeditor Image Browser</title>
<meta name="description" content="CKeditor Image Browser, from http://coursesweb.net/ , Free" />
<meta name="keywords" content="ckeditor, image browse" />
<meta name="robots" content="ALL" />
<meta name="author" content="MarPlo" />
<style>
<!--
@charset "utf-8";
body, html {background-color:#f0f1fe;margin:1px 1%;padding:0;text-align:center;font-size:1em;font-family:"Calibri",sans-serif;}
footer,section,nav{display:block}
#menu {
position:absolute;
top:5px;
left:1px;
width:10em;
background:#fefefe;
border:2px solid #bbb;
padding:.2em;
text-align:left;
-moz-border-radius:.8em;
-webkit-border-radius:.8em;
-khtml-border-radius:.8em;
border-radius:.8em;
}
#menu ul {
margin:1px 0 1px .1em;
padding:0 0 0 .5em;
}
#menu li {
margin:1px 0;
background:#eee;
padding:1px 2px;
color:#0001da;
}
#menu li span {
display:block;
margin:0;
text-decoration:underline;
cursor:pointer;
}
#menu #c_li #c_span {
background:#0001be;
font-weight:700;
text-decoration:none;
color:#fff;
}
#menu li span:hover {
background:#fbfb01;
text-decoration:none;
}
#imgs {
position:relative;
height:100%;
margin:0 0 1em calc(10.1em + .2%);
background:#f7f8f9;
padding:.2em .3em;
text-align:left;
overflow:auto;
}
#imgs h1 {
margin:25% auto 1em auto;
text-align:center;
text-decoration:underline;
}
#imgs span {
max-height:5em;
margin:.2em .3%;
display:inline-block;
border:1px solid #bbb;
background:#fefeff;
padding:2px;
text-align:center;
font-weight:600;
font-style:oblique;
}
#imgs span:hover {
background:#ebfbeb;
}
#imgs span:hover img {
background:#fefebe;
}
#imgs img {
display:block;
margin:0 auto 2px auto;
border:none;
padding:2px;
cursor:pointer;
}
#footer {
position:absolute;
bottom:0;
left:0;
right:0;
margin:1px auto;
font-size:8px;
}
//-->
</style>
</head>
<body>
<section id="imgs"></section>
<nav id="menu"><ul><li id="c_li"><span id="c_span" title="">Root</span></li></ul></nav>
<footer id="footer">
From: <a href="http://coursesweb.net/" title="CoursesWeb">http://coursesweb.net/javascript/javascript-scripts_s2</a>
</footer>
<script>
// <![CDATA[
var current_li = 'c_li'; // id of current accessed li-menu
var current_span = 'c_span'; // id of current accessed span in li-menu
var title_dir = document.getElementById(current_li).querySelector('span').title; // title with dir-path of current span-li
var li_name = document.getElementById(current_li).querySelector('span').innerHTML; // name of current accessed menu-list
var imgs = document.getElementById('imgs'); // element with images
// To get value of imgroot and CKEditorFuncNum from URL
var url = location.href; // current page address
var imgroot = url.match(/imgroot=([^&]*)/) ? url.match(/imgroot=([^&]*)/)[1] : null;
var CKEditorFuncNum = url.match(/CKEditorFuncNum=([0-9]+)/) ? url.match(/CKEditorFuncNum=([0-9]+)/)[1] : null;
// Ajax, receives the url of file to access, data to send, and a callback function (called when the response is received)
function ajaxSend(datasend, callback) {
imgs.innerHTML = '<h1>Loading ...: '+ li_name +'</h1>'; // message till ajax-response
var request = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); // sets the XMLHttpRequest instance
datasend += '&isajax=1'; // to know in php it is ajax request
if(imgroot != null) datasend += '&imgroot='+ imgroot;
request.open("POST", 'imgbrowse.php'); // define the request
// adds a header to tell the PHP script to recognize the data as is sent via POST, and send data
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(datasend);
// Check request status, when the response is completely received pass it to callback function
request.onreadystatechange = function() {
if (request.readyState == 4) {
callback(request.responseText);
}
}
}
// callback from Ajax
function ajaxCallback(response) {
var content = JSON.parse(response);
if(response.match(/ERROR from PHP:/)) imgs.innerHTML = '<h2>'+ content +'</h2>';
else {
// add new menu in current clicked list
if(document.getElementById(current_li)) document.getElementById(current_li).innerHTML = '<span title="'+ title_dir +'" id="'+ current_span +'">'+ li_name +'</span>'+ content.menu;
imgs.innerHTML = content.imgs;
regEv();
}
}
// to register events
function regEv() {
if(document.getElementById('menu')) {
// get menu LIs
var lists = document.getElementById('menu').querySelectorAll('li span');
var nr_lists = lists.length;
// register click to eack span-li
if(nr_lists > 0) {
for(var i=0; i<nr_lists; i++) {
lists[i].addEventListener('click', function(e){
if(e.target.id == current_span) return false;
else {
// removes and sets id for current element
if(document.getElementById(current_li)) document.getElementById(current_li).removeAttribute('id');
if(document.getElementById(current_span)) document.getElementById(current_span).removeAttribute('id');
e.target.parentNode.setAttribute('id', current_li);
li_name = e.target.childNodes[0].nodeValue;
title_dir = e.target.title;
ajaxSend('imgdr='+ title_dir, ajaxCallback); // get data from php
}
}, false);
}
}
// get images and register click to eack img, to acces window.parent.CKEDITOR.tools.callFunction()
var img_all = imgs.querySelectorAll('img');
var nr_img_all = img_all.length;
// register click to eack span-li
if(nr_img_all > 0) {
for(var i=0; i<nr_img_all; i++) {
img_all[i].addEventListener('click', function(e){
if(CKEditorFuncNum !== null) window.opener.CKEDITOR.tools.callFunction(CKEditorFuncNum, e.target.src);
window.close();
}, false);
}
}
}
}
ajaxSend('', ajaxCallback); // get data from php
// ]]>
</script>
</body>
</html>