/**************************************************************** ** Licensed Materials - Property of IBM ** ** IBM Cognos Products: mdsrv ** ** (C) Copyright IBM Corp. 2008, 2015 ** ** US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp. *****************************************************************/ //*********************************************************************************************** // Copyright (C) 2008 Cognos ULC, an IBM Company. All rights reserved. // Cognos (R) is a trademark of Cognos ULC, (formerly Cognos Incorporated). // // Component: GDI //*********************************************************************************************** //*********************************************************************************** // GDI class //*********************************************************************************** function gdi ( id_canvas, zoom ) { ASSERT( id_canvas, "gdi: id_canvas is NOT valid !" ); ASSERT( zoom, "gdi: zoom is NOT valid !" ); // id must be the name/id of a container tag such as div. this.id = id_canvas; this.zoom = zoom || 100; this.zoomFactor = this.zoom / 100; this.htm = ""; var temp = 0; if (document.documentElement.clientHeight == 0) temp = typeof document.body.insertAdjacentHTML != "undefined" && document.createElement; else temp = typeof document.documentElement.insertAdjacentHTML != "undefined" && document.createElement; this.ie = temp; this.canvas = document.getElementById (id_canvas); this.buf = new CStringBuffer(); // setInterval ("Animation.animate ()", 50); this.setCanvas = function (id) { this.canvas = document.getElementById (id); } this.setZoom = function (zoom) { this.zoom = zoom; this.zoomFactor = this.zoom / 100; } this.getZoom = function () { return this.zoom; } this.init = function () { this.canvas.innerHTML = ""; } this.startContainer = function ( className, x, y, width, height, sId, sOverflow, sTooltip ) { if ( typeof sOverflow == "undefined" ) sOverflow = "hidden"; this.buf.append( '
' ); } this.addText = function ( sText ) { var escapedText = escapeHTML ( sText ); this.buf.append( escapedText ); } this.endContainer = function () { this.buf.append( '<\/div>' ); } this.divBackground = function ( className, x, y, width, height, sId ) { this.buf.append( '
<\/div>' ); } this.refresh = function () { this.htm = this.buf.toString(); if ( this.ie ) { // moves the content into the container canvas (Internet Explorer) this.canvas.insertAdjacentHTML ( "BeforeEnd", this.htm ); } else { var range = document.createRange (); range.setStartBefore ( this.canvas ); range = range.createContextualFragment ( this.htm ); this.canvas.appendChild ( range ); } this.buf.cleanUp(); } this.refreshObject = function ( id ) { var elem = document.getElementById ( id ); if ( elem ) { elem.innerHTML = ''; this.htm = this.buf.toString(); if ( this.ie ) { elem.insertAdjacentHTML ( "BeforeEnd", this.htm ); } else { var range = document.createRange (); range.setStartBefore ( elem ); range = range.createContextualFragment ( this.htm ); elem.appendChild ( range ); elem.innerHTML = this.htm; } //elem.style.display = "none"; //elem.style.display = "block"; } this.buf.cleanUp(); } this.drawArrowLeft = function ( color, xArrowTip, yArrowTip, sPenStyle, nSize ) { sPenStyle = 'solid'; this.drawHorzLine ( color, 1, sPenStyle, xArrowTip, yArrowTip, nSize ); // Center line for ( var i = 1; i <= nSize/2; i++ ) { this.drawHorzLine ( color, 1, sPenStyle, xArrowTip + i*2, yArrowTip - i, nSize - i*2 + 1 ); this.drawHorzLine ( color, 1, sPenStyle, xArrowTip + i*2, yArrowTip + i, nSize - i*2 + 1 ); } } this.drawArrowRight = function ( color, xArrowTip, yArrowTip, sPenStyle, nSize ) { for ( var i = 1; i <= nSize/2; i++ ) { this.drawHorzLine ( color, 1, sPenStyle, xArrowTip - nSize - 1, yArrowTip - i, nSize - i*2 + 1 ); this.drawHorzLine ( color, 1, sPenStyle, xArrowTip - nSize - 1, yArrowTip + i, nSize - i*2 + 1 ); } } this.drawArrowUp = function ( color, xArrowTip, yArrowTip, sPenStyle, nSize ) { for ( var i = 1; i <= nSize/2; i++ ) { this.drawVertLine ( color, 1, sPenStyle, xArrowTip - i, yArrowTip + i*2, nSize - i*2 + 1 ); this.drawVertLine ( color, 1, sPenStyle, xArrowTip + i, yArrowTip + i*2, nSize - i*2 + 1 ); } } this.drawArrowDown = function ( color, xArrowTip, yArrowTip, sPenStyle, nSize ) { sPenStyle = 'solid'; this.drawVertLine ( color, 1, sPenStyle, xArrowTip, yArrowTip - nSize - 1, nSize ); // Center line for ( var i = 1; i <= nSize/2; i++ ) { this.drawVertLine ( color, 1, sPenStyle, xArrowTip - i, yArrowTip - nSize - 1, nSize - i*2 + 1 ); this.drawVertLine ( color, 1, sPenStyle, xArrowTip + i, yArrowTip - nSize - 1, nSize - i*2 + 1 ); } } this.fillRectangle = function ( color, x, y, width, height, opacity, extra ) { this.div ( color, x, y, width, height, '', opacity, extra ); } this.drawHorzLine = function ( color, penWidth, penStyle, x, y, width ) { this.divLine ( color, x, y, width, penWidth, penStyle, penWidth, '', '', 'horzLine' ); } this.drawHorzLineToPoint = function ( color, penWidth, penStyle, point1, point2 ) { if ( point1.x == point2.x ) return; // The first point should always be on the left if ( point1.x > point2.x ) { var pointSwap = point1; point1 = point2; point2 = pointSwap; } var length = point2.x - point1.x; this.divLine ( color, point1.x, point1.y, length, penWidth, penStyle, penWidth, '', '', 'horzLine' ); } this.drawVertLine = function ( color, penWidth, penStyle, x, y, height ) { this.divLine ( color, x, y, penWidth, height, penStyle, penWidth, '', '', 'vertLine' ); } this.drawVertLineToPoint = function ( color, penWidth, penStyle, point1, point2 ) { if ( point1.y == point2.y ) return; // The first point should always be on the top if ( point1.y > point2.y ) { var pointSwap = point1; point1 = point2; point2 = pointSwap; } var height = point2.y - point1.y + penWidth; this.divLine ( color, point1.x, point1.y, penWidth, height, penStyle, penWidth, '', '', 'vertLine' ); } this.drawVertAngledLineToPoint = function ( color, penWidth, penStyle, point1, point2, nElbowOffset ) { if ( ! point1 || ! point2 ) return; if ( point1.y == point2.y ) return; // The first point should always be on the top var ptArrow = point2; if ( point1.y > point2.y ) { var pointSwap = point1; point1 = point2; point2 = pointSwap; ptArrow = point1; } var nOffset = point2.y - point1.y; var xStep = point1.x - 20 - nElbowOffset; var ptStep = new CPoint ( xStep, point1.y + ( point2.y - point1.y ) / 2 ); var ptStep1 = new CPoint ( xStep, point1.y ); var ptStep2 = new CPoint ( xStep, point2.y ); this.drawHorzLineToPoint ( color, penWidth, penStyle, point1, ptStep1 ); this.drawVertLineToPoint ( color, penWidth, penStyle, ptStep1, ptStep2 ); this.drawHorzLineToPoint ( color, penWidth, penStyle, ptStep2, point2 ); this.drawArrowRight ( color, ptArrow.x, ptArrow.y, penStyle, DG.graphDefaults.nArrowSize ); } this.drawLinePointToPoint = function ( color, penWidth, penStyle, pt1, pt2, nElbowOffset ) { var point1 = pt1; var point2 = pt2; if ( point1 == point2 ) return; // The first point should always be on the left if ( point1.x > point2.x ) { var pointSwap = point1; point1 = point2; point2 = pointSwap; } // By now point1 is guaranteed to be on the left // point1.x += 1; if ( DG.graphDefaults.bUseShadows ) point1.x += DG.graphDefaults.nShadowWidth - 1; if ( point1.y == point2.y ) { this.drawHorzLineToPoint ( color, penWidth, penStyle, point1, point2 ); return; } var xStep = point1.x + ( point2.x - point1.x ) / 2; xStep = Math.max ( point1.x + DG.graphDefaults.nArrowSize + 5, xStep - nElbowOffset ); var ptStep1 = new CPoint ( xStep, point1.y ); var ptStep2 = new CPoint ( xStep, point2.y ); this.drawHorzLineToPoint ( color, penWidth, penStyle, point1, ptStep1 ); this.drawVertLineToPoint ( color, penWidth, penStyle, ptStep1, ptStep2 ); this.drawHorzLineToPoint ( color, penWidth, penStyle, ptStep2, point2 ); } this.addId = function ( sId ) { if ( typeof sId != "undefined" && sId.length > 0 ) { this.buf.append( ' id=' ); this.buf.append( sId ); } } this.addTooltip = function ( sTooltip ) { if ( typeof sTooltip != "undefined" && sTooltip.length > 0 ) { this.buf.append( ' alt="' ); // For tooltip support in Internet Explorer this.buf.append( sTooltip ); this.buf.append( '"' ); this.buf.append( ' title="' ); // For tooltip support in other browsers this.buf.append( sTooltip ); this.buf.append( '"' ); } } this.addOpacity = function ( opacity ) { if ( typeof opacity != "undefined" ) { if ( this.ie ) { this.buf.append( 'filter:alpha(opacity=' ); this.buf.append( opacity * 100 ); this.buf.append( ');' ); } else { this.buf.append( 'opacity:' ); this.buf.append( opacity ); this.buf.append( ';' ); } } // This is equal to one-liner: // this.buf.append( (this.ie ? 'filter:alpha(opacity=' + opacity*100 + ');' : 'opacity:' + opacity + ';') ); } this.drawImageImpl = function ( image, className, x, y, width, height, sId, sTooltip ) { this.buf.append( '
' ); this.buf.append( '<\/div>' ); /* var elemHtml = '
-1 ? 'z-index:' + zIndex + ';' : '') + '">' + '<\/div>'; */ } this.drawIcon = function ( image, x, y, width, height, id, sTooltip ) { this.drawImageImpl ( image, 'classIconType', x, y, width, height, id, sTooltip ); } this.drawActionIcon = function ( image, x, y, width, height, id, sTooltip ) { this.drawImageImpl ( image, 'classIconAction', x, y, width, height, id, sTooltip ); } this.drawBackgroundImage= function ( image, x, y, width, height, id ) { this.drawImageImpl ( image, 'classBkImage', x, y, width, height, id ); } /* * drawCaptionRect - intended to draw a caption rect with the bottom border only, * the image background, an icon at the left & the text aligned * alongside to the icon. * This one function will replace three others: * - gdi.drawBackgroundImage * - gdi.drawHorzLine * - gdi.drawString */ this.drawCaptionRect = function ( idRect, className, text, x, y, width, height, penWidth, image ) { var rectWidth = width - penWidth + 2; var rectHeight = height - penWidth + 2; if ( ! this.ie ) // for Firefox { rectWidth -= ( penWidth + 1 ); rectHeight -= ( penWidth + 1 ); } this.buf.append( '
' ); this.buf.append( '' ); this.buf.append( text ); this.buf.append( '<\/div>' ); /* this.htm += '
' + '' + text + '<\/div>'; */ } this.drawRectangle = function ( color, x, y, width, height, sBorderStyle, penWidth, idRect ) { var rectWidth = width - penWidth + 2; var rectHeight = height - penWidth + 2; if ( ! this.ie ) // for Firefox { rectWidth -= ( penWidth + 1 ); rectHeight -= ( penWidth + 1 ); } this.divLine ( color, x, y, rectWidth, rectHeight, sBorderStyle, penWidth, '', idRect ); } this.drawString = function ( sText, color, x, y, width, height, font, size, style, sId, sTooltip ) { var escapedText = escapeHTML( sText ); var colorText = typeof color == "string" ? color : color.rgb; var opacity = color.opacity; var font_used = font != "" ? font : "verdana,geneva,helvetica,sans-serif"; var fontStyle = getFontStyle (style); this.buf.append( '
' ); this.buf.append( escapedText ); this.buf.append( '<\/div>' ); /* this.htm += '
' + escapedText + '<\/div>'; */ } this.moveObject = function ( elem, x, y ) { var domElem = elem; if ( typeof elem == "string" ) domElem = document.getElementById( elem ); domElem.style.left = x * this.zoomFactor + 'px'; domElem.style.top = y * this.zoomFactor + 'px'; } this.resizeObject = function ( elem, width, height ) { var domElem = elem; if ( typeof elem == "string" ) domElem = document.getElementById( elem ); domElem.style.width = width * this.zoomFactor; domElem.style.height= height * this.zoomFactor; } // Private methods this.div = function ( color, x, y, width, height, sBorderStyle, opacity, extra ) { var colorBk = typeof color == "string" ? color : color.rgb; x = x * this.zoomFactor; y = y * this.zoomFactor; width = width * this.zoomFactor; height = height * this.zoomFactor; if ( width < 1 ) width = 1; if ( height < 1 ) height = 1; this.buf.append( '
<\/div>' ); /* var sBkColor = 'background-color:' + colorBk + ';'; var sBorderString = sBorderStyle ? 'border-style:' + sBorderStyle + ';' : ''; this.htm += '
<\/div>'; */ } this.divLine = function ( color, x, y, width, height, sBorderStyle, nBorderWidth, opacity, sId, extra ) { var colorBorder = typeof color == "string" ? color : color.rgb; x = x * this.zoomFactor; y = y * this.zoomFactor; width = width * this.zoomFactor; height = height * this.zoomFactor; if ( width < 1 ) width = 1; if ( height < 1 ) height = 1; var sBorderString = ''; var sBkColor = 'background-color: transparent;'; var sLineHack = 'font-size: 0px;'; // A hack to correctly render lines in IE6 if ( sBorderStyle ) { // special sBorderStyle values are to be set by line drawing methods if ( extra == 'horzLine' ) { sBorderString = 'border-color:' + colorBorder + ';' + 'border-style:' + sBorderStyle + ';'; sBorderString += 'border-left-width: 0px;' + 'border-top-width: ' + height + 'px;'; sBorderString += 'border-right-width: 0px;' + 'border-bottom-width: 0px;'; } else if ( extra == 'vertLine' ) { sBorderString = 'border-color:' + colorBorder + ';' + 'border-style:' + sBorderStyle + ';'; sBorderString += 'border-left-width: ' + width + 'px;' + 'border-top-width: 0px;'; sBorderString += 'border-right-width: 0px;' + 'border-bottom-width: 0px;'; } else { sBorderString = 'border-style:' + sBorderStyle + ';' + 'border-width:' + nBorderWidth + ';'; } } this.buf.append( '
<\/div>' ); } this.drawPixel = function ( color, x, y, opacity ) { this.div ( color, x, y, 1, 1, '', opacity ); } function getFontStyle ( style ) { fontStyle = ""; if (typeof style == "undefined") return fontStyle; if (style.search (/bold/i) >= 0) fontStyle += "font-weight:bold;"; if (style.search (/italic/i) >= 0) fontStyle += "font-style:italic;"; return fontStyle; } }