Never been to DZone Snippets before?

Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

« Newer Snippets
Older Snippets »
Showing 1-10 of 35 total  RSS 

Generating Taconite command documents

// description of your code here
Hello,

This is a port of a php class used to generate XML taconite command documents, useful for (very) easy and powerful ajaxy stuff, if you don't know what that is just check it there in french : http://www.desfrenes.com/playground/taconite/ or there in english : http://www.malsup.com/jquery/taconite/.

Basically what it does is generate an XML document that is later processed by a javascript plugin which executes a serie of DOM modifications.

About the code, I'm a Django beginner as well as a Python beginner so kind advices are welcome.

Cheers.
# usage:
#
# t = Taconite()
#
# t.append("#toto","<label>test</label>")
# t.remove("#tutu")
# t.js('alert("hello world");')
# t.toggleClass('blue','body')
# t.css("body","background-color","white")
# [...]
# print t.toprettyxml()

import xml.dom.minidom as dom

class Taconite(dom.Document):
    def __init__(self):
        dom.Document.__init__(self)
        taconite = self.createElement("taconite")
        self.appendChild(taconite)

    def __str__(self):
        return self.toxml(encoding="utf-8")
    
    def camelizeCssProperty(self,property):
        words = property.split('-')
        camelized = words[0].lower()
        for word in words[1:] :
            camelized = camelized + word[0].upper() + word[1:]
        return camelized
    
    def js(self,script):
        command = self.createElement("eval")
        js = self.createTextNode(script)
        command.appendChild(js)
        self.childNodes[0].appendChild(command)
    
    def changeContentCommand(self,method,selector,content):
        html_dom = dom.parseString(content)
        command = self.createElement(method)
        command.setAttribute("select",selector)
        command.appendChild(html_dom.childNodes[0])
        self.childNodes[0].appendChild(command)
    
    def changeStateCommand(self,action,selector):
        command = self.createElement(action)
        command.setAttribute("select",selector)
        self.childNodes[0].appendChild(command)
    
    def CssCommand(self,action,css_class,selector):
        command1 = self.createElement(action)
        command1.setAttribute("select",selector)
        command1.setAttribute("arg1",css_class)
        command2 = self.createElement(action)
        command2.setAttribute("select",selector)
        command2.setAttribute("value",css_class)
        self.childNodes[0].appendChild(command1)
        self.childNodes[0].appendChild(command2)
    
    def addClass(self,css_class,selector):
        self.CssCommand("addClass",css_class,selector)

    def removeClass(self,css_class,selector):
        self.CssCommand("remove",css_class,selector)

    def toggleClass(self,css_class,selector):
        self.CssCommand("toggleClass",css_class,selector)
    
    def append(self,selector,content):
        self.changeContentCommand("append",selector,content)
    
    def prepend(self,selector,content):
        self.changeContentCommand("prepend",selector,content)
        
    
    def before(self,selector,content):
        self.changeContentCommand("before",selector,content)
        
    
    def after(self,selector,content):
        self.changeContentCommand("after",selector,content)
    
    def wrap(self,selector,content):
        self.changeContentCommand("wrap",selector,content)
    
    def replace(self,selector,content):
        self.changeContentCommand("replace",selector,content)
    
    def replaceContent(self,selector,content):
        self.changeContentCommand("replaceContent",selector,content)
    
    def remove(self,selector):
        self.changeStateCommand("remove",selector)
    
    def show(self,selector):
        self.changeStateCommand("show",selector)
    
    def hide(self,selector):
        self.changeStateCommand("hide",selector)
    
    def removeContent(self,selector):
        self.changeStateCommand("empty",selector)
    
    def css(self,selector,property,value):
        command = self.createElement("css")
        command.setAttribute("select",selector)
        command.setAttribute("name",self.camelizeCssProperty(property))
        command.setAttribute("value",value)
        self.childNodes[0].appendChild(command)

Simple javascript XHR object with fix for missing onreadystatechange event in Firefox (for synchronous calls)

This code fixes the issue in Firefox where the onreadystatechange event is not called for synchronous XHR requests. It is based on the XHConn script from http://xkr.us/code/javascript/XHConn/, patched with the fix documented at http://lukav.com/wordpress/2007/04/12/firefox-firebug-and-synchronos-calls-problem/

/** XHConn - Simple XMLHTTP Interface - bfults@gmail.com - 2005-04-08        **
 ** Code licensed under Creative Commons Attribution-ShareAlike License      **
 ** http://creativecommons.org/licenses/by-sa/2.0/                           **/
/**
 * Modified slightly from original to support synchoronous transactions
 * CDB 2007-05-16, 2007-06-05
 */

function XHConn()
{
	var xmlhttp, bComplete = false;
	try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
	catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
	catch (e) { try { xmlhttp = new XMLHttpRequest(); }
	catch (e) { xmlhttp = false; }}}
	if (!xmlhttp) return null;
	this.connect = function(sURL, sMethod, sVars, fnDone, bAsynch)
	{
		if (!xmlhttp) return false;
		bComplete = false;
		sMethod = sMethod.toUpperCase();

		if (bAsynch == null) bAsynch = true; //treat asynch as an optional argument

		try {
			if (sMethod == "GET")
			{
				xmlhttp.open(sMethod, sURL+"?"+sVars, (bAsynch == true));
				sVars = "";
			}
			else
			{
				xmlhttp.open(sMethod, sURL, (bAsynch == true));
				xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
				xmlhttp.setRequestHeader("Content-Type",
					"application/x-www-form-urlencoded");
			}

			xmlhttp.onreadystatechange = function(){
				if (xmlhttp.readyState == 4 && !bComplete)
				{
					bComplete = true;
					fnDone(xmlhttp);
				}
			};
			xmlhttp.send(sVars);

			/**
			 * Firefox <= 2.0.0 doesn't fire onreadystatechange for synchronous requests.
			 * See http://lukav.com/wordpress/2007/04/12/firefox-firebug-and-synchronos-calls-problem/
			 */
			var isGecko = (document.addEventListener) ? true : false;
			try {
				if (!bAsynch && isGecko && xmlhttp.onreadystatechange == null) {
					bComplete = true;
					fnDone(xmlhttp);
					return true;
				}
			}
			catch (e) { return false; }
			/**
			 * End synchronous request patch
			 */
		}
		catch(z) { return false; }
		return true;
	};
	return this;
}

Basic XMLHttprequest

// Basic XMLHttprequest (code from http://www.sitepoint.com/article/take-command-ajax)

function makeHttpRequest(url){

   var http_request = false;

   if (window.XMLHttpRequest) { // Mozilla, Safari,...
   
       http_request = new XMLHttpRequest();
	   
       if (http_request.overrideMimeType){
	   
           http_request.overrideMimeType('text/xml');
		   
       }
	   
   } 
   else if (window.ActiveXObject) { // IE
   
       try{
	   
           http_request = new ActiveXObject("Msxml2.XMLHTTP");
		   
       } 
	   catch(e){
	   
           try{
		   
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
			   
           } 
		   catch (e) {}
       }
	   
   }

   if (!http_request) {
   
       alert('Unfortunatelly you browser doesn\'t support this feature.');
	   
       return false;
	   
   }
   http_request.onreadystatechange = function() {
   
       if (http_request.readyState == 4){
	   
           if (http_request.status == 200){

				alert(http_request.responseText);

           } 
		   else{
		   
               alert('There was a problem with the request.(Code: ' + http_request.status + ')');
			   
           }
		   
       }
	   
   };
   
   http_request.open('GET', url, true);
   http_request.send(null);
}

miniAJAX.js - updated to be a bit more robust

inspired by timmorgan's post here: http://snippets.dzone.com/posts/show/2025


see CHANGELOG in details.

function $(e){if(typeof e=='string')e=document.getElementById(e);return e};
function collect(a,f){var n=[];for(var i=0;i<a.length;i++){var v=f(a[i]);if(v!=null)n.push(v)}return n};

ajax={};
ajax.x=function(){try{return new ActiveXObject('Msxml2.XMLHTTP')}catch(e){try{return new ActiveXObject('Microsoft.XMLHTTP')}catch(e){return new XMLHttpRequest()}}};
//ajax.serialize=function(f){var g=function(n){return f.getElementsByTagName(n)};var nv=function(e){if(e.name)return encodeURIComponent(e.name)+'='+encodeURIComponent(e.value);else return ''};var i=collect(g('input'),function(i){if((i.type!='radio'&&i.type!='checkbox')||i.checked)return nv(i)});var s=collect(g('select'),nv);var t=collect(g('textarea'),nv);return i.concat(s).concat(t).join('&');};
ajax.serialize=function(f){var g=function(n){return f.getElementsByTagName(n)};var nv=function(e){if(e.name)return encodeURIComponent(e.name)+'='+encodeURIComponent(e.value);else return ''};var i=collect(g('input'),function(i){if((i.type!='radio'&&i.type!='checkbox')||i.checked)return nv(i)});var s=collect(g('select'),nv);var t=collect(g('textarea'),nv);var sOutput = i.concat(s).concat(t).join('&'); while (sOutput.indexOf('&&')>0) sOutput = sOutput.replace("&&","&"); return sOutput;}; // i've modified to clear out instances of "&&" in the POSTback
ajax.send=function(u,f,m,a){var x=ajax.x();x.open(m,u,true);x.onreadystatechange=function(){if(x.readyState==4)f(x.responseText)};if(m=='POST')x.setRequestHeader('Content-type','application/x-www-form-urlencoded');x.send(a)};
ajax.sendNoCache=function(u,f,m,a){u = u + (u.indexOf('?') < 0 ? '?' : '&') + 'noCache=' + new Date().getTime();var x=ajax.x();x.open(m,u,true);x.onreadystatechange=function(){if(x.readyState==4)f(x.responseText)};if(m=='POST')x.setRequestHeader('Content-type','application/x-www-form-urlencoded');x.send(a)};
ajax.get=function(url,func){ajax.send(url,func,'GET')};
ajax.getNoCache=function(url,func){url = url + (url.indexOf('?') < 0 ? '?' : '&') + 'noCache=' + new Date().getTime();ajax.send(url,func,'GET')};
ajax.gets=function(url){var x=ajax.x();x.open('GET',url,false);x.send(null);return x.responseText};
ajax.getsNoCache=function(url){url = url + (url.indexOf('?') < 0 ? '?' : '&') + 'noCache=' + new Date().getTime();var x=ajax.x();x.open('GET',url,false);x.send(null);return x.responseText};
ajax.post=function(url,func,args){ajax.send(url,func,'POST',args)};
ajax.postNoCache=function(url,func,args){ajax.sendNoCache(url,func,'POST',args)};
ajax.update=function(url,elm){var e=$(elm);var f=function(r){e.innerHTML=r};ajax.get(url,f);};
ajax.updateNoCache=function(url,elm){var e=$(elm);var f=function(r){e.innerHTML=r};ajax.getNoCache(url,f);};
ajax.submit=function(url,elm,frm){var e=$(elm);var f=function(r){e.innerHTML=r};ajax.post(url,f,ajax.serialize(frm))};
ajax.submitNoCache=function(url,elm,frm){var e=$(elm);var f=function(r){e.innerHTML=r};ajax.postNoCache(url,f,ajax.serialize(frm))};



/** HOW TO USE
ajax.x - The XMLHttpRequest object (or MS equivalent) used for communication

ajax.serialize(f)
  f = the form element you wish to be serialized
  This function serializes all the fields in a form so that they can be passed as a query string in the form 'arg1=val1&arg2=val2'.

ajax.getNoCache(url, func)
ajax.get(url, func)
  url = the url to query (can contain arguments after a '?')
  func = the function to call once the response is returned (no quotes)
  This function uses a GET request to query the specified url and return a response to the specified function.

ajax.getsNoCache(url)
ajax.gets(url)
  url = the url to query (can contain arguments after a '?')
  This function uses a GET request to query the specified url and return a response synchronously. Use this sparingly, as synchronous calls can lock up the browser.

ajax.postNoCache(url, func, args)
ajax.post(url, func, args)
  url = the url to query
  func = the function to call once the response is returned (no quotes)
  args = a string containing arguments to be passed to the url
  This function uses a POST request to query the specified url and return a response to the specified function.

ajax.updateNoCache(url, elm)
ajax.update(url, elm)
  url = the url to query
  elm = the (name of the) element to update
  This function uses a GET request to query the specified url and insert the result into the specified element.

ajax.submitNoCache(url, elm, frm)
ajax.submit(url, elm, frm)
  url = the url to query
  elm = the (name of the) element to update
  frm = the form element to submit
  This function is typically used in the onsubmit handler of a function. The form is not submitted the usual way; the form is instead serialized using 'ajax.serialize' and submitted using 'ajax.post'. The result is then inserted into the specified element.
*/


/** CHANGES - by Michael Lowden
[2/27/2008 10:43 AM] 
Update the "serialize" function to get rid of risk of consecutive "&" symbols.  where "&&&&&&" may throw either an exception or a warning on some webservers (e.g. Tomcat).

[2/26/2008 4:47 PM]
Adapted it a little to handle for IE's stupid Caching issue when using AJAX:
I simply added the following functions:
  ajax.sendNoCache(url,func,method,args), not called by user, but called by some below functions.
  ajax.getNoCache(url, func)
  ajax.getsNoCache(url)
  ajax.postNoCache(url, func, args)
  ajax.updateNoCache(url, elm)
  ajax.submitNoCache(url, elm, frm)
*/

Upload a file using Ajax

This code is categorised as Ajax because it "fits within my definition of Ajax" as explained from the Ajax File Upload [openjs.com] article.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>File upload</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <script type="text/javascript">
    //<![CDATA[
      function init() {
	document.getElementById('file_upload_form').onsubmit=function() {
                                  //'upload_target' is the name of the iframe
	  document.getElementById('file_upload_form').target = 'upload_target'; 
	  }
  }
  window.onload=init;
    //]]>
    </script>
  </head>
  <body>
    <form id="file_upload_form" method="post" enctype="multipart/form-data" action="/p/file_upload.cgi">
    <input name="myfile" id="myfile" size="27" type="file" /><br />
    <input type="submit" name="action" value="Upload" /><br />
    <iframe id="upload_target" name="upload_target" src="" style="width:0;height:0;border:0px solid #fff;"></iframe>
    </form>
  </body>
</html>

Pull JavaScript code dynamically into your web page at run-time.

Using the JavaScript keyword Eval() with AJAX makes it possible to dynamically add JavaScript code at run-time to your web page.

Here's the complete code dynalert.html, dynalert.js, and dynalert.cgi

file:dynalert.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<title>dynalert</title>
		<meta http-equiv="Content-Type" content="type=text/html; charset=ISO-8859-1" />
		<script type="text/javascript" src="dynalert.js"></script>
	</head>

	<body>
<p id="i1">123 </p><input type="button" value="go" onclick="update()" />
	</body>
</html>


file: dynalert.js
function populatePage(results){
  eval(results);
}

//send the update
function update() {

	var strServer = "dynalert.cgi";
	url2 = "";
	SubmitRBData(strServer,"?" + url2);

}

function SubmitRBData(strUrl, strPostFields) {
	http.open("GET", strUrl + strPostFields, true);
	http.onreadystatechange = handleHttpResponse;
	http.send(null);
}
function handleHttpResponse() {

	if (http.readyState == 4) {
		if (http.status == 200)
		{
		results = http.responseText;
		populatePage(results); // string response
		}
	}

}

function getHTTPObject() {

	var objXMLHttp=null

	if (window.XMLHttpRequest)
	{
		objXMLHttp=new XMLHttpRequest()
	}
	else if (window.ActiveXObject)
	{
		objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
	}

return objXMLHttp

}

var http = getHTTPObject(); // We create the HTTP Object


file:dynalert.cgi
#!/usr/bin/ruby
# dynalert.cgi

require 'cgi'

cgi = CGI.new

#title = cgi['title']

puts "Content-Type: text/html"
puts
puts "function transcript(){ alert('and Bob said this idea might work.');}"
puts "alert('this is a success');"
puts "alert('we can now pass back anything we like');"
puts "transcript();"
puts "oNew = document.createElement('strong');"
puts "oNew.innerHTML = 'yes - this is bold text';"
puts "document.getElementById('i1').appendChild(oNew);"


Capturing the value from an HTML text box - Ajax style

This extract of JavaScript code illustrates how the value of a text box on an HTML form could be saved efficiently when used with AJAX.
<input type="text" name="proj1" id="proj1" value="Car_log" 
  onkeyup="timed_updateSummaryCRecord(event.keyCode, '1','project', this.value)" />

The onkeyup event retrieves the user input as soon as the key is pressed, then the event.keyCode is validated to ensure only alpha-numeric characters trigger the save routine.
function timed_updateSummaryCRecord(keyCode, parent_id, field,  val) {
  if (val.length > 0 && ((keyCode > 40) || (keyCode == 8)) ) {
    clearTimeout(t);
    t = setTimeout("updateSummaryCRecord('" + parent_id + "', '" + field + "', '" + val + "')", 1000);
  }
}

The setTimeout will trigger the save routine after 1 second, however if the user continues to type before the 1 second timer has elapsed, the running timer will be cancelled and the new timer will start.

Note: keyCode value '8' is accepted because it is the backspace key. It would also be helpful to accept the delete key press.

jQuery Maps Interface - Easily create Google or Yahoo maps

/* jQuery Maps (jmaps) - A jQuery plugin for Google Maps API
* Author: Tane Piper (digitalspaghetti@gmail.com)
* With special thanks Dave Cardwell (who helped on getting the first version of this plugin to work).
* Website: http://code.google.com/p/gmapp/
* Licensed under the MIT License: http://www.opensource.org/licenses/mit-license.php
* This plugin is not affiliated with Google or Yahoo.
* For Google Maps API and T&C see http://www.google.com/apis/maps/
* For Yahoo! Maps API and T&C see http://developer.yahoo.com/maps/
*
* === Changelog ===
* Version 1.3
* Added support for creating Yahoo! Maps, can create Map, Satallite or Hybrid. Check out available options below
* Added support for creating points on Yahoo! maps.
* Added support for creating Polylines on Yahoo! maps.
* Added support for GeoRSS files on both Yahoo! and Google maps, as well as existing KML support for Google, method
* name was changed from .addKml to .addRss
* Moved directions search out of main namespace, now function that is called from within plugin by providing fields
*
* Version 1.2 (25/07/2007)
* Moved GClientGeocoder into searchAddress method
* Fixed bug in searchAddress method regarding getPoint().
*
* Version 1.1 (16/07/2007)
* Changed name to remove Google from main name - namespace now .jmap.
* Added additional options:
* + Add map dragging enable/disable.
* + Add scroll wheel zooming.
* + Add smooth continuous zooming (on certain browsers).
* + Added clean unloading of Google objects.
* Added .addPoly method. Allows the creation of polylines on the map.
* Added .addKml support for rendering KML Files.
* Added .directions Driving Direction support.
*
* Version 1.0 (13/07/2007)
* Initial version.
* Creates Google Map.
* Add points to map.
* Takes address or postcode, Geocodes and centers map. Also creates a draggable marker.
*/


(function($) {
	/* function searchAddress(jmap, address, settings)
	 * This function is an internal plugin method that returns a GLatLng that can be passed
	 * to a Google map.
	 */
	function searchAddress(jmap, address, settings) {
		
		if (jmap._mapType) {
			alert('Yahoo Maps Geocoding not yet supported');
		}
		
		if (jmap.i.Au) {
			GGeocoder = new GClientGeocoder();
			GGeocoder.getLatLng(address, function(point){
				if (!point) {
					alert(address + " not found");
				} else {
					jmap.setCenter(point,settings.zoom);
					var marker = new GMarker(point, {draggable: true});
					jmap.addOverlay(marker);
					pointlocation = marker.getPoint();
					marker.openInfoWindowHtml("Latitude: " + pointlocation.lat() + "<br />Longitude: " + pointlocation.lng());
					GEvent.addListener(marker, "dragend", function(){
						mylocation = marker.getPoint();
						marker.openInfoWindowHtml("Latitude: " + pointlocation.lat() + "<br />Longitude: " + pointlocation.lng());			
					});
				}
			});
		}	
	}
	
	/* directions: function(map,query, panel)
	 * Takes a Direction query and returns directions for map.  Optional panel for text information
	 */
	function searchDirections(jmap,query,panel) {
		// Yahoo Maps
		if (jmap._mapType) {
			alert('Yahoo Directions support not yet added')	;
		}
		
		// Google Maps
		if (jmap.i.Au) {
			var dirpanel = document.getElementById(panel);
			directions = new GDirections(jmap, dirpanel);
			directions.load(query);
		}
	}

	$.fn.extend({
	/* jmap: function(settings)
	 * The constructor method
	 * Example: $().jmap();
	 */
	jmap: function(settings) {
		var version = "1.3";
		/* Default Settings*/	
		var settings = jQuery.extend({
			provider: "google",		// can be "google" or "yahoo"
			maptype: "hybrid",		// can be "map", "sat" or "hybrid"
			center: [55.958858,-3.162302],	// G + Y
			zoom: 12,				// G + Y
			controlsize: "small",	// G + Y
			showtype: true,			// G + Y
			showzoom: true,			// Y
			showpan: true,			// Y
			showoverview: true,		// G
			showscale: true,		// Y
			dragging: true,			// G + Y
			scrollzoom: true,		// G + Y
			smoothzoom: true,		// G
			searchfield: "#Address",
			searchbutton: "#findaddress",
			directionsto: "#to",
			directionsfrom: "#from",
			directionsfind: "#getDirections",
			directionspanel: "myDirections"
		},settings);
		
		return this.each(function(){
			switch(settings.provider)
			{
				case "yahoo":
					var jmap = this.jMap = new YMap(this);
					switch(settings.maptype) {
						case "map":
							var loadmap = YAHOO_MAP_REG;
							break;
						case "sat":
							var loadmap = YAHOO_MAP_SAT;
							break;
						default:
							var loadmap = YAHOO_MAP_HYB;
							break;
					}
					jmap.setMapType(loadmap);
					jmap.drawZoomAndCenter(new YGeoPoint(settings.center[0],settings.center[1]), settings.zoom);
					if (settings.showtype == true){
						jmap.addTypeControl();	// Type of map Control
					}
					if (settings.showzoom == true && settings.controlsize == "small" ){
						jmap.addZoomShort();	// Small zoom control
					}
					if (settings.showzoom == true && settings.controlsize == "large" ){
						jmap.addZoomLong();		// Large zoom control
					}
					if (settings.showpan == true) {
						jmap.addPanControl();	// Pan control
					}
					if (settings.showscale == false) {
						/* On by default */
						jmap.removeZoomScale();	// Show scale bars
					}
					if (settings.dragging == false) {
						/* On by default */
						jmap.disableDragMap();	// Is map draggable?
					}
					if (settings.scrollzoom == false) {
						/* On by default */
						jmap.disableKeyControls(); // Mousewheel and Keyboard control
					}
					break;
					
				case "mslive":
					alert('Microsoft Live Maps are currently not supported but planned for version 1.4')
					break;
					
				default:	
					var jmap = this.jMap = new GMap2(this);
					switch(settings.maptype) {
						case "map":
							var loadmap = G_NORMAL_MAP;
							break;
						case "sat":
							var loadmap = G_SATELLITE_MAP;
							break;
						default:
							var loadmap = G_HYBRID_MAP;
							break;
					}
					jmap.setCenter(new GLatLng(settings.center[0],settings.center[1]),settings.zoom,loadmap);
					switch(settings.controlsize)
					{
						case "small":
							jmap.addControl(new GSmallMapControl());
							break;
						case "large":
							jmap