Hi,
I am trying to make a round corners script in object oriented programming method. This is purely for learning purposes.
The script is no where near complete but I am already having problems with it.
I am trying out the techniques described in 'David Flanagan ' text book 'JavaScript: The Definitive Guide, 5th Edition'
This code is called from html page which once working will place a round container around element
*******Additional information**********
The selector parameter in Custom_rounded_container function is defined because only the else part of the if statement in Custom_rounded_container is executing.
I put this in because few people at other forums thought the problem was because of the selector parameter being undefined.
********************************
<script type="text/javascript">
//content//rounded_corners("navigation li", "#507742", "all_round");
Factory_rounded_corners("content", "#507742", "all_round", "one");
</script>/*content is id of element
* #507742 is color to be applied
* all_round means round corners will be applied on top and bottom of element
* one means only one element is to be affected
*/
***********External Javascript file*********************
/* Function Factory_rounded_corners
* -------------------------
* Parameter: selector
* Return: None
* Description: Create a rounded container around elements to be affected
*/
function Factory_rounded_corners(selector, color, type, numb_elem)
{
var rounded_container;
if(numb_elem == "one" && type == "all_round")
{
rounded_container = new All_rounded_corners_one_element(selector, color);
alert(rounded_container.color);//works
alert(rounded_container.temp_array); // works
rounded_container.elements_to_be_affected();//Does not work
}
}
/* Function All_rounded_corners
* -------------------------
* Parameter: selector
* Return: None
* Description: Create a rounded container around elements to be affected
*/
function All_rounded_corners_one_element(selector, color)
{
alert("Inside All_rounded_corners");
alert("color is " + " " +color);//works
alert("selector is " + " " + selector); //works
this.superclass(selector, color);
}
All_rounded_corners_one_element.prototype.superclass = Custom_rounded_container;
All_rounded_corners_one_element.prototype = new Custom_rounded_container(selector, color);
All_rounded_corners_one_element.prototype.constructor = All_rounded_corners_one_element;
/* Function custom_rounded_container
* ----------------------------------
* Parameters: selector
* Properties: this.temp_array
* Methods: this.elements_to_be_affected, this.apply
* Returns: Returns a object
* Description: selector parameter should be in two formats: id of element if only one element is to be affected ie: 'content'
or id of surrounding element and the tag of the elements to be affected, ie: 'content li'
*/
function Custom_rounded_container(selector, color)
{
if(selector == undefined)
{
alert("selector is undefined");
}
else
{
alert("selector is: " + " " + selector);
alert("Inside Custom_rounded_container");
}
this.temp_array = selector.split(" ");
this.color = color;
}
Custom_rounded_container.prototype.test = function()
{
alert("Inside test");
}
/* Function elements_to_be_affected
* ----------------------------------
* Parameters: None
* Properties: None
* Local variables: None
* Local methods: None
* Returns: elements in array or one element
* Description: Custom_rounded_container that retrieves elements to be affected
*/
Custom_rounded_container.prototype.elements_to_be_affected = function()
{
alert("Inside elements_to_be_affected");
//alert(this.temp_array.length);
//return = document.getElementById(this.temp_array[0]).getElementsByTagName(this.temp_array[1]);
/*
children_elements = function(parent_element)
{
switch(parent_element.nodeName)
{
case 'UL': return parent_element.getElementsByTagName("li");
}
}
*/
//return children_elements(parent_element[0]);
}