WebGL not rendering may be related to warning - webgl

I am rather new to OpenGL and trying to learn a little WebGl. I came across a tutorial that, while great, appears to be a bit dated. I implemented my own version of this example in a Plunkr. I left out the square on purpose, however, once I have everything wired I do not see the triangle. I found a warning in the console...
WARNING: Attribute 0 is disabled. This has signficant performance penalty
And there is another SO question that seems to be similar but looking through the diff I can't get it to work and I can't get what he is saying to click. Here is my drawing code for reference...
drawScene() {
this.gl.viewport(0, 0, this.gl.viewportWidth, this.gl.viewportHeight);
this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);
mat4.perspective(45, this.gl.viewportWidth / this.gl.viewportHeight, 0.1, 100.0, this.pMatrix);
mat4.identity(this.mvMatrix);
mat4.translate(this.mvMatrix, this.mvMatrix, [-1.5, 0.0, -7.0]);
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.triangleVertexPositionBuffer);
this.gl.vertexAttribPointer(this.shaderProgram.vertexPositionAttribute, this.triangleVertexPositionBuffer.itemSize, this.gl.FLOAT, false, 0, 0);
this.setMatrixUniforms();
this.gl.drawArrays(this.gl.TRIANGLES, 0, this.triangleVertexPositionBuffer.numItems);
}
Does anyone have experiance here that can help guide a newbie?

So going back through this link helped a lot. One thing to consider is it doesn't talk about the glUtils js file they import so yeah that is needed. It seems that what the warning message is referring to is the need in newer versions to be explicit about params for the shader. Here is an example plnkr you will notice this is different...
// NEEDED to prevent warning
this.vertexPositionAttribute = this.gl.getAttribLocation(this.shaderProgram, "aVertexPosition");
this.gl.enableVertexAttribArray(this.vertexPositionAttribute);
When I set my shader attributes this way I avoid the warning!

Related

Gmod Lua HUDPaint Script not showing attempted change to HUD using Draw Functions, Why?

I've been learning how to influence HUDs and use draw functions on Gmod but whenever I try running any code relying on a 2d rendering context hook like HUDPaint it doesn't seem to work. There's no error that appears but there's also no drawing or any change to the HUD. Here's my code:
function test()
surface.SetDrawColor( 0, 0, 0, 120 )
surface.DrawRect( 50, 50, 128, 128 )
end
hook.Add("HUDPaint", "HUDPaint_DrawABox", test)
I'm not sure if it's a problem with HUDPaint, or the function I'm using to draw(test). My best guess is that it has something to do with HUDPaint being a server-side script, as I haven't yet used any code that is specifically server-side. I've been attempting to run this code in the normal singleplayer Gmod instance, which has worked so far for me when I've used other scripts.
HUDPaint is client-side, as are all rendering hooks.
Where are you placing the lua file for this?
It should be placed in addons/YOUR ADDON NAME/lua/autorun/client
Also, it's more standard convention to use draw.RoundedBox https://wiki.facepunch.com/gmod/draw.RoundedBox
(As you don't want to be setting a suface draw color unnecessarily if you can help it)

attachShadow vs createShadowRoot

I read in mozilla doc, Element.createShadowRoot() is deprecated:
This method has been deprecated in favor of attachShadow.
But in my canary: chrome 49.0.2599.0
thats work:
var shadow = document.getElementById("node-sh").createShadowRoot();
And thats not work
var shadow = document.getElementById("node-sh").attachShadow({mode: 'closed'});
Anyone know what's right?
createShadowRoot() is the old way of attaching a shadow-root to host element. It was proposed in initial spec, which has then been deprecated in favor of
attachShadow.
Spec also has been updated.
But, new API hasn't been standardized and none of the browsers currently support it. So I would suggest to stick to createShadowRootfor now. Once you start getting browser warnings for deprecation, that would be the time to move to attachShadow.

Migrating from Z3 Version 3.2 to Version 4.0

I am migrating from Z3 version 3.2 to version 4.0.
However, the code which was working earlier, no longer works directly and I am trying to find out the reasons for the same. I reduced the entire code to a very simple declaration and assertion, still it won't work. The code is -
long intSort = Z3_mk_int_sort (context);
long periodDeclStr = Z3_mk_string_symbol(context, "period");
long periodVar = Z3_mk_const(context, periodDeclStr, intSort);
long solver = z3_mk_solver();
long zero = Z3_mk_int (context, 0, intSort);
long eqSt = Z3_mk_eq(context, periodVar, zero);
Z3_solver_assert (context, solver, eqSt);
The problem is with the second last statement Z3_mk_eq()
I receive the error as -
WARNING: invalid function application, sort mismatch on argument at position 2
WARNING: (define = arith arith Bool) applied to:
period of sort arith
0::Int of sort Int
My Questions are as follows -
How to debug this error? This is still working with version 3.2, without solver though.
Is it necessary that I must create solver only after I finished adding variables to the context? Can I add variables to the context after creating the solver? Or I have to re-create the solver?
Sorry for the trouble. I was mixing up solver and context to pass them to the solver.
However, the problem still remains the unsolved.
I am having a crash in Z3_ast_to_String() API.
I will try to resolve the problem and post the update.
There is an interaction log now with Z3 4.0 that records the API interaction precisely.
It should be possible use this feature to debug the JNI layering and the bugs you find.
The log is opened using Z3_open_log().
You should open the log before creating any contexts.
You can close the log at any point as well (Z3_close_log()) if you only want to capture a subset of the interaction. You can replay the log by giving the the suffix ".log" and run Z3 on it.
Alternatively, you can run Z3 with the option /log, that is, "Z3.exe /log " to replay the interaction.
Don't you want Z3_mk_eq(context, id, zero) instead of Z3_mk_eq(context, periodDecl, zero)?

jquery-1.5.1.min.js and IE8

IE8 gives an error from jquery 1.5.1 minimized: Invalid argument, but firefox doesn't.
The error comes from this line:w
a.elem.style&&a.elem.style[a.prop]!=null?a.elem.style[a.prop]=(a.prop==="width"||a.prop==="height"?Math.max(0,a.now):a.now)+a.unit:a.elem[a.prop]=a.now}}}),d.expr&&d.expr.filters&&(d.expr.filters.animated=function(a){return d.grep(d.timers,function(b){return a===b.elem}).length});var ce=/^t(?:able|d|h)$/i,cf=/^(?:body|html)$/i;"getBoundingClientRect"in c.documentElement?d.fn.offset=function(a){var b=this[0],c;if(a)return this.each(function(b){d.offset.setOffset(this,a,b)});if(!b||!b.ownerDocument)return null;if(b===b.ownerDocument.body)return d.offset.bodyOffset(b);try{c=b.getBoundingClientRect()}catch(e){}var f=b.ownerDocument,g=f.documentElement;if(!c||!d.contains(g,b))return c?{top:c.top,left:c.left}:{top:0,left:0};var h=f.body,i=cg(f),j=g.clientTop||h.clientTop||0,k=g.clientLeft||h.clientLeft||0,l=i.pageYOffset||d.support.boxModel&&g.scrollTop||h.scrollTop,m=i.pageXOffset||d.support.boxModel&&g.scrollLeft||h.scrollLeft,n=c.top+l-j,o=c.left+m-k;return{top:n,left:o}}:d.fn.offset=function(a){var b=this[0];if(a)return this.each(function(b){d.offset.setOffset(this,a,b)});if(!b||!b.ownerDocument)return null;if(b===b.ownerDocument.body)return d.offset.bodyOffset(b);d.offset.initialize();var c,e=b.offsetParent,f=b,g=b.ownerDocument,h=g.documentElement,i=g.body,j=g.defaultView,k=j?j.getComputedStyle(b,null):b.currentStyle,l=b.offsetTop,m=b.offsetLeft;while((b=b.parentNode)&&b!==i&&b!==h){if(d.offset.supportsFixedPosition&&k.position==="fixed")break;c=j?j.getComputedStyle(b,null):b.currentStyle,l-=b.scrollTop,m-=b.scrollLeft,b===e&&(l+=b.offsetTop,m+=b.offsetLeft,d.offset.doesNotAddBorder&&(!d.offset.doesAddBorderForTableAndCells||!ce.test(b.nodeName))&&(l+=parseFloat(c.borderTopWidth)||0,m+=parseFloat(c.borderLeftWidth)||0),f=e,e=b.offsetParent),d.offset.subtractsBorderForOverflowNotVisible&&c.overflow!=="visible"&&(l+=parseFloat(c.borderTopWidth)||0,m+=parseFloat(c.borderLeftWidth)||0),k=c}if(k.position==="relative"||k.position==="static")l+=i.offsetTop,m+=i.offsetLeft;d.offset.supportsFixedPosition&&k.position==="fixed"&&(l+=Math.max(h.scrollTop,i.scrollTop),m+=Math.max(h.scrollLeft,i.scrollLeft));return{top:l,left:m}},d.offset={initialize:function(){var a=c.body,b=c.createElement("div"),e,f,g,h,i=parseFloat(d.css(a,"marginTop"))||0,j="<div style='position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;'><div></div></div><table style='position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;' cellpadding='0' cellspacing='0'><tr><td></td></tr></table>";d.extend(b.style,{position:"absolute",top:0,left:0,margin:0,border:0,width:"1px",height:"1px",visibility:"hidden"}),b.innerHTML=j,a.insertBefore(b,a.firstChild),e=b.firstChild,f=e.firstChild,h=e.nextSibling.firstChild.firstChild,this.doesNotAddBorder=f.offsetTop!==5,this.doesAddBorderForTableAndCells=h.offsetTop===5,f.style.position="fixed",f.style.top="20px",this.supportsFixedPosition=f.offsetTop===20||f.offsetTop===15,f.style.position=f.style.top="",e.style.overflow="hidden",e.style.position="relative",this.subtractsBorderForOverflowNotVisible=f.offsetTop===-5,this.doesNotIncludeMarginInBodyOffset=a.offsetTop!==i,a.removeChild(b),a=b=e=f=g=h=null,d.offset.initialize=d.noop},bodyOffset:function(a){var b=a.offsetTop,c=a.offsetLeft;d.offset.initialize(),d.offset.doesNotIncludeMarginInBodyOffset&&(b+=parseFloat(d.css(a,"marginTop"))||0,c+=parseFloat(d.css(a,"marginLeft"))||0);return{top:b,left:c}},setOffset:function(a,b,c){var e=d.css(a,"position");e==="static"&&(a.style.position="relative");var f=d(a),g=f.offset(),h=d.css(a,"top"),i=d.css(a,"left"),j=e==="absolute"&&d.inArray("auto",[h,i])>-1,k={},l={},m,n;j&&(l=f.position()),m=j?l.top:parseInt(h,10)||0,n=j?l.left:parseInt(i,10)||0,d.isFunction(b)&&(b=b.call(a,c,g)),b.top!=null&&(k.top=b.top-g.top+m),b.left!=null&&(k.left=b.left-g.left+n),"using"in b?b.using.call(a,k):f.css(k)}},d.fn.extend({position:function(){if(!this[0])return null;var a=this[0],b=this.offsetParent(),c=this.offset(),e=cf.test(b[0].nodeName)?{top:0,left:0}:b.offset();c.top-=parseFloat(d.css(a,"marginTop"))||0,c.left-=parseFloat(d.css(a,"marginLeft"))||0,e.top+=parseFloat(d.css(b[0],"borderTopWidth"))||0,e.left+=parseFloat(d.css(b[0],"borderLeftWidth"))||0;return{top:c.top-e.top,left:c.left-e.left}},offsetParent:function(){return this.map(function(){var a=this.offsetParent||c.body;while(a&&(!cf.test(a.nodeName)&&d.css(a,"position")==="static"))a=a.offsetParent;return a})}}),d.each(["Left","Top"],function(a,c){var e="scroll"+c;d.fn[e]=function(c){var f=this[0],g;if(!f)return null;if(c!==b)return this.each(function(){g=cg(this),g?g.scrollTo(a?d(g).scrollLeft():c,a?c:d(g).scrollTop()):this[e]=c});g=cg(f);return g?"pageXOffset"in g?g[a?"pageYOffset":"pageXOffset"]:d.support.boxModel&&g.document.documentElement[e]||g.document.body[e]:f[e]}}),d.each(["Height","Width"],function(a,c){var e=c.toLowerCase();d.fn["inner"+c]=function(){return this[0]?parseFloat(d.css(this[0],e,"padding")):null},d.fn["outer"+c]=function(a){return this[0]?parseFloat(d.css(this[0],e,a?"margin":"border")):null},d.fn[e]=function(a){var f=this[0];if(!f)return a==null?null:this;if(d.isFunction(a))return this.each(function(b){var c=d(this);c[e](a.call(this,b,c[e]()))});if(d.isWindow(f)){var g=f.document.documentElement["client"+c];return f.document.compatMode==="CSS1Compat"&&g||f.document.body["client"+c]||g}if(f.nodeType===9)return Math.max(f.documentElement["client"+c],f.body["scroll"+c],f.documentElement["scroll"+c],f.body["offset"+c],f.documentElement["offset"+c]);if(a===b){var h=d.css(f,e),i=parseFloat(h);return d.isNaN(i)?h:i}return this.css(e,typeof a==="string"?a:a+"px")}}),a.jQuery=a.$=d})(window)
My code doesn't have an error...
I suggest that you debug your code, as the min version of jquery works just fine. You have a problem with your code that is indirectly causing an error in internet explorer and you have to do a work around.
My favorite thing (and what I did for a similar problem that I just figured out) is to
cut out all your javascript and run it to make sure that it works
paste it back in, a chunk at a time, testing each time
once you find the offending chunk of javascript code, cut that out and put everything else back in to make sure that is the only problem
narrow it down in that chunk to see where internet explorer is being retarded. If you are using PHP, you might need to do something like this to have internet explorer skip the code that is causing it to fail
$('li[title]').qtip({
style: {
name: 'dark',
background: $('.ui-widget-header:first').css('background-color')
<?php
//internet explorer is retarded
if(!preg_match('/MSIE/i',$_SERVER["HTTP_USER_AGENT"]))
{
echo ", tip: true";
}
?>
},
position: {
target: 'mouse',
corner: {
target: 'topLeft',
tooltip: 'bottomLeft'
}
}
});
I hope that helps! (If it did, please mark as answer)
I used the "slideToggle" from jquery version "jquery-1.6.4.min.js" on one big DIV element.
The "DIV" element has inside more html elements.
In internet explorer 8 (maybe on FF too) when I try to load the slideToggle function on this big DIV I received an error. Not sure what was the real cause of error but during my investigation I found a bug into the jquery:
_default:function(a){a.elem.style&&a.elem.style[a.prop]!=null?a.elem.style[a.prop]=(a.prop==="width"||a.prop==="height"?Math.max(0,a.now):a.now)+a.unit:a.elem[a.prop]=a.now}}})
There are situations when "a" variable is "NAN". Because of this I got some errors.
So I placed this check routine inside:
if(isNaN(a.now)){return;}
And all my problems gone.
_default:function(a){if(isNaN(a.now)){return;}a.elem.style&&a.elem.style[a.prop]!=null?a.elem.style[a.prop]=(a.prop==="width"||a.prop==="height"?Math.max(0,a.now):a.now)+a.unit:a.elem[a.prop]=a.now}}})
For me, this comes up when setting the padding or margins to a negative number. This has been discussed in a number of places online re: "IE negative padding". The following are the watch values from my IE console that prove this.
a.prop >> 'paddingTop'
a.prop==="width"||a.prop==="height" >> false
Math.max(0,a.now) >> 0
a.now >> -1.8277004484618357
(a.prop==="width"||a.prop==="height"?Math.max(0,a.now):a.now)+a.unit >> "-1.8277004484618357px"
a.elem.style[a.prop]=(a.prop==="width"||a.prop==="height"?Math.max(0,a.now):a.now)+a.unit >> Invalid Argument
experimenting:
- a.elem.style[a.prop] = '1px' >> '1px'
- a.elem.style[a.prop] = '-1px' >> Invalid Argument
The thread over at: StackOverflow: jQuery, IE & Animate proposes the following:
a.elem.style[a.prop]=(a.prop==="width"||a.prop==="height"?Math.max(0,a.now||0):a.now)+a.unit;
... which did nothing for me.
I don't really think this is a jQuery bug, and I haven't found it in their bug tracking system (I'll admit I haven't looked too hard), but rather an issue with IE not being able to handle negative padding/margins. It's a tough call whether jQuery should handle this or not ...
EDIT: This was opened as jQuery bug 4571, where they decided that the behavior was correct and that developers should be more careful in setting margins/padding values since a negative margin/pad really isn't valid. They went on to say that they wish FF would throw an error like IE. Wow! don't hear that often!

DirectX Firefox Plugin rendering artifacts

QUICK ANSWER: For those of you who reach this page via Google looking for
a solution to the same problem, try
this quick fix (suggested by Goz) -
Add D3DCREATE_FPU_PRESERVE to the
behavior flags on your CreateDevice()
call. That cleared it up for me!
I'm creating a DirectX 9-based NPAPI plugin. It seems to be working well in Chrome and Opera, but in Firefox I get strange rendering artifacts. Upon initializing DirectX (no rendering needs to be done for the artifact to appear) all or parts of the Firefox UI will turn black. Resizing the window (IE: Initiating a repaint) clears up the artifacts and the plugin seems to work properly at that point, but this is obviously not a desirable "feature". I have found that several others online have mentioned this issue, most claiming that it began with Firefox 3. Only one post mentions any solution being found, but the author doesn't seem to keen on divulging how.
Is anyone familiar with this issue and a possible solution? From the linked post it would seem to be related to the way DX is initialized, but I've yet to find a combination that prevents the issue.
This is the DX Initialization code I'm using (Error Handling removed for clarity):
RECT rc;
GetClientRect(pluginHwnd, &rc);
D3DPRESENT_PARAMETERS d3d9PresentParams;
ZeroMemory(&d3d9PresentParams, sizeof(D3DPRESENT_PARAMETERS));
d3d9PresentParams.hDeviceWindow = pluginHwnd;
d3d9PresentParams.SwapEffect = D3DSWAPEFFECT_DISCARD;
d3d9PresentParams.Flags = D3DPRESENTFLAG_DEVICECLIP; // Failed attempt to solve FF issue
d3d9PresentParams.EnableAutoDepthStencil = FALSE; // No depth testing
d3d9PresentParams.PresentationInterval = D3DPRESENT_INTERVAL_ONE; // Use Vsync
d3d9PresentParams.MultiSampleType = D3DMULTISAMPLE_NONE; // Don't care about Multisampling
d3d9PresentParams.MultiSampleQuality = 0;
d3d9PresentParams.BackBufferCount = 1;
d3d9PresentParams.BackBufferWidth = rc.right - rc.left;
d3d9PresentParams.BackBufferHeight = rc.bottom - rc.top;
d3d9PresentParams.BackBufferFormat = D3DFMT_UNKNOWN; // Use the same color format as windows
d3d9PresentParams.Windowed = TRUE; // Explicitly windowed
d3d9PresentParams.FullScreen_RefreshRateInHz = 0;
d3d9->CreateDevice( D3DADAPTER_DEFAULT, D3DDEVTYPE_HAL, pluginHwnd, D3DCREATE_HARDWARE_VERTEXPROCESSING, &d3d9PresentParams, &d3d9Device );
The only thing I can think of off the top of my head is setting the "D3DCREATE_NOWINDOWCHANGES" behaviour flag on device creation.
Edit1:
You could try setting backbufferwidth and height to 0 and let it inherit the info from the window.
Might also be worth trying setting the D3DCREATE_FPU_PRESERVE flag and D3DCREATE_MULTITHREADED.

Resources