PDA

View Full Version : Nice Ajax Request Source Code viewer



Falkon303
09-26-2008, 12:52 AM
hey everyone.

I made a nice javascript based source code viewer utilizing the "ajaxroutine.js" script. It utilizes a get method by using a url rather than an additonal file.

It's very useful. For future versions, I'd like to integrate a php parsing script to make the local files (ie: nondisplayed pics/links) be generated as remote where applicable.

The REQUIRED Ajax get/post routine can be obtained by this link - ajaxroutine.js (http://www.dynamicdrive.com/dynamicindex17/ajaxroutine.js). Further Usage and documentation is here. (http://www.dynamicdrive.com/dynamicindex17/ajaxroutine.htm)

The Source code is as follows. Enjoy!



<script type="text/javascript" src="ajaxroutine.js">
/***********************************************
* Basic Ajax Routine- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<script type="text/javascript">
//Step 2: Define a "callback" function to process the data returned by the Ajax request:
function processGetPost(){
var myajax=ajaxpack.ajaxobj
var myfiletype=ajaxpack.filetype
if (myajax.readyState == 4){ //if request of file completed
if (myajax.status==200 || window.location.href.indexOf("http")==-1){ //if request was successful or running script locally
if (myfiletype=="txt")
if (sel == 'text')
{
document.getElementById('srcview').style.display = 'none';
document.getElementById('txtview').style.display = '';
document.getElementById('txtview').value = myajax.responseText;
} else
{
document.getElementById('txtview').style.display = 'none';
document.getElementById('srcview').style.display = '';
document.getElementById('srcview').innerHTML = myajax.responseText;
}
else
document.getElementById('srcview').value = myajax.responseText;
}
}
}
//Step 3: Invoke the Ajax routine method to make the desired Ajax request.
</script>
<style type="text/css">
<!--

.font1 {
font-weight: bold; font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
color: #0066FF;
cursor:pointer;
}
.font2 {
color: #CCCCCC;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
}

-->
</style>
<div style="display:none;position:absolute;left:0px;top:76px;width:100%;z-index:0;" name="srcview" id="srcview" cols="100" rows="30">
</div>
<table width="810" border="0" align="center" cellpadding="3" cellspacing="0" style="border:2px solid #0066ff;z-index:1;">
<tr width="800px" bgcolor="#0066FF">
<td class="style1 style2" colspan="2"><span class="font2">Enter URL:</span> <input name="url" type="text" id="url2" value="http://www.google.com" size="40"> </td>
</tr>
<tr bgcolor="#CCCCCC">
<td width="315"><div onclick="sel='text';ajaxpack.getAjaxRequest(document.getElementById('url').value, '', processGetPost, 'txt');" align="center" class="font1"><strong>View Text HTML </strong></div></td>
<td width="304"><div onclick="sel='html';ajaxpack.getAjaxRequest(document.getElementById('url').value, '', processGetPost, 'txt');" align="center" class="font1">View Visual HTML </div></td>
</tr>
<tr>
<td colspan="2"><textarea style="display:none;width:800px;" name="txtview" id="txtview" rows="30"></textarea></td>
</tr>
</table>