peterS.: generischer Ansatz für selbstgestrickte GUI-elemente

Beitrag lesen

hallo again Karl,

... Das mit den DOM-Knoten muss ich mir mal ansehen :-)

unbedingt.

fuer faelle, wie in dem von Dir beschriebenen, recycle
   ich immer noch folgendes grob skizzierte schema:

var DHTMLObject = function () {  
  
  this.constructor = arguments.callee;  
/*  
  minimal initial code if necessary like:  
  - private properties,  
  - privileged public methods.  
*/  
  this.compile.apply(this, arguments);  
};  
DHTMLObject.prototype.compile = function (obj) { // for reinitialization.  
  
  var regXClassName = (/\bdhtmlObject\b/);  
  if (obj && obj.nodeType && obj.nodeName && obj.className && (obj.nodeType == 1) && (regXClassName.test(obj.className))) {  
  
    this.node = obj;  
  /*  
    major part of constructor code that not necessarily  
    needs to be run by the constructor function itself.  
  */  
    var self = this;  
    this.node.onmousedown = function (evt) {  
      DHTMLObject.onMouseDown(evt, self);  
    };  
  }  
};  
  
  
DHTMLObject.onMouseDown = function (evtObj, dhtmlObj) {  
  
  evtObj = (window.event || evtObj);  
//some more code;  
};  
  
  
DHTMLObject.elements = [];  
  
  
DHTMLObject.initialize = function () {  
  
  if (window.opera && (DHTMLObject.elements.length >= 1)) {return;} // in order to fix the beneath mentioned opera 9 "onload" bug.  
  
  if (typeof document.getElementsByClassNames == "function") {  
  
    var i, obj, arr = document.getElementsByClassNames("dhtmlObject");  
    for (i=0; i<arr.length; ++i) {  
  
      obj = arr[i];  
      if (obj && (obj.nodeType == 1)) {  
  
        DHTMLObject.elements[DHTMLObject.elements.length] = new DHTMLObject(obj);  
      }  
    }  
  }  
//alert("DHTMLObject.elements[" + (DHTMLObject.elements.length - 1) + "] : " + DHTMLObject.elements[DHTMLObject.elements.length - 1]);  
};  
  
  
if (window.addEventListener) {  
  window.addEventListener("load", DHTMLObject.initialize, true); // opera 9 behaves buggy on this - workaround got implied.  
} else if (window.attachEvent) {  
  window.attachEvent("onload", DHTMLObject.initialize);  
}

dabei geht mein Dank wie immer an Dr. Thomas Meinike fuer seine
   pioniertat zu einem "getElementsByClassName", das mir seit dieser
   zeit als angepasstes "document.getElementsByClassNames" stets
   treue dienste leistet.

letztgenanntes modul benoetigt wiederum die unterstuetzung der
   Array-methode "contains", die fuer nicht-gecko-getriebene browser
   immer noch nachgeruestet werden muss:
   schon ziemlich alt - http://www.pseliger.de/jsExtendedApi/jsApi.Array.contains.dev.js,
   nicht mehr so neu - http://www.pseliger.de/jsExtendedApi/jsApi.Array.mozExtensions.js.

eine entwicklungsseite verlinkt dann nur noch diese javascript-dateien zusammen mit
   ein paar stylesheet-angaben. im html-quelltext selber werden die zu initialisierenden
   [DHTMLObject]-objekte ueber den klassennamen des entsprechenden DOM-Knotens aufgespuert.
   in diesem fall muesste man einfach <[nodename] class="... dhtmlObject ..." /> schreiben.

dieses grundpaket versetzt zumindest mich in die lage, innerhalb von wenigen minuten
   eine vernuenftige arbeitsgrundlage fuer selbstzustrickende GUI-elemente zu schaffen.

by(t)e by(t)e - peterS. - pseliger@gmx.net

--
"Because objects in JavaScript are so flexible, you will want to think differently about class hierarchies.
Deep hierarchies are inappropriate. Shallow hierarchies are efficient and expressive." - Douglas Crockford
ie:( fl:) br:> va:( ls:& fo:) rl:| n3;} n4:} ss:} de:µ js:} mo:? zu:]