How to use the basis.cssom.setStyle function in basis

if (rectNode.nodeType == 3) {
      rectNode = document.createRange();
      rectNode.selectNodeContents(target.node);
    }

    rect = getBoundingRect(rectNode);

    if (rect) {
      var style = {
        left: rect.left + 'px',
        top: rect.top + 'px',
        width: rect.width + 'px',
        height: rect.height + 'px'
      };
      setStyle(overlay, style);
      setStyle(boxElement, style);
      document.body.appendChild(overlay);
      document.body.appendChild(boxElement);
    }
  } else {
    domUtils.remove(overlay);
    domUtils.remove(boxElement);
    inspectDepth = 0;
  }

  nodeInfoPopup().update({
    node: target && target.node,
    instance: target && target.instance
  });
}, true);

var tokenElements = document.createDocumentFragment();
  var min = Infinity;
  var max = -Infinity;

  for (var i = 0, data; data = elements[i]; i++)
  {
    min = Math.min(min, data.updates);
    max = Math.max(max, data.updates);
  }

  for (var i = 0, data; data = elements[i]; i++)
  {
    var temp = max != min ? 1 - ((data.updates - min) / (max - min)) : 1;
    var bgColor = 'rgba(' + [255 - parseInt(128 * temp), parseInt(temp * 255), 0].join(',') + ', .4)';
    var borderColor = 'rgba(' + [200 - parseInt(128 * temp), parseInt(temp * 200), 0].join(',') + ', .75)';
    data.element = tokenElements.appendChild(setStyle(tokenDomProto.cloneNode(false), {
      backgroundColor: bgColor,
      outline: '1px solid ' + borderColor,
      top: data.rect.top + 'px',
      left: data.rect.left + 'px',
      width: data.rect.width + 'px',
      height: data.rect.height + 'px'
    }));
    data.element.appendChild(document.createTextNode(data.updates == 1 ? '' : data.updates));
  }

  overlayContent.appendChild(tokenElements);

  if (!keepOverlay)
    document.body.appendChild(overlay);
}

hover: function(id) {
        if (dom.map.hasOwnProperty(id)) {
          var rectNode = dom.map[id];
          var rect;

          if (rectNode.nodeType == 3) {
            rectNode = document.createRange();
            rectNode.selectNodeContents(dom.map[id]);
          }

          rect = getBoundingRect(rectNode);

          if (rect) {
            setStyle(overlay, {
              left: rect.left + 'px',
              top: rect.top + 'px',
              width: rect.width + 'px',
              height: rect.height + 'px'
            });
            document.body.appendChild(overlay);
          }
        } else {
          domUtils.remove(overlay);
        }
      }
    });

if (rectNode.nodeType == 3) {
          rectNode = document.createRange();
          rectNode.selectNodeContents(target.node);
        }

        rect = getBoundingRect(rectNode);

        if (rect) {
          var style = {
            left: rect.left + 'px',
            top: rect.top + 'px',
            width: rect.width + 'px',
            height: rect.height + 'px'
          };
          setStyle(overlay, style);
          setStyle(boxElement, style);
          document.body.appendChild(overlay);
          document.body.appendChild(boxElement);
        }
      } else {
        domUtils.remove(overlay);
        domUtils.remove(boxElement);
        inspectDepth = 0;
      }

      nodeInfoPopup().update({
        node: target && target.node,
        instance: target && target.instance
      });
    }
  }

realign: function(){
      this.setZIndex(this.zIndex);
      if (this.tmpl && this.autocenter)
      {
        cssom.setStyle(this.element,
          this.element.offsetWidth
            ? {
                left: '50%',
                top: '50%',
                marginLeft: -this.element.offsetWidth / 2 + 'px',
                marginTop: -this.element.offsetHeight / 2 + 'px'
              }
            : {
                left: 0,
                top: 0,
                margin: 0
              }
        );
      }
    },
    activate: function(){

if (rectNode.nodeType == 3) {
      rectNode = document.createRange();
      rectNode.selectNodeContents(target.node);
    }

    rect = getBoundingRect(rectNode);

    if (rect) {
      var style = {
        left: rect.left + 'px',
        top: rect.top + 'px',
        width: rect.width + 'px',
        height: rect.height + 'px'
      };
      setStyle(overlay, style);
      setStyle(boxElement, style);
      document.body.appendChild(overlay);
      document.body.appendChild(boxElement);
    }
  } else {
    domUtils.remove(overlay);
    domUtils.remove(boxElement);
    inspectDepth = 0;
  }

  nodeInfoPopup().update({
    node: target && target.node,
    instance: target && target.instance
  });
}, true);

rectNode = document.createRange();
          rectNode.selectNodeContents(tmpl.el);
        }

        rect = getBoundingRect(rectNode);

        if (rect)
        {
          var style = {
            left: rect.left + 'px',
            top: rect.top + 'px',
            width: rect.width + 'px',
            height: rect.height + 'px'
          };
          setStyle(overlay, style);
          setStyle(boxElement, style);
          document.body.appendChild(overlay);
          document.body.appendChild(boxElement);
        }
      }
      else
      {
        domUtils.remove(overlay);
        domUtils.remove(boxElement);
        inspectDepth = 0;
      }

      nodeInfoPopup().update({
        tmpl: view,
        object: view
      });
    }

var scrollPosition = this.getScrollbarPosition();

          if (scrollPosition > 1)
            scrollPosition = 1 + (scrollPosition - 1) * 3;
          if (scrollPosition < 0)
            scrollPosition *= 3;

          var startPosition = Math.max(0, Math.min(this.trackSize  * scrollPosition, this.scrollbarSize - 4));
          var endPosition = Math.max(0, Math.min(this.trackSize - this.trackSize  * scrollPosition, this.scrollbarSize - 4));

          var style = {};
          style[this.startProperty] = startPosition + 'px';
          style[this.endProperty] = endPosition + 'px';

          cssom.setStyle(this.tmpl.trackElement, style);
        }
      }