Search Results

Search found 1022 results on 41 pages for 'animate'.

Page 33/41 | < Previous Page | 29 30 31 32 33 34 35 36 37 38 39 40  | Next Page >

  • Silverlight hangs at 100% loaded.

    - by Spines
    My Silverlight website hangs at 100% loaded. There is no code for it, so far it is just the design in XAML, and it shows up fine in Expression Blend 3. It is the standard "Silverlight Website" project from Blend 3, without any modifications. When I press F5 to run it, it shows as a 100% loading circle in firefox and never actually shows my app. The loading circle continues to animate as if its doing something. Note: It worked yesterday, and I havent made very many changes to it since then.

    Read the article

  • Cocos2d-x Spritebatch node animation appears to be broken? cocos2d-x 2.0.3

    - by George Host
    Hi I have spent aprox 2 days trying to get this to work doing a google searches left and right and I did get it working except for sprite batch nodes. So in my class I am able to load kuwalio_stand.png and I tested kuwalio_walk1.png and 2 and 3 from the FrameCache(). They work for sure 100%. I run this code and it does not animate does anyone else have the same issue with sprite batch nodes? cocos2d::CCSprite * player = Player::create(); player->setPosition(cocos2d::CCPointMake(0.0f,0.0f)); player->setDisplayFrame(cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_stand.png")); player->setTag(PlayerTag); cocos2d::CCAnimation * walk = cocos2d::CCAnimation::create(); cocos2d::CCSpriteFrame * walk1 = cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_walk1"); cocos2d::CCSpriteFrame * walk2 = cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_walk2"); cocos2d::CCSpriteFrame * walk3 = cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_walk3"); walk->addSpriteFrame(walk1); walk->addSpriteFrame(walk2); walk->addSpriteFrame(walk3); cocos2d::CCAnimate * actionWalk = cocos2d::CCAnimate::create(walk); cocos2d::CCRepeatForever * actionRepeat = cocos2d::CCRepeatForever::create(actionWalk); walk->setDelayPerUnit(0.1f); actionWalk->setDuration(10.1f); this->runAction(actionRepeat); // Change camera to a soft follow camera. this->runAction(cocos2d::CCFollow::create(player)); mSceneSpriteBatchNode->addChild(player); // Have the CCNode object run its virtual update function as fast as possible. // Every frame for this layer. this-scheduleUpdate(); Counter example without the sprite batch node... cocos2d::CCSprite * sprite = cocos2d::CCSprite::create("kuwalio_walk1.png"); this->addChild(sprite,0); sprite->setPosition(cocos2d::CCPointMake(60,60)); sprite->retain(); cocos2d::CCAnimation * actionAnimation = cocos2d::CCAnimation::create(); actionAnimation->setDelayPerUnit(0.01f); actionAnimation->retain(); actionAnimation->addSpriteFrameWithFileName("kuwalio_walk1.png"); actionAnimation->addSpriteFrameWithFileName("kuwalio_walk2.png"); actionAnimation->addSpriteFrameWithFileName("kuwalio_walk3.png"); cocos2d::CCAnimate * a = cocos2d::CCAnimate::create(actionAnimation); a->setDuration(0.10f); cocos2d::CCRepeatForever * actionRepeat = cocos2d::CCRepeatForever::create(a); sprite->runAction(actionRepeat);

    Read the article

  • Silverlight Cream for April 07, 2010 -- #833

    - by Dave Campbell
    In this Issue: Alan Mendelevich, Siyamand Ayubi, Rudi Grobler(-2-), Josh Smith, VinitYadav, and Dave Campbell. Shoutouts: Jordan Knight has a demo up of a project he did for DigiGirlz: DigiGirlz, Deep Zoom and Azure, hopefully we'll get source later :) Jeremy Likness has a must-read post on his Ten Reasons to use the Managed Extensibility Framework I put this on another post earlier, but if you want some desktop bling for WP7, Ozymandias has some: I Love Windows Phone Wallpaper If you're not going to be in 'Vegas next week, Tim Heuer reminds us there's an alternative: Watch the Silverlight 4 Launch event and LIVE QA with ScottGu and others From SilverlightCream.com: Ghost Lines in Silverlight Alan Mendelevich reports an issue when drawing lines with odd coordinate values. He originated it in Silverlight 3, but it is there in SL4RC as well... check it out and leave him a comment. A Framework to Animate WPF and Silverlight Pages Similar to the PowerPoint Slides Siyamand Ayubi has an interesting post up on animating WPF or Silverlight pages to make them progress in the manner of a PPT slideshow. And it can also make phone calls… Rudi Grobler has a list of 'tasks' you can do with WP7 such as PhoneCallTask or EmailComposeTask ... looks like this should be plasticized :) Using the GPS, Accelerometer & Vibration Controller Rudi Grobler is also investigating how to use the GPS, Accelerometer, and Vibration in WP7 with a bunch of external links to back it up. Assembly-level initialization at design time Josh Smith has a solution to the problem of initializing design-time data in Blend (did you know that was an issue?) ... the solution is great and so is the running commentary between Josh and Karl Shifflett in the comments! ySurf : A Yahoo Messenger Clone built in Silverlight VinitYadav built a Yahoo Messenger app in Silverlight and has detailed out all the ugly bits for us on the post, plus made everything available. Your First Silverlight Application Dave Campbell's first post at DZone cracking open a beginner's series on Silverlight. If you're expecting something heavy-duty, skip this. If you're wanting to learn Silverlight and haven't jumped in yet, give it a try. Stay in the 'Light! Twitter SilverlightNews | Twitter WynApse | WynApse.com | Tagged Posts | SilverlightCream Join me @ SilverlightCream | Phoenix Silverlight User Group Technorati Tags: Silverlight    Silverlight 3    Silverlight 4    Windows Phone MIX10

    Read the article

  • Spritebatch node animation appears to be broken in cocos2d-x 2.0.3

    - by George Host
    Hi I have spent aprox 2 days trying to get this to work doing a google searches left and right and I did get it working except for sprite batch nodes. So in my class I am able to load kuwalio_stand.png and I tested kuwalio_walk1.png and 2 and 3 from the FrameCache(). They work for sure 100%. I run this code and it does not animate does anyone else have the same issue with sprite batch nodes? cocos2d::CCSprite * player = Player::create(); player->setPosition(cocos2d::CCPointMake(0.0f,0.0f)); player->setDisplayFrame(cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_stand.png")); player->setTag(PlayerTag); cocos2d::CCAnimation * walk = cocos2d::CCAnimation::create(); cocos2d::CCSpriteFrame * walk1 = cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_walk1.png"); cocos2d::CCSpriteFrame * walk2 = cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_walk2.png"); cocos2d::CCSpriteFrame * walk3 = cocos2d::CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("kuwalio_walk3.png"); walk->addSpriteFrame(walk1); walk->addSpriteFrame(walk2); walk->addSpriteFrame(walk3); cocos2d::CCAnimate * actionWalk = cocos2d::CCAnimate::create(walk); cocos2d::CCRepeatForever * actionRepeat = cocos2d::CCRepeatForever::create(actionWalk); walk->setDelayPerUnit(0.1f); actionWalk->setDuration(10.1f); player->runAction(actionRepeat); // Change camera to a soft follow camera. this->runAction(cocos2d::CCFollow::create(player)); mSceneSpriteBatchNode->addChild(player); // Have the CCNode object run its virtual update function as fast as possible. // Every frame for this layer. this-scheduleUpdate(); Counter example without the sprite batch node... cocos2d::CCSprite * sprite = cocos2d::CCSprite::create("kuwalio_walk1.png"); this->addChild(sprite,0); sprite->setPosition(cocos2d::CCPointMake(60,60)); sprite->retain(); cocos2d::CCAnimation * actionAnimation = cocos2d::CCAnimation::create(); actionAnimation->setDelayPerUnit(0.01f); actionAnimation->retain(); actionAnimation->addSpriteFrameWithFileName("kuwalio_walk1.png"); actionAnimation->addSpriteFrameWithFileName("kuwalio_walk2.png"); actionAnimation->addSpriteFrameWithFileName("kuwalio_walk3.png"); cocos2d::CCAnimate * a = cocos2d::CCAnimate::create(actionAnimation); a->setDuration(0.10f); cocos2d::CCRepeatForever * actionRepeat = cocos2d::CCRepeatForever::create(a); sprite->runAction(actionRepeat);

    Read the article

  • Silverlight Cream for March 13, 2011 -- #1059

    - by Dave Campbell
    In this Issue: András Velvárt, WIndowsPhoneGeek(-2-), Jesse Liberty(-2-), Victor Gaudioso, Kunal Chowdhury, Jeremy Likness, Michael Crump, and Dhananjay Kumar. Above the Fold: Silverlight: "Application Library Caching in Silverlight 4" Kunal Chowdhury WP7: "Handling WP7 orientation changes via Visual States" András Velvárt Shoutouts: Joe McBride gave a MEF Head User Group presentation and has posted How to Become a MEF Head – Slides & Code From SilverlightCream.com: Handling WP7 orientation changes via Visual States András Velvárt has an Expression Blend/WP7 post up discussing WP7 orientation changes and handling them via Visual States ... see an example from his SurfCube app, and a behavior to handle the control... with source. WP7 PerformanceProgressBar in depth WIndowsPhoneGeek has a post up discussing the WP7 Performance bar from the Windows Phone Toolkit. This is an update on the Toolkit based on the Feb 2011 release. Great explanation of the PerformanceProgressBar, external links, and sample code. Getting data out of WP7 WMAppManifest is easy with Coding4Fun PhoneHelper Next WindowsPhoneGeek has a post up about the PhoneHelper in the Coding4Fun TOolkit, and using it to get data out of the WMAppManifest easily. Good discussion, Links, and code as always Silverlight Unit Test For Phone In Jesse Liberty's "Windows Phone From Scratch" number 41, he's discussing Unit Testing for WP7... he gives some good external links and some good examples. Yet Another Podcast #27–Paul Betts Jesse Liberty's next post is his "Yet Another Podcast" number 27, and an interview with Paul Betts, the creator of Reactive UI... check out the podcast and also the good links listed. New Silverlight Video Tutorial: How to use the Fluid Move Behavior Victor Gaudioso has a new video tutorial up on using the Fluid Move Behavior... making a selected item animate from a ListBox to a Master Details Grid. Application Library Caching in Silverlight 4 Kunal Chowdhury takes a break from SilverlightZone long enough to write a post about Application Library Caching... for example on-demand loading of a 3rd-party XAP. Jounce Part 13: Navigation Parameters Jeremy Likness has his 13th post of a series in understanding his Jounce MVVM framework up. This episode surrounds a new release and what it contains, the primary focus being navigation parameters... that is you can raise a navigation event with a payload. Profiling Silverlight Applications after installing Visual Studio 2010 Service Pack 1 Michael Crump digs into the performance wizard for Silverlight that we get with VS2010 SP1. He shows how to get and read a profile... great intro to a new tool. Binding XML File to Data Grid in Silverlight Dhananjay Kumar demonstrates reading an XML file using LINQ to XML and binding the result to a Silverlight DataGrid Stay in the 'Light! Twitter SilverlightNews | Twitter WynApse | WynApse.com | Tagged Posts | SilverlightCream Join me @ SilverlightCream | Phoenix Silverlight User Group Technorati Tags: Silverlight    Silverlight 3    Silverlight 4    Windows Phone MIX10

    Read the article

  • Why learn Flash Builder 4 (Flex) when I can just use Flash Professional?

    - by Jason McKenna
    I want to learn Flash Builder 4 (Flex) because I see sooo many jobs requesting experience with it. i also just like knowing stuff. I am also very interested in focusing on RIA development now. BUT... can anyone tell me CLEARLY why the heck I would ever use FLEX over Flash Pro?? it is a time investment, so is it worth it? All I read are misguided posts about how Flash Pro is for games and banner ads, and Flex is for programmers and RIAs blah blah... this simply isn't so from my 9 years of contracting experience. I'm 99.9% certain that I can build anything a flex developer can build, but using Flash Pro. I can build powerful AS3-driven apps for the desktop, mobile device, or browser, and I can link to databases with XML and I can import text files and communicate with ColdFusion and everything. The advantage with Flash Pro is that I can also easily and clearly animate transitions and build custom elements that look the way I want/need them to look for my specific client. Why would I want to use a bunch of pre-built components that drive my file sizes to the moon?? Who is happy with a drag-n-drop button?? Is Flex just a thing made for programmer people with no artistic inclination? What is the advantage of using it?? It takes me back to Visual Basic class. Seems like a pain to have to use multiple tools to import crap from Flash Pro into Flex and yada yada... why when I can do it all nicely in Flash Pro to begin with. Am I clueless, or missing some major piece of the puzzle? Thanks for any clarity. PS, I couldn't care less about the code editors. It aint that bad people. They make it out like the thing doesn't even respond to keyboard input or something. Does everthing I need it do anyways. Please help out here. If I just dont need to learn it, I dont want to waste the time. Jase

    Read the article

  • Why learn Flash Builder 4 (Flex) when I can just use Flash Professional?

    - by Jason McKenna
    I want to learn Flash Builder 4 (Flex) because I see so many jobs requesting experience with it. I also just like knowing stuff. I am also very interested in focusing on RIA development now. BUT... can anyone tell me CLEARLY why the heck I would ever use FLEX over Flash Pro? It is a time investment, so is it worth it? All I read are misguided posts about how Flash Pro is for games and banner ads, and Flex is for programmers and RIAs blah blah... this simply isn't so from my 9 years of contracting experience. I'm 99.9% certain that I can build anything a flex developer can build, but using Flash Pro. I can build powerful AS3-driven apps for the desktop, mobile device, or browser, and I can link to databases with XML and I can import text files and communicate with ColdFusion and everything. The advantage with Flash Pro is that I can also easily and clearly animate transitions and build custom elements that look the way I want/need them to look for my specific client. Why would I want to use a bunch of pre-built components that drive my file sizes to the moon? Who is happy with a drag-n-drop button? Is Flex just a thing made for programmer people with no artistic inclination? What is the advantage of using it? It takes me back to Visual Basic class. Seems like a pain to have to use multiple tools to import crap from Flash Pro into Flex and yada yada... why when I can do it all nicely in Flash Pro to begin with. Am I clueless, or missing some major piece of the puzzle? Thanks for any clarity. PS, I couldn't care less about the code editors. It ain't that bad people. They make it out like the thing doesn't even respond to keyboard input or something. Does everything I need it do anyways. Please help out here. If I just don't need to learn it, I don't want to waste the time.

    Read the article

  • Dynamic character animation - Using the physics engine or not

    - by Lex Webb
    I'm planning on building a dynamic reactant animation engine for the characters in my 2D Game. I have already built templates for a skeleton based animation system using key frames and interpolation to specify a limbs position at any given moment in time. I am using Farseer physics (an extension of Box2D) in Monogame/XNA in C# My real question lies in how i go about tying this character animation into the physics engine. I have two options: Moving limbs using physics engine - applying a interpolated force to each limb (dynamic body) in order to attempt to get it to its position as donated by the skeleton animation. Moving limbs by simply changing the position of a fixed body - Updating the new position of each limb manually, attempting to take into account physics collisions. Then stepping the physics after the animation to allow for environment interaction. Each of these methods have their distinct advantages and disadvantages. Physics based movement Advantages: Possibly more natural/realistic movement Better interaction with game objects as force applying to objects colliding with characters would be calculated for me. No need to convert to dynamic bodies when reacting to projectiles/death/fighting. Disadvantages: Possible difficulty in calculating correct amount of force to move a limb a certain distance at a constant rate. Underlying character balance system would need to be created that would need to be robust enough to prevent characters falling over at the touch of a feather. Added code complexity and processing time for the above. Static Object movement Advantages: Easy to interpolate movement of limbs between game steps Moving limbs is as simple as applying a rotation to the skeleton bone. Greater control over limbs, wont need to worry about characters falling over as all animation would be pre-defined. Disadvantages: Possible unnatural movement (Depends entirely on my animation skills!) Bad physics collision reactions with physics engine (Dynamic bodies simply slide out of the way of static objects) Need to calculate collisions with physics objects and my limbs myself and apply directional forces to them. Hard to account for slopes/stairs/non standard planes when animating walking/running animations. Need to convert objects to dynamic when reacting to projectile/fighting/death physics objects. The Question! As you can see, i have thought about this extensively, i have also had Google into physics based animation and have found mostly dissertation papers! Which is filling me with sense that it may a lot more advanced than my mathematics skills. My question is mostly subjective based on my findings above/any experience you may have: Which of the above methods should i use when creating my game? I am willing to spend the time to get a physics solution working if you think it would be possible. In the end i want to provide the most satisfying experience for the gamer, as well as a robust and dynamic system i can use to animate pretty much anything i need.

    Read the article

  • Attaching new animations onto skeleton via props, a good idea?

    - by Cardin
    I'm thinking of coding a game with an idea of mine. I've coded 2D games before, but I'm new to 3D programming, so I'd like to ask if this idea of mine is feasible or out of my depth. I'm making a game where there are many different characters for the player to choose from (JRPG style). So to save time, I have an idea of creating many different varied characters using a completely naked body mesh and animation skeleton, standardised across all characters. For example, by placing different hair, boots, armor props on the character mesh, new characters can be formed. Kinda like playing dress-up with a barbie doll. I'm thinking this can be done by having a bone on the prop that I can programmically attach to the main mesh. Also, I plan to have some props add new animations to the base skeleton, so equipping some particular props would give it new attack, damage, idle animations. This is because I can't expect the character to have the same swinging animation if he had a big sword or an axe. I think this might be possible if the prop has its own instance of the animation skeleton with just only the new animations, and parenting the base body mesh to this new skeleton. So all the base body mesh has are just the basic animations, other animations come from the props. My concerns are, 1) the props might not attach to the mesh properly and jitter a lot, 2) since prop and body are animated differently, the props and base mesh will cause visual artefacts, like the naked thighs showing through the pants when the character walks, 3) a custom pipeline have to be developed to export skeletons without mesh, and also to attach the base body mesh to a new skeleton during runtime in the game. So my question: are these features considered 'easy' to code? Or am I trying to do something few have ever succeeded with on their own? It feels like all these can be done given enough time and I know I definitely have to do a bit of bone matrix calculations, but I really don't want to drag out the development timeline unnecessarily from coding mathematically intense things or analyzing how to parse 3D export formats. I'm currently only at the Game Design stage, so if these features aren't a good idea, I can simply change the design of the game. (Unrelated to question) I could always, as last resort, have the characters have predetermined outfit and weapon selections so as to animate everything manually.

    Read the article

  • Where i set touch effect when a spawn Srite are comming on the screen?

    - by shihab_returns
    I just create a scene where create a spawn spirit that comes from above screen height in Landscape mode. Now i want to remove spirits when i touch on it. I tried but seems the code not works and crashed also after a while. here is my code: /** TimerHandler for collision detection and cleaning up */ IUpdateHandler detect = new IUpdateHandler() { @Override public void reset() { } @Override public void onUpdate(float pSecondsElapsed) { Iterator<AnimatedSprite> targets = targetLL.iterator(); AnimatedSprite _target; while (targets.hasNext()) { _target = targets.next(); if (_target.getY() >= cameraHeight) { // removeSprite(_target, targets); tPool.recyclePoolItem(_target); targets.remove(); Log.d("ok", "---------Looop Inside-----"); // fail(); break; } } targetLL.addAll(TargetsToBeAdded); TargetsToBeAdded.clear(); } }; /** adds a target at a random location and let it move along the y-axis */ public void addTarget() { Random rand = new Random(); int minX = mTargetTextureRegion.getWidth(); int maxX = (int) (mCamera.getWidth() - mTargetTextureRegion.getWidth()); int rangeX = maxX - minX; Log.d("----point----", "minX:" + minX + "maxX:" + maxX + "rangeX:" + rangeX); int rX = rand.nextInt(rangeX) + minX; int rY = (int) mCamera.getHeight() + mTargetTextureRegion.getHeight(); Log.d("---Random x----", "Random x" + rX + "Random y" + rY); target = tPool.obtainPoolItem(); target.setPosition(rX, rY); target.animate(100); mMainScene.attachChild(target, 1); mMainScene.registerTouchArea(target); int minDuration = 2; int maxDuration = 32; int rangeDuration = maxDuration - minDuration; int actualDuration = rand.nextInt(rangeDuration) + minDuration; // MoveXModifier mod = new MoveXModifier(actualDuration, target.getX(), // -target.getWidth()); MoveYModifier mody = new MoveYModifier(actualDuration, -target.getHeight(), cameraHeight + 10); target.registerEntityModifier(mody.deepCopy()); TargetsToBeAdded.add(target); } @Override public boolean onAreaTouched(final TouchEvent pSceneTouchEvent, final ITouchArea pTouchArea, final float pTouchAreaLocalX, final float pTouchAreaLocalY) { if (pTouchArea == target) { Toast.makeText(getApplicationContext(), "Yoooooooo", Toast.LENGTH_LONG).show(); } return true; } ** My question is where i implements IOnAreaTouchListener in My code. ? ** Thanks in Advance.

    Read the article

  • Modifying a HTML page to fix several "bugs" add a function to next/previous on a option dropdown

    - by Dennis Sylvian
    SOF, I've got a few problems plaguing me at the moment and am wondering if anyone could assist me with them. I'm trying to get Next Class | Previous Class to act as buttons so that when Next Class is clicked it will go to the next item in the dropdown list and for previous it would go to back one. There used to be a scroll bar that allowed me to scroll the main window left and right, it's missing because (I think it was to do with the scroll left and scroll right function) The footer at the bottom doesn't show correctly on mobile devices; for some reason it appears completely differently to as it does on a computer. The "bar" practically and the Scroll Left and Scroll buttons don't appear at all on mobile devices. The scroll left button is unable to be clicked for some reason, I'm unsure what I've done wrong. Refreshing the page resets the horizontal scroll position to far left (I'm pretty sure this relates to the scroll bar) I want to also find a way so that on mobile devices the the header will not show the placeholder image, however I can't work out what CSS media tag(s) I should be using. Latest: http://jsfiddle.net/pwv7u/ Smaller HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>DATA DATA DATA DATA DATA DATA DATA DATA</title> <style type="text/css"> <!-- @import url("nstyle.css"); --> </style> <script src="jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready( function() { for (var i=0;i<($("table").children().length);i++){ if(readCookie(i)) $($($("table").children()[i]).children()[(readCookie(i))]).toggleClass('selected').siblings().removeClass('selected'); } $("tr").click(function(){ $(this).toggleClass('selected').siblings().removeClass('selected'); if(readCookie($(this).parent().index())){ if(readCookie($(this).parent().index())==$(this).index()) eraseCookie($(this).parent().index()); else{ eraseCookie($(this).parent().index()); createCookie($(this).parent().index(),$(this).index(),1); } } else createCookie($(this).parent().index(),$(this).index(),1); }); // gather CLASS info var selector = $('.class-selector').on('change', function(){ var id = this.value; if (id!==''){ scrollToAnchor(id); } }); $('a[id^="CLASS"]').each(function(){ var id = this.id, option = $('<option>',{ value: this.id, text:this.id }); selector.append(option); }); function scrollToAnchor(aid) { var aTag = $("a[id='" + aid + "']"); $('html,body').animate({ scrollTop: aTag.offset().top - 80 }, 1); } $("a.TOPJS").click(function () { scrollToAnchor('TOP'); }); $("a.KEYJS").click(function () { scrollToAnchor('KEY'); }); $("a.def").click(function () { $('#container').animate({ "scrollLeft": "-=204" }, 200); }); $("a.abc").click(function () { $("#container").animate({ "scrollLeft": "+=204" }, 200); }); function createCookie(name,value,days) { var expires; if (days) { var date = new Date(); date.setMilliseconds(0); date.setSeconds(0); date.setMinutes(0); date.setHours(0); date.setDate(date.getDate()+days); expires = "; expires="+date.toGMTString(); } else expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length,c.length); } return null; } function eraseCookie(name) { createCookie(name,"",-1); } }); </script> </head> <body> <div id="header_container"> <div id="header"> <a href="http://site.x/" target="_blank"><img src="http://placehold.it/300x80"></a> <select class="class-selector"> <option value="">-select class-</option> </select> <div class="classcycler"> <a href="#TOP"><font color=#EFEFEF>Next Class</font></a> <font color=red>|</font> <a href="#TOP"><font color=#EFEFEF>Previous Class</font></a> </div> <div id="header1"> Semi-Transparent Image <a href="#TOP"><font color=#EFEFEF>Up to Top</font></a> | <a href="#KEY"><font color=#EFEFEF>Down to Key</font></a> </div> </div> </div> <a id="TOP"></a> <div id="container"> <table id="gradient-style"> <tbody> <thead> <tr> <th scope="col"><a id="CLASS1"></a>Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class<br>Test 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class Data 1</th> <th scope="col">Class 1<br>Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1<br>Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1</th> <th scope="col">Class 1 Class 1</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> (data text)</th> <th scope="col">title text</th> <th scope="col">text</th> <th scope="col">text</th> <th scope="col">title text</th> <th scope="col">title text</th> </tr> </thead> <tr class="ft3"><td>testing data</td><td>testing data</td><td>test</td><td>class b</td><td>test4</td><td><div align="left">data</div></td><td><div align="left"> </div></td><td><div align="left"></div></td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><tr> <tr class="f3"><td>test</td><td>test</td><td>test</td><td>class a</td><td>test2</td><td><div align="left"> </div></td><td><div align="left"></div></td><td><div align="left"></div></td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><tr> <thead> <tr> <th scope="col"><a id="CLASS2"></a>Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class<br>Test 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class Data 2</th> <th scope="col">Class 2<br>Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2<br>Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2</th> <th scope="col">Class 2 Class 2</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> data text</th> <th scope="col">title text<br> (data text)</th> <th scope="col">title text</th> <th scope="col">text</th> <th scope="col">text</th> <th scope="col">title text</th> <th scope="col">title text</th> </tr> </thead> <tr class="ft3"><td>testing data</td><td>testing data</td><td>test</td><td>class f</td><td>test2</td><td><div align="left">data</div></td><td><div align="left"></div></td><td><div align="left">data</div></td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><tr> <tr><td>test</td><td>testing data</td><td>test</td><td>class f</td><td>test4</td><td><div align="left">data</div></td><td><div align="left"></div></td><td><div align="left"></div></td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><tr> <tr class="f3"><td>test</td><td>testing data</td><td>testing data</td><td>class d</td><td>test5</td><td><div align="left">data</div></td><td><div align="left"> </div></td><td><div align="left">data</div></td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><tr> <tr><td>testing data</td><td>test</td><td>test</td><td>class f</td><td>test5</td><td><div align="left"></div></td><td><div align="left"></div></td><td><div align="left">data</div></td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>test</td><td>testing data</td><tr> <tr class="f2"><td>test</td><td>test</td><td>testing data</td><td>class a</td><td>test1</td><td><div align="left">data</div></td><td><div align="left"> </div></td><td><div align="left">data</div></td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>test</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>testing data</td><td>test</td><td>testing data</td><td>testing data</td><td>test</td><tr> </tbody> <tfoot> <tr> <th class="alt" colspan="34" scope="col"><a id="KEY"></a><img src="http://placehold.it/300x50"></th> </tr> <tr> <td colspan="34"><em><b>DATA DATA</b> - DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA </em></td> </tr> <tr> <td class="alt" colspan="34"><em><b>DAT DATA</b> - DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA DATA </em></td> </tr> </tfoot> </table> </div> <div id="footer_container"> <div id="footer"> <a href="http://site.x/" target="_blank"><img src="http://placehold.it/300x80"></a> <div class="footleft"> <a class="def" href="javascript: void(0);"><font color="#EFEFEF">Scroll Left</font></a> </div> <div id="footer1"> <font color="darkblue">Semi-Transparent Image</font> <i>Copyright &copy; 2013 <a href="http://site.x/" target="_blank" style="text-decoration: none"><font color=#ADD8E6>site</font></a>.</i> </div> <div id="footer2"> <i>All Rights Reserved.</i> </div> <div class="footright"> <a class="abc" href="javascript: void(0);"><font color="#EFEFEF">Scroll Right</font></a> </div> </div> </div> </body> </html> CSS gradient-style * { white-space: nowrap; } #header .class-selector { top: 10px; left: 20px; position: fixed; } #header .classcycler { top: 45px; left: 20px; position: fixed; font-size:20px; } body { line-height: 1.6em; background-color: #535353; overflow-x: scroll; } #gradient-style { font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif; font-size: 12px; margin: 0px; width: 100%; text-align: center; border-collapse: collapse; } #gradient-style th { font-size: 13px; font-weight: normal; line-height:250%; padding-left: 5px; padding-right: 5px; background: #535353 url('table-images/gradhead.png') repeat-x; border-top: 1px solid #fff; border-bottom: 1px solid #fff; color: #ffffff; } #gradient-style th.alt { font-family: "Times New Roman", Serif; text-align: left; padding: 10px; font-size: 26px; } #gradient-style td { padding-left: 5px; padding-right: 5px; border-bottom: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #fff; color: #00000; border-top: 1px solid #fff; background: #FFF url('table-images/gradback.png') repeat-x; } #gradient-style tr.ft3 td { color: #00000; background: #99cde7 url('table-images/gradoverallstudent.png') repeat-x; font-weight: bold; } #gradient-style tr.f1 td { color: #00000; background: #99cde7 url('table-images/gradbeststudent.png') repeat-x; } #gradient-style tr.f2 td { color: #00000; background: #b7e2b6 url('table-images/gradmostattentedstudent.png') repeat-x; } #gradient-style tr.f3 td { color: #00000; background: #a9cd6c url('table-images/gradleastlatestudtent.png') repeat-x; } #gradient-style tfoot tr td { background: #6FA275; font-size: 12px; color: #000; padding: 10; text-align: left; } #gradient-style tbody tr:hover td, #gradient-style tbody tr.selected td { background: #d0dafd url('table-images/gradhover.png') repeat-x; color: #339; } body { margin: 0; padding: 0; } #header_container { background: #000000 url('table-images/gradhead.png') repeat-x; border: 0px solid #666; height: 80px; left: 0; position: fixed; width: 100%; top: 0; } #header { position: relative; margin: 0 auto; width: 500px; height: 100%; text-align: center; color: #0c0aad; } #header1 { position: absolute; width: 125%; top: 50px; } #container { margin: 0 auto; overflow: auto; padding: 80px 0; width: 100%; } #content { } #footer_container { background: #000000 url('table-images/gradhead.png') repeat-x; border: 0px solid #666; bottom: 0; height: 95px; left: 0; position: fixed; width: 100%; } #footer { position: relative; margin: 0 auto; height: 100%; text-align: center; color: #FFF; } #footer1 { position: absolute; width: 103%; top: 50px; } #footer2 { position: absolute; width: 110%; top: 70px; } #footer .footleft { top: 45px; left: 2%; position: absolute; font-size:20px; } #footer .footright { top: 45px; right: 2%; position: absolute; font-size:20px; }

    Read the article

  • PowerPoint '10 avoid animation completion on click & advance slide or start new one

    - by ScottS
    Scenario I have PowerPoint 2010 On the "Transitions" tab the "Advance Slide On Mouse Click" check box is checked. I have a long, slow, timed, non-repeating animation working in the background of the slide. I click to advance the slide before the animation is finished, but ... Instead of advancing the slide, the animation moves to the completed state ... Forcing a second click to actually advance the slide. Additionally If I have other animations on the slide that are initiated by a click, the long animation also advances to a finished state before starting the new animation. Desired Behavior On click, I want the slide to advance or the next on-click animation to start whether the long animation is done or not, and without having that long animation first "complete" itself. In the case of another animation, I simply want the long animation to continue, while also doing the new animation. Ultimate Question Is there a way to either: Set an option somewhere to not have that animation complete on click and simply "continue" to animate with the start of a new animation or to advance the slide (as the case may be)? Create a VBA script that will produce the desired behavior for the long animation?

    Read the article

  • PowerPoint avoid animation completion on click & advance slide or start new one

    - by ScottS
    Scenario I have PowerPoint 2010 On the "Transitions" tab the "Advance Slide On Mouse Click" check box is checked. I have a long, slow, timed, non-repeating animation working in the background of the slide. I click to advance the slide before the animation is finished, but ... Instead of advancing the slide, the animation moves to the completed state ... Forcing a second click to actually advance the slide. Additionally If I have other animations on the slide that are initiated by a click, the long animation also advances to a finished state before starting the new animation. Desired Behavior On click, I want the slide to advance or the next on-click animation to start whether the long animation is done or not, and without having that long animation first "complete" itself. In the case of another animation, I simply want the long animation to continue, while also doing the new animation. Ultimate Question Is there a way to either: Set an option somewhere to not have that animation complete on click and simply "continue" to animate with the start of a new animation or to advance the slide (as the case may be)? Create a VBA script that will produce the desired behavior for the long animation?

    Read the article

  • Firefox will not remember local site cookie

    - by Campo
    This is a weird one. We have a production server (Server 2008) and two staging servers (Server 2008 and Server 2003) I have sites on all of these. They all use cookies. On the Production server when browsing to our site www.supernovainteractive.com there is a cookie that detects when you visted the site and it will not refresh the logo animation (top left hand side) on clicking to another page. This works for all browsers on the production server. I’m not sure what’s going on but for some reason cookies are not working on one site in the 2008 staging server only. This is when browsing using Firefox (3.6.3) they work fine on all other browsers (IE, Chrome, Safari, Opera) In addition, the 2003 staging server works fine. You can test on the Supernova Interactive site by noticing the logo in the top left corner. It uses a cookie to detect if you’ve already seen the animation. Once you’ve seen it once, it doesn’t animate again until tomorrow. Currently, it’s animating every time. I have opened an outside facing port so others can see the issue. Http://exchange.supernova.com:10009 Any ideas on this one? Firewalls are off on the server. Notice you do not get a cookie from Exchange.supernova.com.

    Read the article

  • PowerPoint 2007 slides are only partially converted to PDF since SP3

    - by Tim Pietzcker
    EDIT: Microsoft support has confirmed that it's a bug with PowerPoint 2007 SP3. I have recently encountered a problem with the "Save as PDF/XPS" add-in for PowerPoint 2007. When I use "Save as PDF/XPS" to create a PDF version of my presentation, some slides are only partially included in the resulting PDF file. For example, this: (download the PPTX file here) is reduced to this (in Adobe Reader X or Acrobat Pro X (both 10.1.1)): (download the PDF file here) So far, I have only encountered this with slides that contain animation elements, but which part of the elements remain in the PDF version appears not to have anything to do with the order in which the animated elements appear, so that might just be a coincidence. Update: The problem persists even if I "un-animate" the slides (removing the animation but leaving the previously animated elements intact). When viewing the affected slides in Acrobat Reader, it sometimes complains about the file containing invalid elements, and that I should complain to whoever generated the PDF file... Update 2: I have just installed Office 2007 on a new Windows 7 x64 PC. With the original Office version (12.0.4518.1014 MSO 12.0.6562.5003), a correct PDF file is generated. After installation of SP3 (12.0.6606.1000 SP3 MSO 12.0.6607.1000) a corrupt PDF file is generated. Today's Microsoft Updates (to PowerPoint version 12.0.6654.5000) haven't changed anything, by the way. Update 3: I have opened a tech support incident with Microsoft. They have confirmed the "limitation", as they called it, and it is indeed limited to 2007 SP 3 only. They are going to pass it on to the developers but they can't say when or even if a fix would be forthcoming, so I guess I'll upgrade to 2010...

    Read the article

  • Firefox Does NOT get local site cookie

    - by Campo
    This is a weird one. We have a production server (Server 2008) and two staging servers (Server 2008 and Server 2003) I have sites on all of these. They all use cookies. On the Production server when browsing to our site www.supernovainteractive.com there is a cookie that detects when you visted the site and it will not refresh the logo animation (top left hand side) on clicking to another page. This works for all browsers on the production server. I’m not sure what’s going on but for some reason cookies are not working on one site in the 2008 staging server only. This is when browsing using Firefox (3.6.3) they work fine on all other browsers (IE, Chrome, Safari, Opera) In addition, the 2003 staging server works fine. You can test on the Supernova Interactive site by noticing the logo in the top left corner. It uses a cookie to detect if you’ve already seen the animation. Once you’ve seen it once, it doesn’t animate again until tomorrow. Currently, it’s animating every time. I have opened an outside facing port so others can see the issue. Http://exchange.supernova.com:10009 Any ideas on this one? Firewalls are off on the server. Notice you do not get a cookie from Exchange.supernova.com.

    Read the article

  • Avoid Jquery Plugin Conflict

    - by user1511579
    on the same page i'm using this plugin: $g=jQuery.noConflict(); $g(function() { /* number of fieldsets */ var fieldsetCount = $g('#formElem').children().length; /* current position of fieldset / navigation link */ var current = 1; /* sum and save the widths of each one of the fieldsets set the final sum as the total width of the steps element */ var stepsWidth = 0; var widths = new Array(); $g('#steps .step').each(function(i){ var $step = $g(this); widths[i]   = stepsWidth; stepsWidth += $step.width(); }); $g('#steps').width(stepsWidth); /* to avoid problems in IE, focus the first input of the form */ $g('#formElem').children(':first').find(':input:first').focus(); /* show the navigation bar */ $g('#navigation_form').show(); /* when clicking on a navigation link  the form slides to the corresponding fieldset */ $g('#navigation_form a').bind('click',function(e){ var $this = $g(this); var prev = current; $this.closest('ul').find('li').removeClass('selected'); $this.parent().addClass('selected'); /* we store the position of the link in the current variable */ current = $this.parent().index() + 1; /* animate / slide to the next or to the corresponding fieldset. The order of the links in the navigation is the order of the fieldsets. Also, after sliding, we trigger the focus on the first  input element of the new fieldset If we clicked on the last link (confirmation), then we validate all the fieldsets, otherwise we validate the previous one before the form slided */ $g('#steps').stop().animate({ marginLeft: '-' + widths[current-1] + 'px' },500,function(){ if(current == fieldsetCount) validateSteps(); else validateStep(prev); $g('#formElem').children(':nth-child('+ parseInt(current) +')').find(':input:first').focus(); }); e.preventDefault(); }); /* clicking on the tab (on the last input of each fieldset), makes the form slide to the next step */ $g('#formElem > fieldset').each(function(){ var $fieldset = $g(this); $fieldset.children(':last').find(':input').keydown(function(e){ if (e.which == 9){ $g('#navigation_form li:nth-child(' + (parseInt(current)+1) + ') a').click(); /* force the blur for validation */ $g(this).blur(); e.preventDefault(); } }); }); /* validates errors on all the fieldsets records if the Form has errors in $('#formElem').data() */ function validateSteps(){ var FormErrors = false; for(var i = 1; i < fieldsetCount; ++i){ var error = validateStep(i); if(error == -1) FormErrors = true; } $g('#formElem').data('errors',FormErrors); } /* validates one fieldset and returns -1 if errors found, or 1 if not */ function validateStep(step){ if(step == fieldsetCount) return; var error = 1; var hasError = false; $g('#formElem').children(':nth-child('+ parseInt(step) +')').find(':input:not(button)').each(function(){ var $this = $g(this); var valueLength = jQuery.trim($this.val()).length; if(valueLength == ''){ hasError = true; $this.css('background-color','#FFEDEF'); } else $this.css('background-color','#FFFFFF'); }); var $link = $g('#navigation_form li:nth-child(' + parseInt(step) + ') a'); $link.parent().find('.error,.checked').remove(); var valclass = 'checked'; if(hasError){ error = -1; valclass = 'error'; } $g('<span class="'+valclass+'"></span>').insertAfter($link); return error; } /* if there are errors don't allow the user to submit */ $g('#registerButton').bind('click',function(){ if($g('#formElem').data('errors')){ alert('Please correct the errors in the Form'); return false; } }); }); and this one: (function($){ $countCursos = 1; $countFormsA = 1; $countFormsB = 1; $.fn.addForms = function(idform){ var adicionar_curso = "<p>"+ " <label for='nome_curso'>Nome do Curso</label>"+ " <input id='nome_curso' name='nome_curso["+$countCursos+"]' type='text' />"+ " </p>"; var myform2 = "<table>"+ " <tr>"+ " <td>Field C</td>"+ " <td><input type='text' name='fieldc["+$countFormsA+"]'></td>"+ " <td>Field D ("+$countFormsA+"):</td>"+ " <td><textarea name='fieldd["+$countFormsA+"]'></textarea></td>"+ " <td><button>remove</button></td>"+ " </tr>"+ "</table>"; var myform3 = "<table>"+ " <tr>"+ " <td>Field C</td>"+ " <td><input type='text' name='fieldc["+$countFormsB+"]'></td>"+ " <td>Field D ("+$countFormsB+"):</td>"+ " <td><textarea name='fieldd["+$countFormsB+"]'></textarea></td>"+ " <td><button>remove</button></td>"+ " </tr>"+ "</table>"; if(idform=='novo_curso'){ alert(idform); adicionar_curso = $("<div>"+adicionar_curso+"</div>"); $("button", $(adicionar_curso)).click(function(){ $(this).parent().parent().remove(); }); $(this).append(adicionar_curso); $countCursos++; } if(idform=='mybutton1'){ alert(idform); myform2 = $("<div>"+myform2+"</div>"); $("button", $(myform2)).click(function(){ $(this).parent().parent().remove(); }); $(this).append(myform2); $countFormsA++; } if(idform=='mybutton2'){ alert(idform); myform3 = $("<div>"+myform3+"</div>"); $("button", $(myform3)).click(function(){ $(this).parent().parent().remove(); }); $(this).append(myform3); $countFormsB++; } }; })(jQuery); $(function(){ $("#mybutton1").bind("click", function(e){ e.preventDefault(); var idform=this.id; if($countFormsA<3){ $("#container1").addForms(idform); } }); }); $(function(){ $("#novo_curso").bind("click", function(e){ e.preventDefault(); var idform=this.id; alert(idform); if($countCursos<3){ $("#outro_curso").addForms(idform); } }); }); $(function(){ $("#mybutton2").bind("click", function(e){ e.preventDefault(); var idform=this.id; if($countFormsB<3){ $("#container2").addForms(idform); } }); }); My problem is the two are making conflict: I added previously the $g on the first to avoid conflict, but the truth is they don't work together, any hint how can i configure the second one to avoid this? Thanks in advance!

    Read the article

  • 256 Windows Azure Worker Roles, Windows Kinect and a 90's Text-Based Ray-Tracer

    - by Alan Smith
    For a couple of years I have been demoing a simple render farm hosted in Windows Azure using worker roles and the Azure Storage service. At the start of the presentation I deploy an Azure application that uses 16 worker roles to render a 1,500 frame 3D ray-traced animation. At the end of the presentation, when the animation was complete, I would play the animation delete the Azure deployment. The standing joke with the audience was that it was that it was a “$2 demo”, as the compute charges for running the 16 instances for an hour was $1.92, factor in the bandwidth charges and it’s a couple of dollars. The point of the demo is that it highlights one of the great benefits of cloud computing, you pay for what you use, and if you need massive compute power for a short period of time using Windows Azure can work out very cost effective. The “$2 demo” was great for presenting at user groups and conferences in that it could be deployed to Azure, used to render an animation, and then removed in a one hour session. I have always had the idea of doing something a bit more impressive with the demo, and scaling it from a “$2 demo” to a “$30 demo”. The challenge was to create a visually appealing animation in high definition format and keep the demo time down to one hour.  This article will take a run through how I achieved this. Ray Tracing Ray tracing, a technique for generating high quality photorealistic images, gained popularity in the 90’s with companies like Pixar creating feature length computer animations, and also the emergence of shareware text-based ray tracers that could run on a home PC. In order to render a ray traced image, the ray of light that would pass from the view point must be tracked until it intersects with an object. At the intersection, the color, reflectiveness, transparency, and refractive index of the object are used to calculate if the ray will be reflected or refracted. Each pixel may require thousands of calculations to determine what color it will be in the rendered image. Pin-Board Toys Having very little artistic talent and a basic understanding of maths I decided to focus on an animation that could be modeled fairly easily and would look visually impressive. I’ve always liked the pin-board desktop toys that become popular in the 80’s and when I was working as a 3D animator back in the 90’s I always had the idea of creating a 3D ray-traced animation of a pin-board, but never found the energy to do it. Even if I had a go at it, the render time to produce an animation that would look respectable on a 486 would have been measured in months. PolyRay Back in 1995 I landed my first real job, after spending three years being a beach-ski-climbing-paragliding-bum, and was employed to create 3D ray-traced animations for a CD-ROM that school kids would use to learn physics. I had got into the strange and wonderful world of text-based ray tracing, and was using a shareware ray-tracer called PolyRay. PolyRay takes a text file describing a scene as input and, after a few hours processing on a 486, produced a high quality ray-traced image. The following is an example of a basic PolyRay scene file. background Midnight_Blue   static define matte surface { ambient 0.1 diffuse 0.7 } define matte_white texture { matte { color white } } define matte_black texture { matte { color dark_slate_gray } } define position_cylindrical 3 define lookup_sawtooth 1 define light_wood <0.6, 0.24, 0.1> define median_wood <0.3, 0.12, 0.03> define dark_wood <0.05, 0.01, 0.005>     define wooden texture { noise surface { ambient 0.2  diffuse 0.7  specular white, 0.5 microfacet Reitz 10 position_fn position_cylindrical position_scale 1  lookup_fn lookup_sawtooth octaves 1 turbulence 1 color_map( [0.0, 0.2, light_wood, light_wood] [0.2, 0.3, light_wood, median_wood] [0.3, 0.4, median_wood, light_wood] [0.4, 0.7, light_wood, light_wood] [0.7, 0.8, light_wood, median_wood] [0.8, 0.9, median_wood, light_wood] [0.9, 1.0, light_wood, dark_wood]) } } define glass texture { surface { ambient 0 diffuse 0 specular 0.2 reflection white, 0.1 transmission white, 1, 1.5 }} define shiny surface { ambient 0.1 diffuse 0.6 specular white, 0.6 microfacet Phong 7  } define steely_blue texture { shiny { color black } } define chrome texture { surface { color white ambient 0.0 diffuse 0.2 specular 0.4 microfacet Phong 10 reflection 0.8 } }   viewpoint {     from <4.000, -1.000, 1.000> at <0.000, 0.000, 0.000> up <0, 1, 0> angle 60     resolution 640, 480 aspect 1.6 image_format 0 }       light <-10, 30, 20> light <-10, 30, -20>   object { disc <0, -2, 0>, <0, 1, 0>, 30 wooden }   object { sphere <0.000, 0.000, 0.000>, 1.00 chrome } object { cylinder <0.000, 0.000, 0.000>, <0.000, 0.000, -4.000>, 0.50 chrome }   After setting up the background and defining colors and textures, the viewpoint is specified. The “camera” is located at a point in 3D space, and it looks towards another point. The angle, image resolution, and aspect ratio are specified. Two lights are present in the image at defined coordinates. The three objects in the image are a wooden disc to represent a table top, and a sphere and cylinder that intersect to form a pin that will be used for the pin board toy in the final animation. When the image is rendered, the following image is produced. The pins are modeled with a chrome surface, so they reflect the environment around them. Note that the scale of the pin shaft is not correct, this will be fixed later. Modeling the Pin Board The frame of the pin-board is made up of three boxes, and six cylinders, the front box is modeled using a clear, slightly reflective solid, with the same refractive index of glass. The other shapes are modeled as metal. object { box <-5.5, -1.5, 1>, <5.5, 5.5, 1.2> glass } object { box <-5.5, -1.5, -0.04>, <5.5, 5.5, -0.09> steely_blue } object { box <-5.5, -1.5, -0.52>, <5.5, 5.5, -0.59> steely_blue } object { cylinder <-5.2, -1.2, 1.4>, <-5.2, -1.2, -0.74>, 0.2 steely_blue } object { cylinder <5.2, -1.2, 1.4>, <5.2, -1.2, -0.74>, 0.2 steely_blue } object { cylinder <-5.2, 5.2, 1.4>, <-5.2, 5.2, -0.74>, 0.2 steely_blue } object { cylinder <5.2, 5.2, 1.4>, <5.2, 5.2, -0.74>, 0.2 steely_blue } object { cylinder <0, -1.2, 1.4>, <0, -1.2, -0.74>, 0.2 steely_blue } object { cylinder <0, 5.2, 1.4>, <0, 5.2, -0.74>, 0.2 steely_blue }   In order to create the matrix of pins that make up the pin board I used a basic console application with a few nested loops to create two intersecting matrixes of pins, which models the layout used in the pin boards. The resulting image is shown below. The pin board contains 11,481 pins, with the scene file containing 23,709 lines of code. For the complete animation 2,000 scene files will be created, which is over 47 million lines of code. Each pin in the pin-board will slide out a specific distance when an object is pressed into the back of the board. This is easily modeled by setting the Z coordinate of the pin to a specific value. In order to set all of the pins in the pin-board to the correct position, a bitmap image can be used. The position of the pin can be set based on the color of the pixel at the appropriate position in the image. When the Windows Azure logo is used to set the Z coordinate of the pins, the following image is generated. The challenge now was to make a cool animation. The Azure Logo is fine, but it is static. Using a normal video to animate the pins would not work; the colors in the video would not be the same as the depth of the objects from the camera. In order to simulate the pin board accurately a series of frames from a depth camera could be used. Windows Kinect The Kenect controllers for the X-Box 360 and Windows feature a depth camera. The Kinect SDK for Windows provides a programming interface for Kenect, providing easy access for .NET developers to the Kinect sensors. The Kinect Explorer provided with the Kinect SDK is a great starting point for exploring Kinect from a developers perspective. Both the X-Box 360 Kinect and the Windows Kinect will work with the Kinect SDK, the Windows Kinect is required for commercial applications, but the X-Box Kinect can be used for hobby projects. The Windows Kinect has the advantage of providing a mode to allow depth capture with objects closer to the camera, which makes for a more accurate depth image for setting the pin positions. Creating a Depth Field Animation The depth field animation used to set the positions of the pin in the pin board was created using a modified version of the Kinect Explorer sample application. In order to simulate the pin board accurately, a small section of the depth range from the depth sensor will be used. Any part of the object in front of the depth range will result in a white pixel; anything behind the depth range will be black. Within the depth range the pixels in the image will be set to RGB values from 0,0,0 to 255,255,255. A screen shot of the modified Kinect Explorer application is shown below. The Kinect Explorer sample application was modified to include slider controls that are used to set the depth range that forms the image from the depth stream. This allows the fine tuning of the depth image that is required for simulating the position of the pins in the pin board. The Kinect Explorer was also modified to record a series of images from the depth camera and save them as a sequence JPEG files that will be used to animate the pins in the animation the Start and Stop buttons are used to start and stop the image recording. En example of one of the depth images is shown below. Once a series of 2,000 depth images has been captured, the task of creating the animation can begin. Rendering a Test Frame In order to test the creation of frames and get an approximation of the time required to render each frame a test frame was rendered on-premise using PolyRay. The output of the rendering process is shown below. The test frame contained 23,629 primitive shapes, most of which are the spheres and cylinders that are used for the 11,800 or so pins in the pin board. The 1280x720 image contains 921,600 pixels, but as anti-aliasing was used the number of rays that were calculated was 4,235,777, with 3,478,754,073 object boundaries checked. The test frame of the pin board with the depth field image applied is shown below. The tracing time for the test frame was 4 minutes 27 seconds, which means rendering the2,000 frames in the animation would take over 148 hours, or a little over 6 days. Although this is much faster that an old 486, waiting almost a week to see the results of an animation would make it challenging for animators to create, view, and refine their animations. It would be much better if the animation could be rendered in less than one hour. Windows Azure Worker Roles The cost of creating an on-premise render farm to render animations increases in proportion to the number of servers. The table below shows the cost of servers for creating a render farm, assuming a cost of $500 per server. Number of Servers Cost 1 $500 16 $8,000 256 $128,000   As well as the cost of the servers, there would be additional costs for networking, racks etc. Hosting an environment of 256 servers on-premise would require a server room with cooling, and some pretty hefty power cabling. The Windows Azure compute services provide worker roles, which are ideal for performing processor intensive compute tasks. With the scalability available in Windows Azure a job that takes 256 hours to complete could be perfumed using different numbers of worker roles. The time and cost of using 1, 16 or 256 worker roles is shown below. Number of Worker Roles Render Time Cost 1 256 hours $30.72 16 16 hours $30.72 256 1 hour $30.72   Using worker roles in Windows Azure provides the same cost for the 256 hour job, irrespective of the number of worker roles used. Provided the compute task can be broken down into many small units, and the worker role compute power can be used effectively, it makes sense to scale the application so that the task is completed quickly, making the results available in a timely fashion. The task of rendering 2,000 frames in an animation is one that can easily be broken down into 2,000 individual pieces, which can be performed by a number of worker roles. Creating a Render Farm in Windows Azure The architecture of the render farm is shown in the following diagram. The render farm is a hybrid application with the following components: ·         On-Premise o   Windows Kinect – Used combined with the Kinect Explorer to create a stream of depth images. o   Animation Creator – This application uses the depth images from the Kinect sensor to create scene description files for PolyRay. These files are then uploaded to the jobs blob container, and job messages added to the jobs queue. o   Process Monitor – This application queries the role instance lifecycle table and displays statistics about the render farm environment and render process. o   Image Downloader – This application polls the image queue and downloads the rendered animation files once they are complete. ·         Windows Azure o   Azure Storage – Queues and blobs are used for the scene description files and completed frames. A table is used to store the statistics about the rendering environment.   The architecture of each worker role is shown below.   The worker role is configured to use local storage, which provides file storage on the worker role instance that can be use by the applications to render the image and transform the format of the image. The service definition for the worker role with the local storage configuration highlighted is shown below. <?xml version="1.0" encoding="utf-8"?> <ServiceDefinition name="CloudRay" >   <WorkerRole name="CloudRayWorkerRole" vmsize="Small">     <Imports>     </Imports>     <ConfigurationSettings>       <Setting name="DataConnectionString" />     </ConfigurationSettings>     <LocalResources>       <LocalStorage name="RayFolder" cleanOnRoleRecycle="true" />     </LocalResources>   </WorkerRole> </ServiceDefinition>     The two executable programs, PolyRay.exe and DTA.exe are included in the Azure project, with Copy Always set as the property. PolyRay will take the scene description file and render it to a Truevision TGA file. As the TGA format has not seen much use since the mid 90’s it is converted to a JPG image using Dave's Targa Animator, another shareware application from the 90’s. Each worker roll will use the following process to render the animation frames. 1.       The worker process polls the job queue, if a job is available the scene description file is downloaded from blob storage to local storage. 2.       PolyRay.exe is started in a process with the appropriate command line arguments to render the image as a TGA file. 3.       DTA.exe is started in a process with the appropriate command line arguments convert the TGA file to a JPG file. 4.       The JPG file is uploaded from local storage to the images blob container. 5.       A message is placed on the images queue to indicate a new image is available for download. 6.       The job message is deleted from the job queue. 7.       The role instance lifecycle table is updated with statistics on the number of frames rendered by the worker role instance, and the CPU time used. The code for this is shown below. public override void Run() {     // Set environment variables     string polyRayPath = Path.Combine(Environment.GetEnvironmentVariable("RoleRoot"), PolyRayLocation);     string dtaPath = Path.Combine(Environment.GetEnvironmentVariable("RoleRoot"), DTALocation);       LocalResource rayStorage = RoleEnvironment.GetLocalResource("RayFolder");     string localStorageRootPath = rayStorage.RootPath;       JobQueue jobQueue = new JobQueue("renderjobs");     JobQueue downloadQueue = new JobQueue("renderimagedownloadjobs");     CloudRayBlob sceneBlob = new CloudRayBlob("scenes");     CloudRayBlob imageBlob = new CloudRayBlob("images");     RoleLifecycleDataSource roleLifecycleDataSource = new RoleLifecycleDataSource();       Frames = 0;       while (true)     {         // Get the render job from the queue         CloudQueueMessage jobMsg = jobQueue.Get();           if (jobMsg != null)         {             // Get the file details             string sceneFile = jobMsg.AsString;             string tgaFile = sceneFile.Replace(".pi", ".tga");             string jpgFile = sceneFile.Replace(".pi", ".jpg");               string sceneFilePath = Path.Combine(localStorageRootPath, sceneFile);             string tgaFilePath = Path.Combine(localStorageRootPath, tgaFile);             string jpgFilePath = Path.Combine(localStorageRootPath, jpgFile);               // Copy the scene file to local storage             sceneBlob.DownloadFile(sceneFilePath);               // Run the ray tracer.             string polyrayArguments =                 string.Format("\"{0}\" -o \"{1}\" -a 2", sceneFilePath, tgaFilePath);             Process polyRayProcess = new Process();             polyRayProcess.StartInfo.FileName =                 Path.Combine(Environment.GetEnvironmentVariable("RoleRoot"), polyRayPath);             polyRayProcess.StartInfo.Arguments = polyrayArguments;             polyRayProcess.Start();             polyRayProcess.WaitForExit();               // Convert the image             string dtaArguments =                 string.Format(" {0} /FJ /P{1}", tgaFilePath, Path.GetDirectoryName (jpgFilePath));             Process dtaProcess = new Process();             dtaProcess.StartInfo.FileName =                 Path.Combine(Environment.GetEnvironmentVariable("RoleRoot"), dtaPath);             dtaProcess.StartInfo.Arguments = dtaArguments;             dtaProcess.Start();             dtaProcess.WaitForExit();               // Upload the image to blob storage             imageBlob.UploadFile(jpgFilePath);               // Add a download job.             downloadQueue.Add(jpgFile);               // Delete the render job message             jobQueue.Delete(jobMsg);               Frames++;         }         else         {             Thread.Sleep(1000);         }           // Log the worker role activity.         roleLifecycleDataSource.Alive             ("CloudRayWorker", RoleLifecycleDataSource.RoleLifecycleId, Frames);     } }     Monitoring Worker Role Instance Lifecycle In order to get more accurate statistics about the lifecycle of the worker role instances used to render the animation data was tracked in an Azure storage table. The following class was used to track the worker role lifecycles in Azure storage.   public class RoleLifecycle : TableServiceEntity {     public string ServerName { get; set; }     public string Status { get; set; }     public DateTime StartTime { get; set; }     public DateTime EndTime { get; set; }     public long SecondsRunning { get; set; }     public DateTime LastActiveTime { get; set; }     public int Frames { get; set; }     public string Comment { get; set; }       public RoleLifecycle()     {     }       public RoleLifecycle(string roleName)     {         PartitionKey = roleName;         RowKey = Utils.GetAscendingRowKey();         Status = "Started";         StartTime = DateTime.UtcNow;         LastActiveTime = StartTime;         EndTime = StartTime;         SecondsRunning = 0;         Frames = 0;     } }     A new instance of this class is created and added to the storage table when the role starts. It is then updated each time the worker renders a frame to record the total number of frames rendered and the total processing time. These statistics are used be the monitoring application to determine the effectiveness of use of resources in the render farm. Rendering the Animation The Azure solution was deployed to Windows Azure with the service configuration set to 16 worker role instances. This allows for the application to be tested in the cloud environment, and the performance of the application determined. When I demo the application at conferences and user groups I often start with 16 instances, and then scale up the application to the full 256 instances. The configuration to run 16 instances is shown below. <?xml version="1.0" encoding="utf-8"?> <ServiceConfiguration serviceName="CloudRay" xmlns="http://schemas.microsoft.com/ServiceHosting/2008/10/ServiceConfiguration" osFamily="1" osVersion="*">   <Role name="CloudRayWorkerRole">     <Instances count="16" />     <ConfigurationSettings>       <Setting name="DataConnectionString"         value="DefaultEndpointsProtocol=https;AccountName=cloudraydata;AccountKey=..." />     </ConfigurationSettings>   </Role> </ServiceConfiguration>     About six minutes after deploying the application the first worker roles become active and start to render the first frames of the animation. The CloudRay Monitor application displays an icon for each worker role instance, with a number indicating the number of frames that the worker role has rendered. The statistics on the left show the number of active worker roles and statistics about the render process. The render time is the time since the first worker role became active; the CPU time is the total amount of processing time used by all worker role instances to render the frames.   Five minutes after the first worker role became active the last of the 16 worker roles activated. By this time the first seven worker roles had each rendered one frame of the animation.   With 16 worker roles u and running it can be seen that one hour and 45 minutes CPU time has been used to render 32 frames with a render time of just under 10 minutes.     At this rate it would take over 10 hours to render the 2,000 frames of the full animation. In order to complete the animation in under an hour more processing power will be required. Scaling the render farm from 16 instances to 256 instances is easy using the new management portal. The slider is set to 256 instances, and the configuration saved. We do not need to re-deploy the application, and the 16 instances that are up and running will not be affected. Alternatively, the configuration file for the Azure service could be modified to specify 256 instances.   <?xml version="1.0" encoding="utf-8"?> <ServiceConfiguration serviceName="CloudRay" xmlns="http://schemas.microsoft.com/ServiceHosting/2008/10/ServiceConfiguration" osFamily="1" osVersion="*">   <Role name="CloudRayWorkerRole">     <Instances count="256" />     <ConfigurationSettings>       <Setting name="DataConnectionString"         value="DefaultEndpointsProtocol=https;AccountName=cloudraydata;AccountKey=..." />     </ConfigurationSettings>   </Role> </ServiceConfiguration>     Six minutes after the new configuration has been applied 75 new worker roles have activated and are processing their first frames.   Five minutes later the full configuration of 256 worker roles is up and running. We can see that the average rate of frame rendering has increased from 3 to 12 frames per minute, and that over 17 hours of CPU time has been utilized in 23 minutes. In this test the time to provision 140 worker roles was about 11 minutes, which works out at about one every five seconds.   We are now half way through the rendering, with 1,000 frames complete. This has utilized just under three days of CPU time in a little over 35 minutes.   The animation is now complete, with 2,000 frames rendered in a little over 52 minutes. The CPU time used by the 256 worker roles is 6 days, 7 hours and 22 minutes with an average frame rate of 38 frames per minute. The rendering of the last 1,000 frames took 16 minutes 27 seconds, which works out at a rendering rate of 60 frames per minute. The frame counts in the server instances indicate that the use of a queue to distribute the workload has been very effective in distributing the load across the 256 worker role instances. The first 16 instances that were deployed first have rendered between 11 and 13 frames each, whilst the 240 instances that were added when the application was scaled have rendered between 6 and 9 frames each.   Completed Animation I’ve uploaded the completed animation to YouTube, a low resolution preview is shown below. Pin Board Animation Created using Windows Kinect and 256 Windows Azure Worker Roles   The animation can be viewed in 1280x720 resolution at the following link: http://www.youtube.com/watch?v=n5jy6bvSxWc Effective Use of Resources According to the CloudRay monitor statistics the animation took 6 days, 7 hours and 22 minutes CPU to render, this works out at 152 hours of compute time, rounded up to the nearest hour. As the usage for the worker role instances are billed for the full hour, it may have been possible to render the animation using fewer than 256 worker roles. When deciding the optimal usage of resources, the time required to provision and start the worker roles must also be considered. In the demo I started with 16 worker roles, and then scaled the application to 256 worker roles. It would have been more optimal to start the application with maybe 200 worker roles, and utilized the full hour that I was being billed for. This would, however, have prevented showing the ease of scalability of the application. The new management portal displays the CPU usage across the worker roles in the deployment. The average CPU usage across all instances is 93.27%, with over 99% used when all the instances are up and running. This shows that the worker role resources are being used very effectively. Grid Computing Scenarios Although I am using this scenario for a hobby project, there are many scenarios where a large amount of compute power is required for a short period of time. Windows Azure provides a great platform for developing these types of grid computing applications, and can work out very cost effective. ·         Windows Azure can provide massive compute power, on demand, in a matter of minutes. ·         The use of queues to manage the load balancing of jobs between role instances is a simple and effective solution. ·         Using a cloud-computing platform like Windows Azure allows proof-of-concept scenarios to be tested and evaluated on a very low budget. ·         No charges for inbound data transfer makes the uploading of large data sets to Windows Azure Storage services cost effective. (Transaction charges still apply.) Tips for using Windows Azure for Grid Computing Scenarios I found the implementation of a render farm using Windows Azure a fairly simple scenario to implement. I was impressed by ease of scalability that Azure provides, and by the short time that the application took to scale from 16 to 256 worker role instances. In this case it was around 13 minutes, in other tests it took between 10 and 20 minutes. The following tips may be useful when implementing a grid computing project in Windows Azure. ·         Using an Azure Storage queue to load-balance the units of work across multiple worker roles is simple and very effective. The design I have used in this scenario could easily scale to many thousands of worker role instances. ·         Windows Azure accounts are typically limited to 20 cores. If you need to use more than this, a call to support and a credit card check will be required. ·         Be aware of how the billing model works. You will be charged for worker role instances for the full clock our in which the instance is deployed. Schedule the workload to start just after the clock hour has started. ·         Monitor the utilization of the resources you are provisioning, ensure that you are not paying for worker roles that are idle. ·         If you are deploying third party applications to worker roles, you may well run into licensing issues. Purchasing software licenses on a per-processor basis when using hundreds of processors for a short time period would not be cost effective. ·         Third party software may also require installation onto the worker roles, which can be accomplished using start-up tasks. Bear in mind that adding a startup task and possible re-boot will add to the time required for the worker role instance to start and activate. An alternative may be to use a prepared VM and use VM roles. ·         Consider using the Windows Azure Autoscaling Application Block (WASABi) to autoscale the worker roles in your application. When using a large number of worker roles, the utilization must be carefully monitored, if the scaling algorithms are not optimal it could get very expensive!

    Read the article

  • Cocos2d-xna memory management for WP8

    - by Arkiliknam
    I recently upgraded to VS2012 and try my in dev game out on the new WP8 emulators but was dismayed to find out the emulator now crashes and throws an out of memory exception during my sprite loading procedure (funnily, it still works in WP7 emulators and on my WP7). Regardless of whether the problem is the emulator or not, I want to get a clear understanding of how I should be managing memory in the game. My game consists of a character whom has 4 or more different animations. Each animation consists of 4 to 7 frames. On top of that, the character has up to 8 stackable visualization modifications (eg eye type, nose type, hair type, clothes type). Pre memory issue, I preloaded all textures for each animation frame and customization and created animate action out of them. The game then plays animations using the customizations applied to that current character. I re-looked at this implementation when I received the out of memory exceptions and have started playing with RenderTexture instead, so instead of pre loading all possible textures, it on loads textures needed for the character, renders them onto a single texture, from which the animation is built. This means the animations use 1/8th of the sprites they were before. I thought this would solve my issue, but it hasn't. Here's a snippet of my code: var characterTexture = CCRenderTexture.Create((int)width, (int)height); characterTexture.BeginWithClear(0, 0, 0, 0); // stamp a body onto my texture var bodySprite = MethodToCreateSpecificSprite(); bodySprite.Position = centerPoint; bodySprite.Visit(); bodySprite.Cleanup(); bodySprite = null; // stamp eyes, nose, mouth, clothes, etc... characterTexture.End(); As you can see, I'm calling CleanUp and setting the sprite to null in the hope of releasing the memory, though I don't believe this is the right way, nor does it seem to work... I also tried using SharedTextureCache to load textures before Stamping my texture out, and then clearing the SharedTextureCache with: CCTextureCache.SharedTextureCache.RemoveAllTextures(); But this didn't have an effect either. Any tips on what I'm not doing? I used VS to do a memory profile of the emulation causing the crash. Both WP7.1 and WP8 emulators peak at about 150mb of usage. WP8 crashes and throws an out of memory exception. Each customisation/frame is 15kb at the most. Lets say there are 8 layers of customisation = 120kb but I render then onto one texture which I would assume is only 15kb again. Each animation is 8 frames at the most. That's 15kb for 1 texture, or 960kb for 8 textures of customisation. There are 4 animation sets. That's 60Kb for 4 sets of 1 texture, or 3.75MB for 4 sets of 8 textures of customisation. So even if its storing every layer, its 3.75MB.... no where near the 150mb breaking point my profiler seems to suggest :( WP 7.1 Memory Profile (max 150MB) WP8 Memory Profile (max 150MB and crashes)

    Read the article

  • Silverlight Cream for May 15, 2010 -- #862

    - by Dave Campbell
    In this Issue: Victor Gaudioso, Antoni Dol(-2-), Brian Genisio, Shawn Wildermuth, Mike Snow, Phil Middlemiss, Pete Brown, Kirupa, Dan Wahlin, Glenn Block, Jeff Prosise, Anoop Madhusudanan, and Adam Kinney. Shoutouts: Victor Gaudioso would like you to Checkout my Interview with Microsoft’s Murray Gordon at MIX 10 Pete Brown announced: Connected Show Podcast #29 With … Me! From SilverlightCream.com: New Silverlight Video Tutorial: How to Create Fast Forward for the MediaElement Victor Gaudioso's latest video tutorial is on creating the ability to fast-forward a MediaElement... check it out in the tutorial player itself! Overlapping TabItems with the Silverlight Toolkit TabControl Antoni Dol has a very cool tutorial up on the Toolkit TabItems control... not only is he overlapping them quite nicely but this is a very cool tutorial... QuoteFloat: Animating TextBlock PlaneProjections for a spiraling effect in Silverlight Antoni Dol also has a Blend tutorial up on animating TextBlock items... run the demo and you'll want to read the rest :) Adventures in MVVM – My ViewModel Base – Silverlight Support! Brian Genisio continues his MVVM tutorials with this update on his ViewModel base using some new C# 4.0 features, and fully supports Silverlight and WPF My Thoughts on the Windows Phone 7 Shawn Wildermuth gives his take on WP7. He included a port of his XBoxGames app to WP7 ... thanks Shawn! Silverlight Tip of the Day #20 – Using Tooltips in Silverlight I figured Mike Snow was going to overrun me with tips since I have missed a couple days, but there's only one! ... and it's on Tooltips. Animating the Silverlight opacity mask Phil Middlemiss has an article at SilverZine describing a Behavior he wrote (and is sharing) that turns a FrameworkElement into an opacity mask for it's parent container... cool demo on the page too. Breaking Apart the Margin Property in Xaml for better Binding Pete Brown dug in on a Twitter message and put some thoughts down about breaking a Margin apart to see about binding to the individual elements. Building a Simple Windows Phone App Kirupa has a 6-part tutorial up on building not-your-typical first WP7 application... all good stuff! Integrating HTML into Silverlight Applications Dan Wahlin has a post up discussing three ways to display HTML inside a Silverlight app. Hello MEF in Silverlight 4 and VB! (with an MVVM Light cameo) Glenn Block has a post up discussing MEF, MVVM, and it's in VB this time... and it's actually a great tutorial top to bottom... all source included of course :) Understanding Input Scope in Silverlight for Windows Phone Jeff Prosise has a good post up on the WP7 SIP and how to set the proper InputScope to get the SIP you want. Thinking about Silverlight ‘desktop’ apps – Creating a Standalone Installer for offline installation (no browser) Anoop Madhusudanan is discussing something that's been floating around for a while... installing Silverlight from, say, a CD or DVD when someone installs your app. He's got some good code, but be sure to read Tim Heuer and Scott Guthrie's comments, and consider digging deeper into that part. Using FluidMoveBehavior to animate grid coordinates in Silverlight Adam Kinney has a cool post up on animating an object using the FluidMotionBehavior of Blend 4... looks great moving across a checkerboard... check out the demo, then grab the code. Stay in the 'Light! Twitter SilverlightNews | Twitter WynApse | WynApse.com | Tagged Posts | SilverlightCream Join me @ SilverlightCream | Phoenix Silverlight User Group Technorati Tags: Silverlight    Silverlight 3    Silverlight 4    Windows Phone MIX10

    Read the article

  • Silverlight Cream for May 27, 2010 -- #871

    - by Dave Campbell
    In this Issue: Phil Middlemiss, Max Paulousky, Jeff Wilcox, David Anson, René Schulte, Xianzhong Zhu, Jeff Handley, John Papa, Jeremy Likness, and Marlon Grech. Shoutouts: SilverLaw has a great demo at the Expression Gallery, and we're all going to look forward to the blog post explaining it: Flexible Surface Effect SilverLaw> has another use for the above in this text morphing Effect: Morphing Text Effect Matthias Shapiro contributed a chapter for a book on Visualization and it's available as a free download: Free Chapter From Beautiful Visualization Andy Beaulieu has a demo up as almost a spoiler for a future Coding4Fun app... and how cool is this: Shuffleboard: A Windows Phone 7 Sample Game From SilverlightCream.com: Separating Content and Presentation with the ContentControl Phil Middlemiss' latest is out on SilverlightShow and is all about the ContentControl and separating layout and content ... demo project source included Search Engine Optimization (SEO) for Silverlight Applications. Part 1 Max Paulousky has part one of a long series he's starting on a demo project to explain a bunch of MEF, MVVM, and WCF RIA concepts. This first one contains the overview and also discusses SEO. There is a link to the app and material in the post if you read Russian :) Updated Silverlight Unit Test Framework bits for Windows Phone and Silverlight 3 Jeff Wilcox has available updated Unit Test bits for Silverlight 3 -- read that as WP7... read the rest of the information on his post. Easily animate orientation changes for any Windows Phone application with this handy source code David Anson has some code up that you're going to want if you're programming WP7 ... just watch the video ... you'll be downloading the code just like I did :) SilverShader – Introduction to Silverlight and WPF Pixel Shaders René Schulte has a post up at Coding4Fun about PixelShaders... how to write them and an application that uses them... this is a great long tutorial... a must read. Developing Freecell Game Using Silverlight 3 Part 2 Xianzhong Zhu has part 2 of his FreeCell game development posted ... lots of detailed descriptions and code, plus all the code of course! Async Validation with RIA Services Jeff Handley has a post up that is sort of a follow-on to a year-old post on async validation with RIA services and DataForm and how it's all much easier now in SL4. Learning Blend with .toolbox (Silverlight TV #29) John Papa and Arturo Toledo discuss .toolbox in Silverlight TV #29 -- have you made yourself an avatar yet? ... well go get on-board with this great learning tool! Silverlight Out of Browser Dynamic Modules in Offline Mode OOB isn't difficult, dynamic modules can become a bit more, but what if you're OOB... ok what if you're OOB and offline? ... Jeremy Likness has a possible solution for this with an OfflineCatalog. MEFedMVVM v1.0 Explained Marlon Grech has a great into to MEFedMVVM in this post. If you're trying to get your head around MEF and MVVM in either WPF or Silverlight, here's a good starting point. Stay in the 'Light! Twitter SilverlightNews | Twitter WynApse | WynApse.com | Tagged Posts | SilverlightCream Join me @ SilverlightCream | Phoenix Silverlight User Group Technorati Tags: Silverlight    Silverlight 3    Silverlight 4    Windows Phone MIX10

    Read the article

  • Screen Aspect Ratio

    - by Bill Evjen
    Jeffrey Dean, Pixar Aspect Ratio is very important to home video. What is aspect ratio – the ratio from the height to the width 2.35:1 The image is 2.35 times wide as it is high Pixar uses this for half of our movies This is called a widescreen image When modified to fit your television screen They cut this to fit the box of your screen When a comparison is made huge chunks of picture is missing It is harder to find what is going on when these pieces are missing The whole is greater than the pieces themselves. If you are missing pieces – you are missing the movie The soul and the mood is in the film shots. Cutting it to fit a screen, you are losing 30% of the movie Why different aspect ratios? Film before the 1950s 1.33:1 Academy Standard There were all aspects of images though. There was no standard. Thomas Edison developed projecting images onto a wall/screen He didn’t patent it as he saw no value in it. Then 1.37:1 came about to add a strip of sound This is the same size as a 35mm film Around 1952 – TV comes along NTSC Television followed the Academy Standard (4x3) Once TV came out, movie theater attendance plummets So Film brought forth color to combat this. Also early 3D Also Widescreen was brought forth. Cinema-Scope Studios at the time made movies bigger and bigger There was a Napoleon movie that was actually 4x1 … really wide. 1.85:1 Academy Flat 2.35:1 Anamorphic Scope (aka Panavision/Cinemascope) Almost all movies are made in these two aspect ratios Pixar has done half in one and half in the other Why choose one over the other? Artist choice It is part of the story the director wants to tell Can we preserve the story outside of the theaters? TVs before 1998 – they were very square Now TVs are very wide Historical options Toy Story released as it was and people cut it in a way that wasn’t liked by the studio Pan and Scan is another option Cut and then scan left or right depending on where the action is Frame Height Pixar can go back and animate more picture to account for the bottom/top bars. You end up with more sky and more ground The characters seem to get lost in the picture You lose what the director original intended Re-staging For animated movies, you can move characters around – restage the scene. It is a new completely different version of the film This is the best possible option that Pixar came up with They have stopped doing this really as the demand as pretty much dropped off Why not 1.33 today? There has been an evolution of taste and demands. VHS is a linear item The focus is about portability and not about quality Most was pan and scan and the quality was so bad – but people didn’t notice DVD was introduced in 1996 You could have more content – two versions of the film You could have the widescreen version and the 1.33 version People realized that they are seeing more of the movie with the widescreen High Def Televisions (16x9 monitors) This was introduced in 2005 Blu-ray Disc was introduced in 2006 This is all widescreen You cannot find a square TV anymore TVs are roughly 1.85:1 aspect ratio There is a change in demand Users are used to black bars and are used to widescreen Users are educated now What’s next for in-flight entertainment? High Def IFE Personal Electronic Devices 3D inflight

    Read the article

  • Does Jquery and Mootools usually have conflict if both are used on a webpage? [migrated]

    - by Charming Prince
    I have this website am designing, i tried using mootools 1.31 to animate some of the div boxes when clicked or when the mouse hover rounds it, to shows the content. the thing is that it doesn't seem to work on the webpage, but if i try the same script on a blank webpage it works, am thinking probably it's because i have Jquery 1.52 on the same page and maybe both scripts are conflicting with each other because, if i remove the Jquery, the Mootools works. What should be my option, because i need the Jquery to do some validations for me, so i can't remove it completely. Here are the codes <script> //-vertical var mySlide = new Fx.Slide('test'); $('slidein').addEvent('click', function(e){ e = new Event(e); mySlide.slideIn(); e.stop(); }); $('slideout').addEvent('click', function(e){ e = new Event(e); mySlide.slideOut(); e.stop(); }); $('toggle').addEvent('click', function(e){ e = new Event(e); mySlide.toggle(); e.stop(); }); $('hide').addEvent('click', function(e){ e = new Event(e); mySlide.hide(); e.stop(); }); </script> here's the HTML <html> <h3 class="section">Fx.Slide Vertical</h3> <a id="slideout" href="#">slideout</a> | <a id="slidein" href="#">slidein</a> | <a id="toggle" href="#"> toggle</a> | <a id="hide" href="#">hide</a> <div id="test"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad mi nim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div> Here's the CSS #test { background: #222; color: #fff; padding: 10px; margin: 20px; border: 10px solid pink; } #test2 { background: #222; color: #fff; padding: 10px; margin: 20px; border: 10px solid pink; } Am using the exact same code supplied by Mootools in their own example, if i do this on a blank webpage it works but incorporated into my own webpage, it doesn't, and my own page just have the script tag of the Jquery in the head section of the HTML.

    Read the article

  • Ext JS Tab Panel - Dynamic Tabs - Tab Exists Not Working

    - by Joey Ezekiel
    Hi Would appreciate if somebody could help me on this. I have a Tree Panel whose nodes when clicked load a tab into a tab panel. The tabs are loading alright, but my problem is duplication. I need to check if a tab exists before adding it to the tab panel. I cant seem to have this resolved and it is eating my brains. This is pretty simple and I have checked stackoverflow and the EXT JS Forums for solutions but they dont seem to work for me or I'm being blind. This is my code for the tree: var opstree = new Ext.tree.TreePanel({ renderTo: 'opstree', border:false, width: 250, height: 'auto', useArrows: false, animate: true, autoScroll: true, dataUrl: 'libs/tree-data.json', root: { nodeType: 'async', text: 'Tool Actions' }, listeners: { render: function() { this.getRootNode().expand(); } } }) opstree.on('click', function(n){ var sn = this.selModel.selNode || {}; // selNode is null on initial selection renderPage(n.id); }); function renderPage(tabId) { var TabPanel = Ext.getCmp('content-tab-panel'); var tab = TabPanel.getItem(tabId); //Ext.MessageBox.alert('TabGet',tab); if(tab){ TabPanel.setActiveTab(tabId); } else{ TabPanel.add({ title: tabId, html: 'Tab Body ' + (tabId) + '', closable:true }).show(); TabPanel.doLayout(); } } }); and this is the code for the Tab Panel new Ext.TabPanel({ id:'content-tab-panel', region: 'center', deferredRender: false, enableTabScroll:true, activeTab: 0, items: [{ contentEl: 'about', title: 'About the Billing Ops Application', closable: true, autoScroll: true, margins: '0 0 0 0' },{ contentEl: 'welcomescreen', title: 'PBRT Application Home', closable: false, autoScroll: true, margins: '0 0 0 0' }] }) Can somebody please help?

    Read the article

  • WPF Button Storyboard with an image for MouseOver

    - by Vinjamuri
    I have the following xaml for changing the image for WPF button when mouse is on the button. It give below error. Any help is appreciated... 'System.Windows.Media.Animation.DoubleAnimation' animation object cannot be used to animate property 'Source' because it is of incompatible type 'System.Windows.Media.ImageSource'. <Style TargetType="{x:Type local:ButtonControl}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:ButtonControl}"> <Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="MouseOver"> <Storyboard> <DoubleAnimation Storyboard.TargetName="img" Storyboard.TargetProperty="Source" To="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=MouseOverImage}" /> </Storyboard> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Border> <Image x:Name="img" Source="pack://application:,,,/Recipe_06_13;component/Resources/normal.bmp" /> </Border> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>

    Read the article

< Previous Page | 29 30 31 32 33 34 35 36 37 38 39 40  | Next Page >