tag:blogger.com,1999:blog-48823215055407629442024-03-05T16:04:42.698-08:00Visual ScientificThe art and science of high-tech live visuals
by MOVAX/Kris CollinsKrishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.comBlogger11125tag:blogger.com,1999:blog-4882321505540762944.post-21996846704273464122011-12-10T17:04:00.001-08:002011-12-10T17:04:44.849-08:00Windows Phone 7 - One-liner to animate position and alpha of a UIElement without XAML<pre>
public static Storyboard AnimatePositionAndAlpha(DependencyObject element, double delay, double duration, double startAlpha, double endAlpha, Point startPt, Point endPt)
{
Storyboard storyboard = new Storyboard();
duration *= 20;
TranslateTransform trans = new TranslateTransform() { X = startPt.X, Y = startPt.Y };
((UIElement)element).RenderTransform = trans;
((UIElement)element).Opacity = startAlpha;
DoubleAnimation moveAnimX = new DoubleAnimation();
moveAnimX.Duration = TimeSpan.FromSeconds(duration);
moveAnimX.From = startPt.X;
moveAnimX.To = endPt.X;
moveAnimX.BeginTime = TimeSpan.FromSeconds(delay);
Storyboard.SetTarget(moveAnimX, ((UIElement)element));
Storyboard.SetTargetProperty(moveAnimX, new PropertyPath("(UIElement.RenderTransform).(TranslateTransform.X)"));
DoubleAnimation moveAnimY = new DoubleAnimation();
moveAnimY.Duration = TimeSpan.FromSeconds(duration);
moveAnimY.BeginTime = TimeSpan.FromSeconds(delay);
moveAnimY.From = startPt.Y;
moveAnimY.To = endPt.Y;
Storyboard.SetTarget(moveAnimY, ((UIElement)element));
Storyboard.SetTargetProperty(moveAnimY, new PropertyPath("(UIElement.RenderTransform).(TranslateTransform.Y)"));
DoubleAnimation alphaAnim = new DoubleAnimation();
alphaAnim.From = startAlpha;
alphaAnim.To = endAlpha;
alphaAnim.Duration = TimeSpan.FromSeconds(duration);
alphaAnim.BeginTime = TimeSpan.FromSeconds(delay);
alphaAnim.AutoReverse = false;
Storyboard.SetTarget(alphaAnim, element);
Storyboard.SetTargetProperty(alphaAnim, new PropertyPath(UIElement.OpacityProperty));
storyboard.Children.Add(moveAnimX);
storyboard.Children.Add(moveAnimY);
storyboard.Children.Add(alphaAnim);
storyboard.Begin();
return storyboard;
}
</pre>Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-1969289194348656902010-08-31T09:27:00.000-07:002010-08-31T09:28:30.025-07:00GLSL HSB to RGB functionI'm sure it could be optimized, but here it is..<br /><br /><br /><br />vec3 HSBToRGB(vec3 colorIn)<br />{<br /><br /> float h=colorIn.x;<br /> float sl=colorIn.y;<br /> float l=colorIn.z;<br /> <br /> float v;<br /> float r,g,b;<br /><br /> r = l; // default to gray<br /> g = l;<br /> b = l;<br /><br /> v = (l <= 0.5) ? (l * (1.0 + sl)) : (l + sl - l * sl);<br /><br /> if (v > 0.0)<br /> {<br /><br /> float m;<br /> float sv;<br /> int sextant;<br /> float frac, vsf, mid1, mid2;<br /><br /><br /> m = l + l - v;<br /> sv = (v - m ) / v;<br /> h *= 6.0;<br /> sextant = int(h);<br /> frac = h - float(sextant);<br /> vsf = v * sv * frac;<br /> mid1 = m + vsf;<br /> mid2 = v - vsf;<br /><br /> if(sextant==0)<br /> {<br /> r = v;<br /> g = mid1;<br /> b = m;<br /> }<br /> else if(sextant==1)<br /> {<br /> r = mid2;<br /> g = v;<br /> b = m;<br /> }<br /> else if(sextant==2)<br /> {<br /> r = m;<br /> g = v;<br /> b = mid1;<br /> }<br /> else if(sextant==3)<br /> {<br /> r = m;<br /> g = mid2;<br /> b = v;<br /> }<br /> else if(sextant==4)<br /> {<br /> r = mid1;<br /> g = m;<br /> b = v;<br /> }<br /> else if(sextant==5)<br /> {<br /> r = v;<br /> g = m;<br /> b = mid2;<br /> }<br /><br /> }<br /><br /> vec3 rgb;<br /><br /> rgb.r = r;<br /> rgb.g = g;<br /> rgb.b = b;<br /><br /> return rgb;<br /><br />}Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-64180075807020038952010-07-22T12:57:00.000-07:002010-07-22T12:59:27.186-07:00A case for Interface BuilderThere is a lot of hatred for Apple's UI tool Interface Builder among many programmers. I was firmly in that camp but lately have seen some advantages.. Especially as our last project spiraled over budget.<br /><br />I've released 8 apps without using a single XIB. But the next one I'm planning on relying heavily on the tool. Here's why:<br /><br />- Design/implement GUI graphically, right brained like you will use the program<br />- LESS LINES OF CODE to debug, write, remember to think about retain counts and spend dozens of lines setting up, say text field properties<br />- Less memory management! The whole XIB is loaded/unloaded behind the scenes<br />- Share the XIBs so DESIGNERS CAN LAY THEM OUT. No more time spent pixel pushing from a PSD comp, the designer will create the VERY LAYOUT U WILL USE! :D<br />- Less buggy code. IB makes sure you are initializing, configuring and disposing properly. (Not that *I* need that) <br />- FASTER development of a complex UI. If you have 10+ styled elements on a view, it takes probably 50 lines of code to set them up right. With IB it takes zero.<br /><br />Now, the shortcomings.. (Rumored XCode 4 with integrated IB might fix some of this)<br />- Terminology is confusing. Outlets, "File's Owner" etc are never used in non-IB code, so pure coders don't know what they do<br />- Seems difficult to style/configure certain things. Attaching a UITableViewCell to a UITableView for example.<br />- The magic of how the elements interact with the code is a hurdle for many at first. <br /><br />Ultimately I wouldn't recommend newbies using IB. Get a firm grasp on the codez first and then you will see how IB can help you.Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-34077126927168849122010-03-23T22:55:00.000-07:002010-03-23T22:57:13.978-07:00Sneak preview music video stills<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDFm6EeXVFJtDYMRCPmVaTEdEr6Bwn-lOwsy_YT05njRXJKrCph_FWrhDxKeU0i-GMmI4twjECWePTtdCuES55DpjICVBPepzQxuQMROt-mnoVrceOXcoUCMDtyvZ_wO2g0Dxi87qtoeqk/s1600/2010-3-23__23-37-0.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 180px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDFm6EeXVFJtDYMRCPmVaTEdEr6Bwn-lOwsy_YT05njRXJKrCph_FWrhDxKeU0i-GMmI4twjECWePTtdCuES55DpjICVBPepzQxuQMROt-mnoVrceOXcoUCMDtyvZ_wO2g0Dxi87qtoeqk/s320/2010-3-23__23-37-0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5452075126148100962" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzMpqzXw5ekzv8qszV4iMnOqsmwjgdcgMsKtBSk2Upb_6JZeH89SrONM5ysA7EyqHe3X00bW3kpScpkrYE3avcrjt7S6tNTLp7subgI6Fy7tkeKVk1JpxdZyehjgTvx55dFJzvv-R9qXUQ/s1600/2010-3-23__23-36-59.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 180px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzMpqzXw5ekzv8qszV4iMnOqsmwjgdcgMsKtBSk2Upb_6JZeH89SrONM5ysA7EyqHe3X00bW3kpScpkrYE3avcrjt7S6tNTLp7subgI6Fy7tkeKVk1JpxdZyehjgTvx55dFJzvv-R9qXUQ/s320/2010-3-23__23-36-59.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5452075120142555074" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDO_1E4GS90yP0pInAUNgdst0W8zr5p8lF8acYen5eTNx5EGoyZ_Y_H6IGr666DPK00m-WylTk4-qhp57dtCeXbc3lYvYoAOFpEK3N1oENAz0r-RPjmo01xWEJLV9OtJYN2yvmmAzlYp_W/s1600/2010-3-23__23-36-58.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 180px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDO_1E4GS90yP0pInAUNgdst0W8zr5p8lF8acYen5eTNx5EGoyZ_Y_H6IGr666DPK00m-WylTk4-qhp57dtCeXbc3lYvYoAOFpEK3N1oENAz0r-RPjmo01xWEJLV9OtJYN2yvmmAzlYp_W/s320/2010-3-23__23-36-58.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5452075111846286914" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJk5sZKkzkaY_of7el4CVcjS8FcEE2EsBGdiUk_l7TTt1He8BQxeln01JpyS6lNYV-0-cJ0v5n3McBRs3SW5KwQDniHg48cRM3zy0NpBnwPLRlCsRHWlW3itmbPdIcuuACt-mwdMD7afvL/s1600/2010-3-23__23-36-57.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 180px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJk5sZKkzkaY_of7el4CVcjS8FcEE2EsBGdiUk_l7TTt1He8BQxeln01JpyS6lNYV-0-cJ0v5n3McBRs3SW5KwQDniHg48cRM3zy0NpBnwPLRlCsRHWlW3itmbPdIcuuACt-mwdMD7afvL/s320/2010-3-23__23-36-57.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5452075107514665586" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjISvK5OKd1D4vPcygZJV6HIlj9yYhfWL3ucjvLp52xw99RZu5TYtV1oLR4IpzOKn9Fim2ueoozpCfeA5kDkf82nGkhJacH9SQDy4XESVKy6O7y1yrG0eIrwYJNGbTda1f9UkuE3LuKweaM/s1600/2010-3-23__23-36-56.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 180px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjISvK5OKd1D4vPcygZJV6HIlj9yYhfWL3ucjvLp52xw99RZu5TYtV1oLR4IpzOKn9Fim2ueoozpCfeA5kDkf82nGkhJacH9SQDy4XESVKy6O7y1yrG0eIrwYJNGbTda1f9UkuE3LuKweaM/s320/2010-3-23__23-36-56.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5452075100432712146" /></a>Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-48483186289610458462010-03-12T14:06:00.000-08:002010-03-12T14:24:20.964-08:00Topographic Shader V2 and a happy accident<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMQjAuakl1rZOA3eJCGinMqH_B4XPWiQ86A7r1K05JF3yeXEGeZKUXfnLVAb2b6JkGU4fwSuj0ProdVk81hIbRqCnJWdB8sGIsXcW_Jch9MmnIt5QseO7ZF6Xa3WuMyWkVSUtGB-nBRazn/s1600-h/Picture+2.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 176px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMQjAuakl1rZOA3eJCGinMqH_B4XPWiQ86A7r1K05JF3yeXEGeZKUXfnLVAb2b6JkGU4fwSuj0ProdVk81hIbRqCnJWdB8sGIsXcW_Jch9MmnIt5QseO7ZF6Xa3WuMyWkVSUtGB-nBRazn/s320/Picture+2.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5447872694955299554" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_ShgjwOeyr366kxKQcaviSnqVHEKUy7fAO4BjSEvpEaGhDtzjlSYfKNjvl-xxlpG2R7aNcfvT1BvGuECmwLIuG9lTE5DUYgdmDYnWX6NTn2nTNIw2jr9w8tqS7kfbvrAFuGzbSC1am7o0/s1600-h/Picture+3.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 182px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_ShgjwOeyr366kxKQcaviSnqVHEKUy7fAO4BjSEvpEaGhDtzjlSYfKNjvl-xxlpG2R7aNcfvT1BvGuECmwLIuG9lTE5DUYgdmDYnWX6NTn2nTNIw2jr9w8tqS7kfbvrAFuGzbSC1am7o0/s320/Picture+3.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5447872654724257186" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlc2sfyYS4lA58lrD84Oe3JqtIx4q4clYdjlWbv1qjTLxDZ_HfHsQ9Fq2EXybRF-O-8v4CVGxD4waAKgyFryX5SjfnC7kprnmlQxc3XhoVgAyvvZBaepXCUg_7JnCqHGEiQOvAIrLAsiHO/s1600-h/Picture+6.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 178px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlc2sfyYS4lA58lrD84Oe3JqtIx4q4clYdjlWbv1qjTLxDZ_HfHsQ9Fq2EXybRF-O-8v4CVGxD4waAKgyFryX5SjfnC7kprnmlQxc3XhoVgAyvvZBaepXCUg_7JnCqHGEiQOvAIrLAsiHO/s320/Picture+6.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5447872577958440498" /></a><br /><br />Ever since I first posted the Topographic Contour shader, I have been trying to figure out how to smooth out the lines in that effect. Eventually I came up with the solution to write a function similar to smoothstep() but instead of smoothly transitioning from 0.0 to 1.0, it transitions from 0.0 to 1.0 back to 0.0 over the same input domain. This was perfect for antialiasing the contour lines! I think this function could be helpful in other areas too..<br /><br />During the development, I came across a strange shader by accident that was actually pretty interesting looking. I called it Disco Snakeskin and it's the last one pictured above (best viewed large). I think there's potential with that shader.<br /><br />Lastly, I'm still learning a lot about GLSL every day, and graphics/vector math in general as I do. Screen space derivatives, and fwidth() have been on my mind as I see the power it can bring to antialiasing, and special effects. A new rule of thumb will be for every varying parameter, consider what could be done by looking at its screen-space derivatives. I think some crazy effects are possible with this.. And I'm stoked at the possibility of discovering some of them! In fact, overall I'm really stoked on GLSL. After being involved in graphics coding for so long, finally getting into shaders has been like a rebirth for me- once again learning a ton and feeling low on the totem pole. But seeing some of the things people are doing through this technology is extremely inspiring (and a tiny bit frustrating, I'll admit). With that in mind, I've added a column over there on the right side of the blog, containing any brilliant blogs or sites discussing GLSL.Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-6690566109856586162010-03-11T14:44:00.001-08:002010-03-11T14:52:09.301-08:00<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpLMmZeGsvf0OhcTt77Inkm3uwVRtIO9KDtwpjaxaO7JqITjdP02AXVNH_xU1Q8xd3v-SxCleH-GL2zXA-9mBX66AhPLmFeYVb5mOueRu2tJ3ut4qzdwcJB9jewMkHMebkHF0SDKFBjtO-/s1600-h/2010-3-9__13-56-35.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 180px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpLMmZeGsvf0OhcTt77Inkm3uwVRtIO9KDtwpjaxaO7JqITjdP02AXVNH_xU1Q8xd3v-SxCleH-GL2zXA-9mBX66AhPLmFeYVb5mOueRu2tJ3ut4qzdwcJB9jewMkHMebkHF0SDKFBjtO-/s320/2010-3-9__13-56-35.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5447510907362930114" /></a><br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXrwDmO3NLN3ghkb9-2pYxau37dhHhJoIpTEN_Pxl_M34bZDxEk56Wt5HBq0BrN3kdC8LWYMszk3AbBEwlrqQpLi0E4cvgUv_Sg4ZBGpkPOSNU1SfewWCbyhukq4H23vH-QnLr27suMbA6/s1600-h/Picture+5.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 179px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXrwDmO3NLN3ghkb9-2pYxau37dhHhJoIpTEN_Pxl_M34bZDxEk56Wt5HBq0BrN3kdC8LWYMszk3AbBEwlrqQpLi0E4cvgUv_Sg4ZBGpkPOSNU1SfewWCbyhukq4H23vH-QnLr27suMbA6/s320/Picture+5.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5447510970631102658" /></a><br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLqS8FcTXRMQmP17da3R1F0xxbaXyRyaYSLxibLDFG24b8B9O6AanMdldidhJ6FiPJTB1HDLeNdP4P5YFB0xPqRM3WnBN4WXR2XW097TVFsRghUqpdaNnpJoZI71s5tW2y74PRuIKYtBl0/s1600-h/4422230573_a97bdc8781.jpg"><img style="cursor:pointer; cursor:hand;width: 320px; height: 216px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLqS8FcTXRMQmP17da3R1F0xxbaXyRyaYSLxibLDFG24b8B9O6AanMdldidhJ6FiPJTB1HDLeNdP4P5YFB0xPqRM3WnBN4WXR2XW097TVFsRghUqpdaNnpJoZI71s5tW2y74PRuIKYtBl0/s320/4422230573_a97bdc8781.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5447511237867341170" /></a><br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0vvUpn5xrltxJGdXKhifKgMMpQu6LvuTU3_h0o3EBtUaHF53hXZHPW-e4f28r8DVNLbIUK4nOfNCcsFm2EcpjSBdc5Sdw7xD2G-ANOZvCaVASe4OiQMfrd1eevwu-O-FOTIwerHQjrc6V/s1600-h/4422996078_9a079e486a.jpg"><img style="cursor:pointer; cursor:hand;width: 320px; height: 216px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0vvUpn5xrltxJGdXKhifKgMMpQu6LvuTU3_h0o3EBtUaHF53hXZHPW-e4f28r8DVNLbIUK4nOfNCcsFm2EcpjSBdc5Sdw7xD2G-ANOZvCaVASe4OiQMfrd1eevwu-O-FOTIwerHQjrc6V/s320/4422996078_9a079e486a.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5447511288026526562" /></a><br /><br /><br />Just an update on what I've been working on the last week or two.. The first image shows studies for a music video I'm working on. The video will feature MIDI and audio triggered/modulated 3D forms and all the shader work I've been cranking on. Pictured are some paper cranes and a 'paper' shader, still very much under construction.<br /><br />The next image shows the multi-light metal/phong shader I've been working on. The results seem really nice, and about exactly what I wanted. Should be a good basis for other shaders too. <br /><br />The last two images show screen shots from the latest version of CFGR8R program built for live performance with Plaid, the legendary UK electronic duo. Audio reactive environments feature a hybrid OBJ/Generative geometry engine and lots of different dynamic effects. Here you can see the metal/phong shader in action, as well as a fresnel/Xray shader.Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-91166245884075884042010-02-23T09:35:00.000-08:002010-02-23T09:42:29.831-08:00A fun distraction - Topographic Contour Shader<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvHRK-7s8lnSQyOkAK8jHZdHrzyBb_IMz_j6BX51RipOTQjq4mDOHy6kE96HyN86oF8pfEkkai-bih5DnlHkXVRtB4nQppWYTrP0PtUUSyIRY8lt6j6xoR2l8Z3FkqTbRvA_KwnE6bGAm9/s1600-h/a.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 118px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvHRK-7s8lnSQyOkAK8jHZdHrzyBb_IMz_j6BX51RipOTQjq4mDOHy6kE96HyN86oF8pfEkkai-bih5DnlHkXVRtB4nQppWYTrP0PtUUSyIRY8lt6j6xoR2l8Z3FkqTbRvA_KwnE6bGAm9/s320/a.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5441495437869999394" /></a><br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVI6nSxVtH2SY2xRzGIN87cCCn8ag5NHmtUb-U12zm_WPycxS8tUtU87OTrE0gNHqM1nPjUw95miuFFtD3kU_PKPnfB1BTAxGLQv5qCgTv9fjX_usTViwYGmMlw1WidaRMCYfhBDAsK5i_/s1600-h/b.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 96px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVI6nSxVtH2SY2xRzGIN87cCCn8ag5NHmtUb-U12zm_WPycxS8tUtU87OTrE0gNHqM1nPjUw95miuFFtD3kU_PKPnfB1BTAxGLQv5qCgTv9fjX_usTViwYGmMlw1WidaRMCYfhBDAsK5i_/s320/b.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5441495553955775218" /></a><br /><br />While working on the normal re-calculation for my spherical deformer vertex shader, I got distracted by an idea I had. Thinking about Avatar, and virtually any other movie with high tech 3D displays of terrain, I thought it would be cool to develop a fragment shader to draw the object as stacked countour lines, like those found on a topo map. <br /><br />I developed a simple version using modulus of one spacial dimension, but the results weren't quite the "wireframe" look I was going for. With the help of <a href="http://www.gamedev.net/community/forums/topic.asp?topic_id=529926">this thread</a> I learned about smoothstep() and was able to get exactly what I was going for.Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-77382132976315698112010-02-17T15:12:00.000-08:002010-02-17T16:22:13.409-08:00GLSL mesh deformer in spherical coordinates - part 3<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB2es4JFYd-C_Q1NEs5uy3c5t13VsaJSYDCLf0ZDAm0Ds_UO8famJtzDkZ3RWGCjdMM09pbEMKghw2v-2-v7gCiRH-6ZeOjeoJ2FsVez4YQX8fnGBVxCHOteEb-NSUDmrGBwOZzpQBnurF/s1600-h/Picture+6.png"><img style="cursor:pointer; cursor:hand;width: 320px; height: 268px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB2es4JFYd-C_Q1NEs5uy3c5t13VsaJSYDCLf0ZDAm0Ds_UO8famJtzDkZ3RWGCjdMM09pbEMKghw2v-2-v7gCiRH-6ZeOjeoJ2FsVez4YQX8fnGBVxCHOteEb-NSUDmrGBwOZzpQBnurF/s320/Picture+6.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5439372195629998978" /></a><br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZm2hJOW3WwoKH4KA-i0_DshcJPDSbjiYC3oLOwtDoByKuAj2r_h0oXG_RdaGdxnO1dbDNC_9V561DxWeMFlq9UF39kZgVbkj_nM7v0DgZANbilAa9yjPR6-Z7-RArwIaRA995JKNqdV2y/s1600-h/Picture+1.png"><img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 320px; height: 251px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZm2hJOW3WwoKH4KA-i0_DshcJPDSbjiYC3oLOwtDoByKuAj2r_h0oXG_RdaGdxnO1dbDNC_9V561DxWeMFlq9UF39kZgVbkj_nM7v0DgZANbilAa9yjPR6-Z7-RArwIaRA995JKNqdV2y/s320/Picture+1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5439361959607518786" /></a><br /><br /><br />Getting closer on properly re-calculating the normals after radial deformation in GLSL. To recap, I built a radial deformer like a jellyfish or spore type form when applied to a sphere. While displacing vertices is fairly easy, re-calculating the normals has been tricky. The visual appearance is getting very close to the phong-shaded deformed sphere I'm shooting for.. However it still isn't perfect.<br /><br />Since last time, here are the advancements that have brought me closer to the goal:<br /><br />- Don't normalize any vectors in Spherical coordinates. Since they're measuring angles & radius, a normalization doesn't make sense. This was causing all kinds of crazy problems. <br />- Cartesian-to-spherical function modified to check for bounds of asin and check hemisphere for atan. Holes in mesh have been fixed.<br />- Now using the proper built in GLSL matrix functionality. <br /><br />The current method for calculating normals for deformed vertex is as follows:<br /><br />- Convert incoming vertex to spherical<br />- Displace this vertex by 3 component (r, theta, phi) deform function<br />- Find unit tangent vector U (in Cartesian coords)<br />- Find binormal vector V (in Cartesian coords)<br />- Convert these to spherical coords<br />- Find Jacobian matrix for current vertex (in Spherical coords)<br />- Multiply U by Jacobian to get U' (transformed unit tangent vector)<br />- Multiply V by Jacobian to get V' (transformed binormal vector)<br />- Convert these back into cartesian<br />- Transformed normal, in Cartesian is normalize(U'X V')<br /><br /><br />With this method, the shading/highlights still don't look perfect when deformed. I'm almost positive that the culprit is my Jacobian matrix, since when the deformation amount is zero, the object looks perfect: <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhI_KNL0ncZY1aXcryIZRbchL3je0dUAeghpsyuBaLZbRV-BC_h5U4mO39LDxab9OW0Et9ZUWvpIQT3VSoEUmZD4249_SJwxpMBPRWvpLwR_crf9aGldXdxqK5IJaAZMyi1i2-hXxh050Ob/s320/Picture+5.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5439370865155914546" /> In other words, when the deformation is zero, the whole process of renormalization is still happening, but just coming out identical to the inputs. I'm wondering if my method of simply replacing x,y,z with r,t,p in the Jacobian is legit.. Maybe I have to convert the functions somehow. More reading to come..Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-26630269515813365552010-02-10T19:58:00.001-08:002010-02-10T20:07:29.648-08:00GLSL vertex deformer part 2<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj6dRq53oVOnb5A4U4EZjTfOew8qdFlQ156vRxAbRyDQQdVhff9GhmxiusNmUE9EV9Y3-fBLkhyphenhypheny6lv_-LD9WrdQfBU1syf4-ZI_PEOM92__fs_jOZ8wN-lrGF6aGIg2kA918x-OMbYDMp/s1600-h/Picture+2.png"><img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 320px; height: 238px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj6dRq53oVOnb5A4U4EZjTfOew8qdFlQ156vRxAbRyDQQdVhff9GhmxiusNmUE9EV9Y3-fBLkhyphenhypheny6lv_-LD9WrdQfBU1syf4-ZI_PEOM92__fs_jOZ8wN-lrGF6aGIg2kA918x-OMbYDMp/s320/Picture+2.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5436832420980999970" /></a><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTRb5auzager6ZG82dO1Ul31WKr3pQNGjQppSUOQU8yFOvwbh4UHEojETdjgINZhLZP3VgLeSYgCX2BZzUFR1OzXw4GEIxB0yz8w1vQMucnJSweZ_5DXRDioKsHL26RB1nZEESHCSAw1ze/s1600-h/Picture+1.png"><img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 320px; height: 238px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTRb5auzager6ZG82dO1Ul31WKr3pQNGjQppSUOQU8yFOvwbh4UHEojETdjgINZhLZP3VgLeSYgCX2BZzUFR1OzXw4GEIxB0yz8w1vQMucnJSweZ_5DXRDioKsHL26RB1nZEESHCSAw1ze/s320/Picture+1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5436832344555791362" /></a><br /><br /><br />I began to implement the second part of the GLSL mesh deformer. This part was all about recalculating the surface normals after procedurally moving the vertices of the model. Following the directions provided at <a href="http://http.developer.nvidia.com/GPUGems/gpugems_ch42.html">this link</a> I was able to perform the steps to calculate a Jacobian matrix based on the original deformation forumla. Using this matrix I was able to correct the surface normals post-deformation.. sort of.<br /><br />Since this deformation was a radial displacement, I was operating in the polar coordinate system. So before performing the partial derivatives to create the Jacobian matrix, I had to convert some things to polar coordinates. The steps were as follows:<br /><br />- Convert the vertex position into polar<br />- Create the Binormal and tangent vectors as described in <a href="http://http.developer.nvidia.com/GPUGems/gpugems_ch42.html">this link</a><br />- Convert the binormal and tangent vectors to polar coordinates<br />- Convert the incoming surface normal to polar<br />- Plug all the data into the hard coded Jacobian matrix<br />- Calculate the new surface normal<br />- Convert the new surface normal back into cartesian 3 space<br /><br />With this method, I think I got very close to the desired effect of perfectly deformed surface normals to go along with the deformed mesh. However visually there are still some problems.<br /><br />I believe the cartesian-to-polar function has some discontinuities that result in holes in the mesh. Also the shading looks off in some way, possibly related to the double coordinate system translation being slightly off. But its getting closer!<br /><br /><br />Here's the vertex shader as it stands..<br /><br /><font color=yellow><br />const float TWO_PI=6.28318531;<br />const float PI=3.14159265;<br />const float HALF_PI=1.57079633;<br /><br />varying vec4 screenPos, worldPos;<br /><br />varying vec3 normal, lightDir, halfVector;<br />varying vec4 diffuse, ambient;<br /><br />varying float radius,redShift,greenShift,blueShift;<br /><br />uniform float time;<br />uniform float displaceAmount1;<br />uniform float displaceAmount2;<br /><br />uniform float frequency1;<br />uniform float frequency2;<br /><br />varying vec4 eyePosition; <br />varying vec3 diffuseColor; <br />varying vec3 specularColor; <br />varying vec3 emissiveColor; <br />varying vec3 ambientColor; <br />varying float shininess;<br />//varying vec3 normal; <br /><br />vec3 va;//={0,0,1};<br />vec3 vb;//={0,1,0};<br /><br />vec3 renormalizeA;<br />vec3 renormalizeB;<br />vec3 renormalizeC;<br /><br /><br />vec3 vertexSpherical; <br /><br /> float d0;<br /> float d1;<br /> float d2;<br /> float x,y,z;<br />// float theta,phi,r;<br /><br />vec4 displacedPoint;<br /><br /> float tri(float phase)<br />{<br /> float ramppoint;<br /> phase =mod(phase,TWO_PI);<br /> ramppoint=mod(phase,HALF_PI)/(HALF_PI); <br /> if(phase>=0.0 && phase<HALF_PI) return(phase/HALF_PI);<br /> else if(phase>=HALF_PI && phase<PI) return(1.-ramppoint);<br /> else if(phase>=PI && phase<(HALF_PI*3.0)) return(-ramppoint);<br /> else if(phase>=(HALF_PI*3.0) && phase<=TWO_PI) return(-1.+ramppoint);<br /> else return(1.0);<br />}<br /> <br /> vec3 sphericalToCartesian( vec3 sphericalCoord)<br /> {<br /> vec3 o; <br /> o.x=sphericalCoord[0]*sin(sphericalCoord[1])*cos(sphericalCoord[2]);<br /> o.y=sphericalCoord[0]*sin(sphericalCoord[1])*sin(sphericalCoord[2]);<br /> o.z=sphericalCoord[0]*cos(sphericalCoord[1]);<br /> <br /> return o;<br /> <br /> }<br /> vec3 cartesianToSpherical( vec3 cartesianCoord)<br /> {<br /> vec3 o; <br /> <br /> float S;<br /> <br /> o[0]=length(cartesianCoord);<br /> <br /> S=length(cartesianCoord.xy);<br /> <br /> o[1]=acos(cartesianCoord.z / o[0]);<br /> <br /> <br /> //o[2]=atan(cartesianCoord.y/cartesianCoord.x);<br /> if(cartesianCoord.x>=0.0) o[2]=asin(cartesianCoord.y/S);<br /> else o[2]=PI-asin(cartesianCoord.y/S);<br /><br /><br /> <br /> return o;<br /> <br /> }<br /><br /><br />float f_r(float rOriginal)<br />{<br /> <br /> return rOriginal+cos(vertexSpherical[1]*frequency1+time)*displaceAmount1 +cos(vertexSpherical[2]*frequency2+time)*displaceAmount2;<br /> <br />}<br /><br />float f_theta(float thetaOriginal)<br />{<br /> <br /> return thetaOriginal;<br /> <br />}<br /><br />float f_phi(float phiOriginal)<br />{<br /> <br /> return phiOriginal;<br /> <br />}<br /> <br /><br />void main()<br />{<br /><br /> x=gl_Vertex[0];<br /> y=gl_Vertex[1]; //flip flopped, so angular parts map to sides ("walls"), instead of along top<br /> z=gl_Vertex[2];<br /> <br /> vertexSpherical=cartesianToSpherical(gl_Vertex.xyz);<br /><br /> <br /> vec4 displaceVect;<br /><br /> <br /> vec4 Vertex=gl_Vertex;<br /> <br /> vertexSpherical[0]=f_r(vertexSpherical[0]);<br /> vertexSpherical[1]=f_theta(vertexSpherical[1]);<br /> vertexSpherical[2]=f_phi(vertexSpherical[2]);<br /> <br /> displacedPoint[0]=vertexSpherical[0]*sin(vertexSpherical[1])*cos(vertexSpherical[2]);<br /> displacedPoint[1]=vertexSpherical[0]*sin(vertexSpherical[1])*sin(vertexSpherical[2]);<br /> displacedPoint[2]=vertexSpherical[0]*cos(vertexSpherical[1]);<br /> displacedPoint[3]=1.0;<br /> <br /> Vertex=displacedPoint;<br /> <br /> redShift=0.0;//abs(r);<br /> greenShift=0.0;//abs(theta/6.0);<br /> blueShift=0.0;//abs(phi/6.0);<br /> <br /> <br /> <br /> worldPos=Vertex;<br /> screenPos=gl_ModelViewProjectionMatrix * Vertex ; <br /><br /> gl_Position = screenPos;<br /><br /> eyePosition = gl_ModelViewMatrix * gl_Vertex; <br /> <br /> normal = gl_Normal;//normalize(gl_Normal + normalize( gl_Normal-worldPos.xyz));<br /><br /> <br /><br /><br /> //Post-deform renormalization:<br /><br /> //Create a couple utility vectors:<br /> va.x=0.0;<br /> va.y=0.0;<br /> va.z=1.0;<br /> <br /> vb.x=0.0;<br /> vb.y=1.0;<br /> vb.z=0.0;<br /> <br /> va=cartesianToSpherical(va);<br /> vb=cartesianToSpherical(vb);<br /> normal=cartesianToSpherical(normal);<br /> <br /><br /><br /><br /> //Generate tangent vector: <br /> vec3 tangent, transformedTangent;<br /> if(length(cross(normal,va))>length(cross(normal,vb))) { tangent=cross(normal,va);} <br /> else { tangent = cross(normal,vb); }<br /> <br /> //Generate binormal vector<br /> vec3 binormal, transformedBinormal;<br /> binormal=cross(normal, tangent);<br /> <br /> <br /> //The Jacobian Matrix :<br /> renormalizeA[0]=1.0;<br /> renormalizeA[1]=-displaceAmount1*sin(frequency1*vertexSpherical[1]+time)*frequency1;<br /> renormalizeA[2]=-displaceAmount2*sin(frequency2*vertexSpherical[2]+time)*frequency2;<br /> renormalizeB[0]=0.0;<br /> renormalizeB[1]=1.0;<br /> renormalizeB[2]=0.0;<br /> renormalizeC[0]=0.0;<br /> renormalizeC[1]=0.0;<br /> renormalizeC[2]=1.0;<br /> <br /> <br /> transformedTangent.x=tangent.x*renormalizeA[0]+tangent.y*renormalizeA[1]+tangent.z*renormalizeA[2];<br /> transformedTangent.y=tangent.x*renormalizeB[0]+tangent.y*renormalizeB[1]+tangent.z*renormalizeB[2];<br /> transformedTangent.z=tangent.x*renormalizeC[0]+tangent.y*renormalizeC[1]+tangent.z*renormalizeC[2];<br /><br /> transformedBinormal.x=binormal.x*renormalizeA[0]+binormal.y*renormalizeA[1]+binormal.z*renormalizeA[2];<br /> transformedBinormal.y=binormal.x*renormalizeB[0]+binormal.y*renormalizeB[1]+binormal.z*renormalizeB[2];<br /> transformedBinormal.z=binormal.x*renormalizeC[0]+binormal.y*renormalizeC[1]+binormal.z*renormalizeC[2];<br /> <br /> <br /> vec3 transformedNormal=normalize(cross(transformedTangent,transformedBinormal));<br /> <br /> normal=sphericalToCartesian(transformedNormal);<br /> <br /> <br /> normal = gl_NormalMatrix * normal;//gl_Normal; <br /><br /> <br /> diffuseColor = vec3(gl_FrontMaterial.diffuse); <br /> specularColor = vec3(gl_FrontMaterial.specular); <br /> emissiveColor = vec3(gl_FrontMaterial.emission); <br /> ambientColor = vec3(gl_FrontMaterial.ambient); <br /> shininess = gl_FrontMaterial.shininess; <br /> <br /> }<br /><br /><br /> <br /> <br /> <br /><br /></font>Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-91363600735877863302010-02-09T13:50:00.000-08:002010-02-09T16:30:39.364-08:00Adventures in GLSL Shaders<div style="text-align: left;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEn5ZBUOJqUuLRWVb-waV-u1kAZ4sb_GbUkGtMGRFsGaC9eWfErRkywoj7AqmJnUTAV_GLzI5DUoofdZuZDWcbGuvDTmHzt8pIN5bcR8_FNEqmyLGuZtp5Rr90FxDRzw3FgHFKtv02DiKO/s1600-h/Picture+9.png"><img style="margin: 0pt 10px 10px 0pt; float: left; cursor: pointer; width: 320px; height: 236px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEn5ZBUOJqUuLRWVb-waV-u1kAZ4sb_GbUkGtMGRFsGaC9eWfErRkywoj7AqmJnUTAV_GLzI5DUoofdZuZDWcbGuvDTmHzt8pIN5bcR8_FNEqmyLGuZtp5Rr90FxDRzw3FgHFKtv02DiKO/s320/Picture+9.png" alt="" id="BLOGGER_PHOTO_ID_5436374352471333058" border="0" /></a><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3mohRSQ31PtQciLc-5iaLAlAQNJvO903QKtzdbo0fK17y1yDOT-Hx8YDW1cANyA6w5SQPhhNHOdPMUyGSoF4HIOrH6Vs67WGy9NH_J3c6CBSaJjdCTfBdaGDNakPLfg6lmlVQGIqt0SCL/s1600-h/Picture+7.png"><img style="margin: 0pt 10px 10px 0pt; float: left; cursor: pointer; width: 320px; height: 238px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3mohRSQ31PtQciLc-5iaLAlAQNJvO903QKtzdbo0fK17y1yDOT-Hx8YDW1cANyA6w5SQPhhNHOdPMUyGSoF4HIOrH6Vs67WGy9NH_J3c6CBSaJjdCTfBdaGDNakPLfg6lmlVQGIqt0SCL/s320/Picture+7.png" alt="" id="BLOGGER_PHOTO_ID_5436365707100086706" border="0" /></a><br /></div>I'm finally getting deeply into the world of GLSL and learning what can be done with it. I wanted to implement a mesh deformation shader that I could control with an audio signal. Inspired by sea anenomaes and spore-like forms, I decided to create a radial deformation.<br /><br />This deformation shader program works as follows: For each vertex I would take XYZ, and convert that to 3D radial coordinates (r, theta, phi). From there, I could push the point's radius outward, as a function of the two angles theta and phi. Then, converting back into the XYZ space, pass these new coordinates into a fragment shader. The model pictured is a simple sphere, loaded as a VBO. The sphere is great for testing a deformer like this, because it shows a very pure representation of the deformation itself. I pass FFT values of an incoming audio signal into the vertex shader from Java, which control displacement amount, frequency, progression of time, etc. I can get 400 FPS with about 50k polygons on the object... With the complex deformation.. Pretty good I'd say.<br /><br />The problem I quickly discovered is that although the vertices are easy to displace in this manner, their normals retain the original direction from when the model was a simple sphere. So, to get the proper shading and specular highlights, each vertex's normal must be recalculated along with its new position.<br /><br />Thankfully, people a lot smarter than me have already encountered and solved this problem. Although the solution is not exactly simple to impliment, it is somewhat straightforward. I found <a href="http://http.developer.nvidia.com/GPUGems/gpugems_ch42.html">this link</a> explaining it very well.<br /><br />Basically the idea is to take your deformation function and calculate some partial derivatives of it. Using these new functions, you can calculate a new transformation matrix to convert your original normals into the new proper normals reflecting the deformed object.<br /><br />Next step, to brush up those calculus skills and see if the university Math degree pays off for fun eye candy! I hope the radial coordinate transform doesn't make the partial derivatives too weird...<br /><br />Here's the vertex shader program as it stands... This version does not recalculate the normals after deformation.<br /><br /><br /><pre><font color=yellow><br />const float TWO_PI=6.28318531;<br />const float PI=3.14159265;<br />const float HALF_PI=1.57079633;<br /><br />varying vec4 screenPos, worldPos;<br /><br />varying vec3 normal, lightDir, halfVector;<br />varying vec4 diffuse, ambient;<br /><br />varying float radius,redShift,greenShift,blueShift;<br /><br />uniform float time;<br />uniform float displaceAmount1;<br />uniform float displaceAmount2;<br /><br />uniform float frequency1;<br />uniform float frequency2;<br /><br />varying vec4 eyePosition;<br />varying vec3 diffuseColor; <br />varying vec3 specularColor;<br />varying vec3 emissiveColor;<br />varying vec3 ambientColor;<br />varying float shininess;<br /> <br /><br /> float d0;<br /> float d1;<br /> float d2;<br /> float x,y,z;<br /> float a1,a2,r;<br /><br />vec4 displacedPoint;<br /><br /> float tri(float phase)<br />{<br /> //Triangle Wave function<br /> float ramppoint;<br /> phase =mod(phase,TWO_PI);<br /> ramppoint=mod(phase,HALF_PI)/(HALF_PI); <br /> if(phase>=0.0 && phase<HALF_PI) return(phase/HALF_PI);<br /> else if(phase>=HALF_PI && phase<PI) return(1.-ramppoint);<br /> else if(phase>=PI && phase<(HALF_PI*3.0)) return(-ramppoint);<br /> else if(phase>=(HALF_PI*3.0) && phase<=TWO_PI) return(-1.+ramppoint);<br /> else return(1.0);<br />}<br /><br /> <br /><br /><br />void main()<br />{<br /> <br /> x=gl_Vertex[0];<br /> z=gl_Vertex[1]; //flip flopped for aesthetics<br /> y=gl_Vertex[2];<br /> <br /> r=length(gl_Vertex.xyz);<br /> a1=acos(z/r);<br /> a2=atan(y,x);<br /> <br /> <br /> <br /> vec4 displaceVect;<br /> <br /> d1=tri(a1*frequency1+time*1.2)*displaceAmount1; d0=tri(a2*frequency2+time*1.2)*displaceAmount2;ex[0]*25.+time*1.27)*.0511;<br /> <br /> vec4 Vertex=gl_Vertex;<br /> <br /> r+=d1+d0;<br /> <br /> displacedPoint[0]=r*sin(a1)*cos(a2);<br /> displacedPoint[1]=r*sin(a1)*sin(a2);<br /> displacedPoint[2]=r*cos(a1);<br /> displacedPoint[3]=1.0;<br /> <br /> Vertex=displacedPoint;<br /> <br /> redShift=0.0;//abs(r); // USED BY MY FRAGMENT SHADERS<br /> greenShift=abs(a1/6.0);<br /> blueShift=abs(a2/6.0);<br /> <br /> <br /> worldPos=Vertex;<br /> screenPos=gl_ModelViewProjectionMatrix*Vertex;<br /> <br /> gl_Position = screenPos;<br /><br /> eyePosition = gl_ModelViewMatrix * gl_Vertex;<br /> <br /> normal = normalize(gl_Normal + normalize( gl_Normal-worldPos.xyz));<br /><br /> normal = gl_NormalMatrix * normal;//gl_Normal;<br /> <br /> <br /> diffuseColor = vec3(gl_FrontMaterial.diffuse);<br /> specularColor = vec3(gl_FrontMaterial.specular);<br /> emissiveColor = vec3(gl_FrontMaterial.emission);<br /> ambientColor = vec3(gl_FrontMaterial.ambient);<br /> shininess = gl_FrontMaterial.shininess;<br /> <br /> }<br /><br /><br /></font><br /></pre>Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0tag:blogger.com,1999:blog-4882321505540762944.post-1410933626225227932010-02-09T13:46:00.000-08:002010-02-09T13:50:36.238-08:00First postingThis blog will contain information and adventures related to advanced graphics coding, leaning toward abstract visuals, visuals for music, and VJ performance.<br /><br />Topics will cover, GLSL shaders, Audio Reactive, VBOs, animation, Generative Forms, Color Theory, Live Performance, and beyond..<br /><br />Even if this is just for me, it will be worth the time to document ideas and progress.Krishttp://www.blogger.com/profile/11605576860033745588noreply@blogger.com0