Search Results

Search found 2724 results on 109 pages for 'absolute positioning'.

Page 95/109 | < Previous Page | 91 92 93 94 95 96 97 98 99 100 101 102  | Next Page >

  • Career guidance/advice for Junior-level Software Engineer [closed]

    - by John Do
    I have quite a few questions on my mind, so please bare with me. Please don't feel obligated to answer all of them, any as you choose will do. I'd appreciate if you could share some insight on any of these. Before I begin, some context: I currently have almost two years of professional experience as a Software Engineer, mainly developing software in Java. At this point, I feel that I have reached the peak in my career growth at the current company I am at and therefore I am looking for a new job, ideally again, as a Software Engineer. I have been interviewing for the past few months casually but have not had luck with companies I have a passion for. So, in no particular order - 1) In general, what are your thoughts on having graduate degrees in CS / Software Engineering. How much does it influence a salary increase, and do you think it's beneficial when working on real-world problems? I get the sense that a graduate degree in the field is trivial unless you really have a passion for research. 2) In general, in professional practice, how often had you have to write your own data structures and "complex" algorithms from scratch? In my own work, I have found myself relying mainly on third-party frameworks and the Java standard library to implement solutions as per business requirements. What are your thoughts on this? 3) In terms of resume, I feel the most ambivalent here. I want to be able to "blemish" my resume to a certain extent so that it stands out from others', but at the same time I do not want to over-exagerate my abilities. How do you strike a balance here? For example: I say that I am proficient in Java with data structures and algorithms. This is obviously a subjective and relative statement. I've taken the classes in my undergrad, and I've applied it in my work experience. What I feel as "prociency" can be seen as junior-level to others. How do you know what to say? Most of the time, recruiters (with no technical background) will be looking for keywords that stand out. This leads me to my next question (4). 4) Just from interviewing for the past few months (and getting plenty of rejections), I've come to realize that I may not be as proficient in data structures and algorithms as I thought I was. Do you think it's a good idea to remove the "proficient in java/data structure and algorithms"? I feel that being too hoenst on the resume will impede me from scoring opportunities to even have an interview with top-notch companies. What are your thoughts? 5) What is the absolute "must-have" knowledge going into a technical interview? I've been practicing several algorithmic and data sturcture problems now, and I feel that my abilities to solve arbitrary problems efficiently has not gotten significantly better. Do you think these abilities are something innate - it's either you have in you, or you don't? How can you teach yourself to learn, if you will? 6) How easy is it to go from industry/function to the next? I work mainly with backend technologies and I'm now interested in working with the frontend, i.e javascript,jquery,php or even mobile development. In your own experience, how did you not get pidgeon holed in your career? I feel that the choices you make now ultimately decide your future. As cliche as it sounds, I think it may be true. Here's what I mean: you've worked mainly as a backend engineer, people are interested in you doing the same thing since you've already accumulated experience in that function. How do get experience in a new function if people won't accept you because you don't already have it? It's a catch 22, you see... Are side projects the only real way to help you move from one function to another that you're truly interested in? For example: I could start writing my own mobile applications, even though I've worked mainly on the backend. Thanks so much for the long read. As a relatively new engineer to the real world, I am very humble and would like those who are experienced to shed some light. Thank you so much.

    Read the article

  • CodePlex Daily Summary for Sunday, December 02, 2012

    CodePlex Daily Summary for Sunday, December 02, 2012Popular ReleasesD3 Loot Tracker: 1.5.6: Updated to work with D3 version 1.0.6.13300DirectQ: DirectQ II 2012-11-29: A (slightly) modernized port of Quake II to D3D9. You need SM3 or better hardware to run this - if you don't have it, then don't even bother. It should work on Windows Vista, 7 or 8; it may also work on XP but I haven't tested. Known bugs include: Some mods may not work. This is unfortunately due to the nature of Quake II's game DLLs; sometimes a recompile of the game DLL is all that's needed. In any event, ensure that the game DLL is compatible with the last release of Quake II first (...Magelia WebStore Open-source Ecommerce software: Magelia WebStore 2.2: new UI for the Administration console Bugs fixes and improvement version 2.2.215.3JayData - The cross-platform HTML5 data-management library for JavaScript: JayData 1.2.5: What's new in JayData 1.2.5For detailed release notes check the release notes. Handlebars template engine supportImplement data manager applications with JayData using Handlebars.js for templating. Include JayDataModules/handlebars.js and begin typing the mustaches :) Blogpost: Handlebars templates in JayData Handlebars helpers and model driven commanding in JayData Easy JayStorm cloud data managementManage cloud data using the same syntax and data management concept just like any other data ...nopCommerce. Open source shopping cart (ASP.NET MVC): nopcommerce 2.70: Highlight features & improvements: • Performance optimization. • Search engine optimization. ID-less URLs for products, categories, and manufacturers. • Added ACL support (access control list) on products and categories. • Minify and bundle JavaScript files. • Allow a store owner to decide which billing/shipping address fields are enabled/disabled/required (like it's already done for the registration page). • Moved to MVC 4 (.NET 4.5 is required). • Now Visual Studio 2012 is required to work ...SQL Server Partition Management: Partition Management Release 3.0: Release 3.0 adds support for SQL Server 2012 and is backward compatible with SQL Server 2008 and 2005. The release consists of: • A Readme file • The Executable • The source code (Visual Studio project) Enhancements include: -- Support for Columnstore indexes in SQL Server 2012 -- Ability to create TSQL scripts for staging table and index creation operations -- Full support for global date and time formats, locale independent -- Support for binary partitioning column types -- Fixes to is...NHook - A debugger API: NHook 1.0: x86 debugger Resolve symbol from MS Public server Resolve RVA from executable's image Add breakpoints Assemble / Disassemble target process assembly More information here, you can also check unit tests that are real sample code.PDF Library: PDFLib v2.0: Release notes This new version include many bug fixes and include support for stream objects and cross-reference object streams. New FeatureExtract images from the PDFDocument.Editor: 2013.5: Whats new for Document.Editor 2013.5: New Read-only File support New Check For Updates support Minor Bug Fix's, improvements and speed upsMCEBuddy 2.x: MCEBuddy 2.3.10: Critical Update to 2.3.9: Changelog for 2.3.10 (32bit and 64bit) 1. AsfBin executable missing from build 2. Removed extra references from build to avoid conflict 3. Showanalyzer installation now checked on remote engine machine Changelog for 2.3.9 (32bit and 64bit) 1. Added support for WTV output profile 2. Added support for minimizing MCEBuddy to the system tray 3. Added support for custom archive folder 4. Added support to disable subdirectory monitoring 5. Added support for better TS fil...DotNetNuke® Community Edition CMS: 07.00.00: Major Highlights Fixed issue that caused profiles of deleted users to be available Removed the postback after checkboxes are selected in Page Settings > Taxonomy Implemented the functionality required to edit security role names and social group names Fixed JavaScript error when using a ";" semicolon as a profile property Fixed issue when using DateTime properties in profiles Fixed viewstate error when using Facebook authentication in conjunction with "require valid profile fo...CODE Framework: 4.0.21128.0: See change notes in the documentation section for details on what's new.Microsoft Ajax Minifier: Microsoft Ajax Minifier 4.76: Fixed a typo in ObjectLiteralProperty.IsConstant that caused all object literals to be treated like they were constants, and possibly moved around in the code when they shouldn't be.Kooboo CMS: Kooboo CMS 3.3.0: New features: Dropdown/Radio/Checkbox Lists no longer references the userkey. Instead they refer to the UUID field for input value. You can now delete, export, import content from database in the site settings. Labels can now be imported and exported. You can now set the required password strength and maximum number of incorrect login attempts. Child sites can inherit plugins from its parent sites. The view parameter can be changed through the page_context.current value. Addition of c...Facebook Windows 8 Sample: Facebook Windows 8 Sample: The current drop holds two versions of the sample: A basic version that uses a Facebook application to list the content of facebook page. A full version including the use of Bing Maps sdk for positioning the restaurant in a map, and showing how to get there. See Developing a Windows Store App to learn how to use the Bing Maps AJAX Control to add Bing Maps to your Windows Store app.Commerce Server Tools: Delete a Site (CS10): Updated from the Commerce Server 2002 version (Delete Site) to work with CS10. The tool will delete the CS Site, all associated resources, databases, IIS Sites, and folders disk.RaptorDB - The Document Store: v1.9.0: v1.9.0 - speed increase writing bitmap indexes to disk - bug fix hoot search with wildcards - bug fix datetime indexing with UTC time (all times are localtime) - upgrade to fastJSON v2.0.9 - upgrade to fastBinaryJSON v1.3.5 - changed CodeDOM to Reflection.Emit for MonoDroid compatibility - more optimized bitmap storage format (save offsets if smaller than WAH) - fixed path seperator character for monodroid and windows compatibility changed to Path.DirectorySeparatorChar - new generic Query i...Antenna Tracking Unit - Projet Tuteuré /w RFTronic: Présentation Projet: Ci-joint la présentation du projet par l'entreprise RFTronic.Distributed Publish/Subscribe (Pub/Sub) Event System: Distributed Pub Sub Event System Version 3.0: Important Wsp 3.0 is NOT backward compatible with Wsp 2.1. Prerequisites You need to install the Microsoft Visual C++ 2010 Redistributable Package. You can find it at: x64 http://www.microsoft.com/download/en/details.aspx?id=14632x86 http://www.microsoft.com/download/en/details.aspx?id=5555 Wsp now uses Rx (Reactive Extensions) and .Net 4.0 3.0 Enhancements I changed the topology from a hierarchy to peer-to-peer groups. This should provide much greater scalability and more fault-resi...Team Foundation Server Administration Tool: 2.2: TFS Administration Tool 2.2 supports the Team Foundation Server 2012 Object Model. Visual Studio 2012 or Team Explorer 2012 must be installed before you can install this tool. You can download and install Team Explorer 2012 from http://aka.ms/TeamExplorer2012. There are no functional changes between the previous release (2.1) and this release.New ProjectsAppWebStore: Application Store in ASP.NET MVCBaseCrafter: BaseCrafter ProjectBranding SharePoint 2013: An how-to project for Braning in SharePoint 2013Clrizr: A set of less files that automatically define color shades and font colors for use in LESS CSS enabled web applications. Code is located in /Styles/Clrizr/didxaza: proyecto para aprender a usar team fundation serverFastMapper - CONVENTION BASED MAPPER: Comming Soon Google Earth Wrapper: Google Earth c# wrapperKirikiri (TVP) 2 Core: Simplified Chinese Translation: Simplified Chinese translated version of Kirikiri (TVP) 2 Core (http://kikyou.info/tvp), based on the SVN Head development version.Linq to CRM for Silverlight: Linq to CRM framework allows Silverlgith application communicate with MS Dynamics CRM 2011 through the "LINQ to CRM" ORM layer.MovieBuddy: a simple movie UIMyPractice: Some small applications which mainly use microsoft technology, Win8 Metro, Javascript, WCF, C# and etc.MySubstitutionCipher: Substitution cipher educational programOmega Game Engine: Omega Game Engine Engine para criação de jogos 2D e 3D Direcx9/10OpenXML PowerPoint Generation: Sample Project for the use of OpenXML API 2.5 with PowerPointpdh2.0? ???? ??? Perfomance_counter? ?????.: pdh 2.0 ? ???? ?? ??.Riksdagsappen: Detta projekt ämnar att bygga en Windows 8 Store App vars mål är att sprida medvetenhet om Sveriges riksdag, dess ledamöter och deras arbete. Service Stack Docs: Maintain and generate documentation for Service Stack services directly from code.SharpDX for Rastertek tutorials: This project is introduction to the SharpDX by following the Rastertek tutorials which are written in C++.Simple Set for .net: simple set class makes it easier for students of computer science to manage sets and set related operations. It's developed in C#.Spk.Controls: The Spk.Controls is a visual control library for .NET Windows Forms.Stateless Designer: Visual Studio extension to support visual design of stateless state machinesTeamWorkProject: this project for team working training out of CompanyUsing the Microsoft Kinect to control GoogleMap: The project is a WPF application that uses Microsoft Kinect to control google maps. Feel free to learn WPF MVVM pattern and Kinect development from it!VR Player: VR Player is an experimental Virtual Reality Media Player for Head-Mounted Display devices like the Oculus Rift.VS Tool for WSS 3.0: Visual Studio (2005 and 2008) add-ons for WSS. Included: - schema.xml explorer?????????? Microsoft Office 2013 ? 1? – ????? ???????????: ?????? ???????? ???????? ??? ???????? ? ????? ??????????? ????? ??????? ?? TechEd Russia 2012.??UBBCODE: PHP????UBBCODE????,??????: 1.??????(10px ? 24px); 2.????; 3.?????; 4.??????; 5.??????; 6.??????(????????????); 7.??????; 8.?????; 9.?????; 10.???QQ??,??????; 11.???????(?????,??????????); 12.?????????; 13.????????; 14.?????????; 15.?????????; 16.?????????。??????QrPortal: ???????Summary??: fff

    Read the article

  • Taking a Flying Leap

    - by Lance Shaw
    Yesterday, I went skydiving with three of my children.  It was thrilling, scary, invigorating and exciting. While there is obvious risk involved, the reward and feeling of success was well worth it. You might already be wondering what skydiving would have to with WebCenter, so let me explain. Implementing a skydiving program and becoming an instructor does not happen overnight.  It does not happen with the purchase of the needed technology. Not one of us would go out, buy a parachute, the harnesses, helmet and all the gear and be able to convince anyone that we are now ready to be a skydiving instructor. The fact is that obtaining the technology is merely a small piece of the overall process and so is the case with managing content in your company. You don't just buy the right software (Oracle WebCenter Content) and go to your boss and declare information management success. There is planning, research and effort that goes into deploying software of any kind and especially when it is as mission-critical to the success of your business as Enterprise Content Management. To become a certified skydiving instructor takes at least 3 years of commitment and often longer. In the United States, candidates must complete over 500 solo jumps of their own over a minimum of 36 months and then must complete additional rigorous training under observation.  When you consider the amount of time and effort involved, it's not unlike getting a college degree and anyone that has trusted their lives to one of these instructors will no doubt appreciate their dedication to the curriculum.  Implementing an ECM system won't take that long, but it certainly requires commitment, analysis and consideration. But guess what?  Humans are involved and that means that mistakes can happen and that rules change.  This struck me while reading an excellent post on darkreading.com by Glenn S. Phillips entitled "Mission Impossible: 4 Reasons Compliance is Impossible".  His over-arching point was that with information management and security, environments change and people are involved meaning the work is never done.  He stated that you can never claim your compliance efforts are complete because of the following reasons. People are involved.  And lets face it, some are more trustworthy than others. Change is Constant. There is always some new technology coming along that is disruptive. Consumer grade cloud file sharing and sync tools come to mind here. Compliance is interpreted, not defined.  Laws and the judges that read them are always on the move. Technology is a tool, not a complete solution. There is no magic pill. The skydiving analogy holds true here as well.  Ultimately, a single person packs your parachute.  For obvious reasons, you prefer that this person be trustworthy but there are no absolute guarantees of a 100% error-free scenario.  Weather and wind conditions are never a constant and the best-laid plans for a great day of skydiving are easily disrupted by forces outside of your control.  Rules and regulations vary by location and may be updated at any time and as I mentioned early on, even the best technology on its own will only get you started. The good news is that, like skydiving, with the right technology, the right planning, the right team and a proper understanding of the rules and regulations that govern your industry, your ECM deployment can be a great success.  Failure to plan for any of the 4 factors that Glenn outlined in his article will certainly put your deployment and maybe even your company at risk, so consider them carefully. As a final aside, for those of you who consider skydiving an incredibly dangerous and risky pastime, consider this comparative statistic.  In 2012, the U.S. Parachute Association recorded 19 fatal skydiving accidents in the U.S. out of roughly 3.1 million jumps.  That’s 0.006 fatalities per 1,000 jumps. By comparison, the U.S. National Highway Traffic Safety Administration reports that there were 34,080 deaths due to car accidents in 2012.  Based on the percentages, one could argue that it is safer to jump out of a plane than to drive to the airport where the skydiving will take place. While the way you manage, secure, classify, control, retain and dispose of company files may not carry as much risk as driving or skydiving, it certainly carries risk for the organization when not planned and deployed appropriately.  Consider all the factors involved in your organization as you make your content management plans.  For additional areas of consideration, be sure to download our free whitepaper on the topic entitled "The Top 10 Criteria for Choosing an ECM System" which is available for download here.

    Read the article

  • CCSpriteHole in cocos2d 2.0?

    - by rakkarage
    i was using this cocos2d class CCSpriteHole in cocos2d 1.0 fine... http://jpsarda.tumblr.com/post/15779708304/new-cocos2d-iphone-extensions-a-progress-bar-and-a i am trying to convert it to cocos2d 2.0... i got it to compile by changing glVertexPointer to glVertexAttribPointer like in the 2.0 version of CCSpriteScale9 here http://jpsarda.tumblr.com/post/9162433577/scale9grid-for-cocos2d and changing contentSizeInPixels_ to contentSize_... -(id) init { if( (self=[super init]) ) { opacityModifyRGB_ = YES; opacity_ = 255; color_ = colorUnmodified_ = ccWHITE; capSize=capSizeInPixels=CGSizeZero; //Not used blendFunc_.src = CC_BLEND_SRC; blendFunc_.dst = CC_BLEND_DST; // update texture (calls updateBlendFunc) [self setTexture:nil]; // default transform anchor anchorPoint_ = ccp(0.5f, 0.5f); vertexDataCount=24; vertexData = (ccV2F_C4F_T2F*) malloc(vertexDataCount * sizeof(ccV2F_C4F_T2F)); [self setTextureRectInPixels:CGRectZero untrimmedSize:CGSizeZero]; } return self; } -(id) initWithTexture:(CCTexture2D*)texture rect:(CGRect)rect { NSAssert(texture!=nil, @"Invalid texture for sprite"); // IMPORTANT: [self init] and not [super init]; if( (self = [self init]) ) { [self setTexture:texture]; [self setTextureRect:rect]; } return self; } -(id) initWithTexture:(CCTexture2D*)texture { NSAssert(texture!=nil, @"Invalid texture for sprite"); CGRect rect = CGRectZero; rect.size = texture.contentSize; return [self initWithTexture:texture rect:rect]; } -(id) initWithFile:(NSString*)filename { NSAssert(filename!=nil, @"Invalid filename for sprite"); CCTexture2D *texture = [[CCTextureCache sharedTextureCache] addImage: filename]; if( texture ) return [self initWithTexture:texture]; return nil; } +(id)spriteWithFile:(NSString*)f { return [[self alloc] initWithFile:f]; } - (void) dealloc { if (vertexData) free(vertexData); } -(void) updateColor { ccColor4F color4; color4.r=(float)color_.r/255.0f; color4.g=(float)color_.g/255.0f; color4.b=(float)color_.b/255.0f; color4.a=(float)opacity_/255.0f; for (int i=0; i<vertexDataCount; i++) { vertexData[i].colors=color4; } } -(void)updateTextureCoords:(CGRect)rect { CCTexture2D *tex = texture_; if(!tex) return; float atlasWidth = (float)tex.pixelsWide; float atlasHeight = (float)tex.pixelsHigh; float left,right,top,bottom; left = rect.origin.x/atlasWidth; right = left + rect.size.width/atlasWidth; top = rect.origin.y/atlasHeight; bottom = top + rect.size.height/atlasHeight; // // |/|/|/| // CGSize capTexCoordsSize=CGSizeMake(capSizeInPixels.width/atlasWidth, capSizeInPixels.height/atlasHeight); // From left to right //Top band // Left vertexData[0].texCoords=(ccTex2F){left,top}; vertexData[1].texCoords=(ccTex2F){left,top+capTexCoordsSize.height}; vertexData[2].texCoords=(ccTex2F){left+capTexCoordsSize.width,top}; vertexData[3].texCoords=(ccTex2F){left+capTexCoordsSize.width,top+capTexCoordsSize.height}; // Center vertexData[4].texCoords=(ccTex2F){right-capTexCoordsSize.width,top}; vertexData[5].texCoords=(ccTex2F){right-capTexCoordsSize.width,top+capTexCoordsSize.height}; // Right vertexData[6].texCoords=(ccTex2F){right,top}; vertexData[7].texCoords=(ccTex2F){right,top+capTexCoordsSize.height}; //Center band // Left vertexData[8].texCoords=(ccTex2F){left,bottom-capTexCoordsSize.height}; vertexData[9].texCoords=(ccTex2F){left,top+capTexCoordsSize.height}; vertexData[10].texCoords=(ccTex2F){left+capTexCoordsSize.width,bottom-capTexCoordsSize.height}; vertexData[11].texCoords=(ccTex2F){left+capTexCoordsSize.width,top+capTexCoordsSize.height}; // Center vertexData[12].texCoords=(ccTex2F){right-capTexCoordsSize.width,bottom-capTexCoordsSize.height}; vertexData[13].texCoords=(ccTex2F){right-capTexCoordsSize.width,top+capTexCoordsSize.height}; // Right vertexData[14].texCoords=(ccTex2F){right,bottom-capTexCoordsSize.height}; vertexData[15].texCoords=(ccTex2F){right,top+capTexCoordsSize.height}; //Bottom band //Left vertexData[16].texCoords=(ccTex2F){left,bottom}; vertexData[17].texCoords=(ccTex2F){left,bottom-capTexCoordsSize.height}; vertexData[18].texCoords=(ccTex2F){left+capTexCoordsSize.width,bottom}; vertexData[19].texCoords=(ccTex2F){left+capTexCoordsSize.width,bottom-capTexCoordsSize.height}; // Center vertexData[20].texCoords=(ccTex2F){right-capTexCoordsSize.width,bottom}; vertexData[21].texCoords=(ccTex2F){right-capTexCoordsSize.width,bottom-capTexCoordsSize.height}; // Right vertexData[22].texCoords=(ccTex2F){right,bottom}; vertexData[23].texCoords=(ccTex2F){right,bottom-capTexCoordsSize.height}; } -(void) updateVertices { float left=0; //-spriteSizeInPixels.width*0.5f; float right=left+contentSize_.width; float bottom=0; //-spriteSizeInPixels.height*0.5f; float top=bottom+contentSize_.height; float holeLeft=holeRect.origin.x*CC_CONTENT_SCALE_FACTOR(); float holeRight=holeLeft+holeRect.size.width*CC_CONTENT_SCALE_FACTOR(); float holeBottom=holeRect.origin.y*CC_CONTENT_SCALE_FACTOR(); float holeTop=holeBottom+holeRect.size.height*CC_CONTENT_SCALE_FACTOR(); // // |/|/|/| // // From left to right //Top band // Left vertexData[0].vertices=(ccVertex2F){left,top}; vertexData[1].vertices=(ccVertex2F){left,holeTop}; vertexData[2].vertices=(ccVertex2F){holeLeft,top}; vertexData[3].vertices=(ccVertex2F){holeLeft,holeTop}; // Center vertexData[4].vertices=(ccVertex2F){holeRight,top}; vertexData[5].vertices=(ccVertex2F){holeRight,holeTop}; // Right vertexData[6].vertices=(ccVertex2F){right,top}; vertexData[7].vertices=(ccVertex2F){right,holeTop}; //Center band // Left vertexData[8].vertices=(ccVertex2F){left,holeBottom}; vertexData[9].vertices=(ccVertex2F){left,holeTop}; vertexData[10].vertices=(ccVertex2F){holeLeft,holeBottom}; vertexData[11].vertices=(ccVertex2F){holeLeft,holeTop}; // Center vertexData[12].vertices=(ccVertex2F){holeRight,holeBottom}; vertexData[13].vertices=(ccVertex2F){holeRight,holeTop}; // Right vertexData[14].vertices=(ccVertex2F){right,holeBottom}; vertexData[15].vertices=(ccVertex2F){right,holeTop}; //Bottom band //Left vertexData[16].vertices=(ccVertex2F){left,bottom}; vertexData[17].vertices=(ccVertex2F){left,holeBottom}; vertexData[18].vertices=(ccVertex2F){holeLeft,bottom}; vertexData[19].vertices=(ccVertex2F){holeLeft,holeBottom}; // Center vertexData[20].vertices=(ccVertex2F){holeRight,bottom}; vertexData[21].vertices=(ccVertex2F){holeRight,holeBottom}; // Right vertexData[22].vertices=(ccVertex2F){right,bottom}; vertexData[23].vertices=(ccVertex2F){right,holeBottom}; } -(void) setHole:(CGRect)r inRect:(CGRect)totalSurface { holeRect=r; self.contentSize=totalSurface.size; holeRect.origin=ccpSub(holeRect.origin,totalSurface.origin); CGPoint holeCenter=ccp(holeRect.origin.x+holeRect.size.width*0.5f,holeRect.origin.y+holeRect.size.height*0.5f); self.anchorPoint=ccp(holeCenter.x/contentSize_.width,holeCenter.y/contentSize_.height); //[self updateTextureCoords:rectInPixels_]; [self updateVertices]; [self updateColor]; } -(void) draw { BOOL newBlend = NO; if( blendFunc_.src != CC_BLEND_SRC || blendFunc_.dst != CC_BLEND_DST ) { newBlend = YES; glBlendFunc( blendFunc_.src, blendFunc_.dst ); } glBindTexture(GL_TEXTURE_2D, [texture_ name]); glVertexAttribPointer(kCCVertexAttrib_Position, 2, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[0].vertices); glVertexAttribPointer(kCCVertexAttrib_TexCoords, 2, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[0].texCoords); glVertexAttribPointer(kCCVertexAttrib_Color, 4, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[0].colors); glDrawArrays(GL_TRIANGLE_STRIP, 0, 8); glVertexAttribPointer(kCCVertexAttrib_Position, 2, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[8].vertices); glVertexAttribPointer(kCCVertexAttrib_TexCoords, 2, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[8].texCoords); glVertexAttribPointer(kCCVertexAttrib_Color, 4, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[8].colors); glDrawArrays(GL_TRIANGLE_STRIP, 0, 8); glVertexAttribPointer(kCCVertexAttrib_Position, 2, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[16].vertices); glVertexAttribPointer(kCCVertexAttrib_TexCoords, 2, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[16].texCoords); glVertexAttribPointer(kCCVertexAttrib_Color, 4, GL_FLOAT, GL_FALSE, sizeof(ccV2F_C4F_T2F), &vertexData[16].colors); glDrawArrays(GL_TRIANGLE_STRIP, 0, 8); if( newBlend ) glBlendFunc(CC_BLEND_SRC, CC_BLEND_DST); } -(void)setTextureRectInPixels:(CGRect)rect untrimmedSize:(CGSize)untrimmedSize { rectInPixels_ = rect; rect_ = CC_RECT_PIXELS_TO_POINTS( rect ); //[self setContentSizeInPixels:untrimmedSize]; [self updateTextureCoords:rectInPixels_]; } -(void)setTextureRect:(CGRect)rect { CGRect rectInPixels = CC_RECT_POINTS_TO_PIXELS( rect ); [self setTextureRectInPixels:rectInPixels untrimmedSize:rectInPixels.size]; } // // RGBA protocol // #pragma mark CCSpriteHole - RGBA protocol -(GLubyte) opacity { return opacity_; } -(void) setOpacity:(GLubyte) anOpacity { opacity_ = anOpacity; // special opacity for premultiplied textures if( opacityModifyRGB_ ) [self setColor: (opacityModifyRGB_ ? colorUnmodified_ : color_ )]; [self updateColor]; } - (ccColor3B) color { if(opacityModifyRGB_){ return colorUnmodified_; } return color_; } -(void) setColor:(ccColor3B)color3 { color_ = colorUnmodified_ = color3; if( opacityModifyRGB_ ){ color_.r = color3.r * opacity_/255; color_.g = color3.g * opacity_/255; color_.b = color3.b * opacity_/255; } [self updateColor]; } -(void) setOpacityModifyRGB:(BOOL)modify { ccColor3B oldColor = self.color; opacityModifyRGB_ = modify; self.color = oldColor; } -(BOOL) doesOpacityModifyRGB { return opacityModifyRGB_; } #pragma mark CCSpriteHole - CocosNodeTexture protocol -(void) updateBlendFunc { if( !texture_ || ! [texture_ hasPremultipliedAlpha] ) { blendFunc_.src = GL_SRC_ALPHA; blendFunc_.dst = GL_ONE_MINUS_SRC_ALPHA; [self setOpacityModifyRGB:NO]; } else { blendFunc_.src = CC_BLEND_SRC; blendFunc_.dst = CC_BLEND_DST; [self setOpacityModifyRGB:YES]; } } -(void) setTexture:(CCTexture2D*)texture { // accept texture==nil as argument NSAssert( !texture || [texture isKindOfClass:[CCTexture2D class]], @"setTexture expects a CCTexture2D. Invalid argument"); texture_ = texture; [self updateBlendFunc]; } -(CCTexture2D*) texture { return texture_; } @end but now positioning and scaling seem to not work? and it starts in the wrong position... but changing the opacity still works. so i was wondering if anyone can see why my 2.0 version is not working? or if maybe there is a better way to do a sprite hole with cocos2d/opengl 2.0? shaders? thanks

    Read the article

  • CSS3 - "connecting" 2 classes animation [closed]

    - by Nave Tseva
    I have this CSS +HTML code: <!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>What</title> <style type="text/css"> #page { width: 900px; padding: 0px; margin: 0 auto; direction: rtl; position: relative; } #box1 { position: relative; width: 500px; border: 1px solid black; box-shadow: -3px 8px 34px #808080; border-radius: 20px; box-shadow: -8px 5px 5px #888888; right: 300px; top: 250px; height: 150px; -webkit-transition: all 1s; font-size: large; color: Black; padding: 10px; background: #D0D0D0; opacity: 0; } @-webkit-keyframes myFirst { 0% { right: 300px; top: 150px; background: #D0D0D0; opacity: 0; } 100% { background: #909090; ; right: 300px; top: 200px; opacity: 1; } } #littlebox1 { top: 200px; position: absolute; display: inline-block; } .littlebox1-sentence { font-size: large; padding-bottom: 15px; padding-top: 15px; padding-left: 25px; padding-right: 10px; background: #D0D0D0; border-radius: 10px; -webkit-transition: background .25s ease-in-out; } #littlebox1:hover ~ #box1 { -webkit-transition: all 0s; background: #909090;; right: 300px; top: 200px; -webkit-animation: myFirst 1s; -webkit-animation-fill-mode: initial; opacity: 1; } .littlebox1-sentence:hover { background: #909090; } .littlebox1-sentence:hover + .triangle { border-right: 50px solid #909090; } .triangle { position: relative; width: 0; height: 0; border-right: 50px solid #D0D0D0; border-top: 24px solid transparent; border-bottom: 24px solid transparent; right: 160px; -webkit-transition: border-right .25s ease-in-out; } .triangle:hover { border-right:50px solid #909090; } </style> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script> $(function() { $('.littlebox1-sentence').hover(function() { $(this).css('background', '#909090'); $('.triangle').css('border-right', '50px solid #909090'); }); </script> <script> $(function() { $('.triangle').hover(function() { $(this).css('border-right', '50px solid #909090'); $('.littlebox1-sentence').css('background', '#909090'); }); </script> </head> <body dir="rtl"> <div id="page"> <div id="littlebox1" class="littlebox1-sentence">put your mouse here</div><div id="littlebox1" class="triangle"> </div> <div id="box1"> </div> </div> </body> </html> Live example you will find here: http://jsfiddle.net/FLe4g/12/ The problem here that something here wrong in the second jquery code. I want that every time that I put the mouse on the box, or on the triangke they both will change ther color together. when I put the mouse on the box it works fine, but when I put the mouse on the triangle it don't work. Any suggestions how to fix this code?

    Read the article

  • How to properly position 3rd level menu [migrated]

    - by drewrowalnd
    If you look here: http://snippetmagazine.com/ under about isl-board of trustees you can se I have created a third level dropdown, but how can I properly align that drop down? Below you will see my css. #menudiv { width: 999px; float: left; clear: left; height: 250px; background: url(images/top_bg.png) no-repeat; margin-top: 10px; } mainmenu { width: 948px; height: 63px; float: left; margin-left: 16px; margin-top:5px; border: 1px solid #D5D5D5; -moz-border-radius: 3px; -webkit-border-radius: 3px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); background:url(images/nav_bg.gif) repeat; } .mainnav { margin: 0; padding: 0; list-style: none; } .mainnav * { margin: 0; padding: 0; list-style: none; } .mainnav ul { position: absolute; top: -999em; display: none; } .mainnav li { float: left; position: relative; z-index: 999; height: 63px; line-height: 55px; margin-right: 0px; border-right: 1px solid #D5D5D5; } .mainnav li.last { border-right: none; } .mainnav a { display: block; font-size: 19px; margin: 0; color: #cc9900; font-family: Copperplate, Arial, Helvetica, Sans serif; font-weight:600; text-decoration: none; padding: 3px 13px 3px 12px; color: #555; text-shadow: 0 1px 1px white; } .mainnav li:hover { text-decoration: none; border-bottom: solid 0px #ccc; background: white; } .mainnav ul li{ width: 132px; } .mainnav li:hover ul, ul.mainnav li.sfHover ul { left: 0px; top: 50px; padding-top: 0px; width: 132px; border-bottom: solid 0px #eaeaea; background: url(images/nav_dropdown_shadow.gif) repeat-x top; padding: 6px 0 0px 0px; margin: 13px 0 0 -1px; border: 1px solid #D5D5D5; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); width: 175px; border-bottom-left-radius: 3px 3px; border-bottom-right-radius: 3px 3px; } .mainnav li:hover li ul, .mainnav li.sfHover li ul { top: -999em; } .mainnav li li:hover ul, ul.mainnav li li.sfHover ul { left: 132px; top: -8px; } .mainnav li:hover ul, .mainnav li li:hover ul { top: -999em; } .mainnav li li { color: #555; display: block; padding: 0px; height: auto !important; border: none; width:175px; background: url(images/nav_dropdown_bg.gif) repeat; margin: 0; } .mainnav li li a:link, .mainnav li li a:visited { display: block; height: auto !important; line-height: 30px; color: #333; font-weight: normal; font-family: arial, helvetica, sans-serif; font-size: 12px; border: none; margin: 0; padding-left: 10px; overflow:hidden; border-bottom: 1px solid #E3E3E3; } .mainnav li li :hover{ } .mainnav li li a:hover { background: none; color:#555 ; border-bottom: 1px solid #E3E3E3; }

    Read the article

  • CSS hover behavior inconsistent on desktop/mobile devices [migrated]

    - by tbart
    I have a strange problem: This page looks good on desktop browsers, but the hovering effect does not seem to work correctly on at least my CM7 Android 2.3.7 device. I know hovering is not supposed to work on touch displays as it does with a mouse, but I'd like to have touch feedback, i.e. the highlight color should show once the user has tapped a menu item. This does work when the link is just a href="#" but it does not when it is a real link. I tried all sorts of stuff as you can see, to no avail. If you go back in the browser history after having tapped a real link, the item is highlighted, so the browser understands the CSS I am throwing at it. However, the javascript alert makes it clear that it only seems to interpret the link opening action and does not care about the color changing stuff. Weird that is. Workarounds welcome, preferable without javascript, but if it has to be JS, then go ahead! either go here: http://orpheus.co.at/hoverprob and Use the source, Luke! or see it here in all its glory: <html> <head> <meta name="viewport" content="width=320"> <style> #nav, #nav ul { width: 100%; float: left; list-style: none; line-height: 1; background: #fff; font-weight: bold; padding: 0; margin: 0 0 5px 0; } #nav a { display: block; color: #001834; text-decoration: none; padding: 5px 7px; } #nav li { float: left; padding: 0; width: 33%; } #nav li ul { position: absolute; left: -9999px; height: auto; margin: 0; opacity: .95; width: 100%; } #nav li a { text-align: center; height: 20px; line-height: 20px; } #nav li ul li a { text-align: left; } #nav li ul li { float: none; /* width: 316px; */ width: 100%; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left: -9999px; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: 0; } #nav li.educate { background: #FFF0B8; /* background: #FF0000; */ /* border-radius: 5px; */ border: 5px; } #nav li.educate:hover { background: #FFCE00; /* border-radius: 5px; */ } </style> </head> <body> <div id="mobMenu"> <ul id="nav" class="nav"> <li class="educate"><a href="#">menu</a> <ul class="educate"> <li class="educate"><a href="#">href=&quot#&quot;, works</a></li> <!--(+emtpy onmouseover for iPose devices)--> <li class="educate"><a onmouseover="" href="index.html">does not work, real link</a></li> <li class="educate" id="bla"><a onmousedown="document.getElementById('bla').style.backgroundColor='Blue'; alert('Done');document.location='index.html';" href="#">JS, not interpreted in corr order</a></li> </ul> </li> </div> </body>

    Read the article

  • returning correct multiTouch id

    - by Max
    I've spent countless hours on reading tutorials and looking at every question related to multiTouch from here and Stackoverflow. But I just cannot figure out how to do this correctly. I use a loop to get my pointerId, I dont see alot of people doing this but its the only way I've managed to get it somewhat working. I have two joysticks on my screen, one for moving and one for controlling my sprites rotation and the angle he shoots, like in Monster Shooter. Both these work fine. My problem is that when I Move my sprite at the same time as Im shooting, my touchingPoint for my movement is set to the touchingPoint of my shooting, since the x and y is higher on the touchingPoint of my shooting (moving-stick on left side of screen, shooting-stick on right side), my sprite speeds up, this creates an unwanted change in speed for my sprite. I will post my entire onTouch method here with some variable-changes to make it more understandable. Since I do not know where Im going wrong. public void update(MotionEvent event) { if (event == null && lastEvent == null) { return; } else if (event == null && lastEvent != null) { event = lastEvent; } else { lastEvent = event; } int pointerCount = event.getPointerCount(); for (int i = 0; i < pointerCount; i++) { int x = (int) event.getX(i); int y = (int) event.getY(i); int id = event.getPointerId(i); int action = event.getActionMasked(); int actionIndex = event.getActionIndex(); String actionString; switch (action) { case MotionEvent.ACTION_DOWN: actionString = "DOWN"; break; case MotionEvent.ACTION_UP: shooting=false; // when shooting is true, it shoots dragging=false; // when dragging is true, it moves actionString = "UP"; break; case MotionEvent.ACTION_POINTER_DOWN: actionString = "PNTR DOWN"; break; case MotionEvent.ACTION_POINTER_UP: shooting=false; dragging=false; actionString = "PNTR UP"; break; case MotionEvent.ACTION_CANCEL: shooting=false; dragging=false; actionString = "CANCEL"; break; case MotionEvent.ACTION_MOVE: try{ if((int) event.getX(id) > 0 && (int) event.getX(id) < touchingBox && (int) event.getY(id) > touchingBox && (int) event.getY(id) < view.getHeight()){ movingPoint.x = (int) event.getX(id); movingPoint.y = (int) event.getY(id); dragging = true; } else if((int) event.getX(id) > touchingBox && (int) event.getX(id) < view.getWidth() && (int) event.getY(id) > touchingBox && (int) event.getY(id) < view.getHeight()){ shootingPoint.x = (int) event.getX(id); shootingPoint.y = (int) event.getY(id); shooting=true; }else{ shooting=false; dragging=false; } }catch(Exception e){ } actionString = "MOVE"; break; default: actionString = ""; } Wouldnt post this much code if I wasnt at an absolute loss of what I'm doing wrong. I simply can not get a good understanding of how multiTouching works. basicly movingPoint changes for both my first and second finger. I bind it to a box, but aslong as I hold one finger within this box, it changes its value based on where my second finger touches. It moves in the right direction and nothing gives an error, the problem is the speed-change, its almost like it adds up the two touchingPoints.

    Read the article

  • "'0.offsetWidth' is null or not an object" - Coda Slider - Javascript Error Question

    - by bgadoci
    I implemented the Coda Slider tutorial successfully that is located here: http://jqueryfordesigners.com/coda-slider-effect/ The slider works great but I am getting a javascript error that I am not sure how to fix. The error says: '0.offsetWidth' is null or not an object coda-slider.js, line 19 character 3 Not sure how to fix it. Anyone have any ideas? Here is my js and css (don't think I need to upload the HTML but let me know if that helps). JS (coda-slider.js) // when the DOM is ready... $(document).ready(function () { var $panels = $('#slider .scrollContainer > div'); var $container = $('#slider .scrollContainer'); // if false, we'll float all the panels left and fix the width // of the container var horizontal = true; // float the panels left if we're going horizontal if (horizontal) { $panels.css({ 'float' : 'left', 'position' : 'relative' // IE fix to ensure overflow is hidden }); // calculate a new width for the container (so it holds all panels) $container.css('width', $panels[0].offsetWidth * $panels.length); <------line 19 } // collect the scroll object, at the same time apply the hidden overflow // to remove the default scrollbars that will appear var $scroll = $('#slider .scroll').css('overflow', 'hidden'); // apply our left + right buttons $scroll .before('<img class="scrollButtons left" src="/images/layout/navigation/scroll_left.png" />') .after('<img class="scrollButtons right" src="/images/layout/navigation/scroll_right.png" />'); // handle nav selection function selectNav() { $(this) .parents('ul:first') .find('a') .removeClass('selected') .end() .end() .addClass('selected'); } $('#slider .navigation').find('a').click(selectNav); // go find the navigation link that has this target and select the nav function trigger(data) { var el = $('#slider .navigation').find('a[href$="' + data.id + '"]').get(0); selectNav.call(el); } if (window.location.hash) { trigger({ id : window.location.hash.substr(1) }); } else { $('ul.navigation a:first').click(); } // offset is used to move to *exactly* the right place, since I'm using // padding on my example, I need to subtract the amount of padding to // the offset. Try removing this to get a good idea of the effect var offset = parseInt((horizontal ? $container.css('paddingTop') : $container.css('paddingLeft')) || 0) * -1; var scrollOptions = { target: $scroll, // the element that has the overflow // can be a selector which will be relative to the target items: $panels, navigation: '.navigation a', // selectors are NOT relative to document, i.e. make sure they're unique prev: 'img.left', next: 'img.right', // allow the scroll effect to run both directions axis: 'xy', onAfter: trigger, // our final callback offset: offset, // duration of the sliding effect duration: 500, // easing - can be used with the easing plugin: // http://gsgd.co.uk/sandbox/jquery/easing/ easing: 'swing' }; // apply serialScroll to the slider - we chose this plugin because it // supports// the indexed next and previous scroll along with hooking // in to our navigation. $('#slider').serialScroll(scrollOptions); // now apply localScroll to hook any other arbitrary links to trigger // the effect $.localScroll(scrollOptions); // finally, if the URL has a hash, move the slider in to position, // setting the duration to 1 because I don't want it to scroll in the // very first page load. We don't always need this, but it ensures // the positioning is absolutely spot on when the pages loads. scrollOptions.duration = 1; $.localScroll.hash(scrollOptions); }); CSS #slider { margin-left: 35px; position: relative; width: 875px; } .scroll { position: relative; width: 875px; height: 268px; overflow: auto; /* fix for IE to respect overflow */ background: #FFFFFF scroll 0; } .scrollContainer div.panel { position: relative; height: 210px; width: 875px; /* change to 560px if not using JS to remove rh.scroll */ } .scrollButtons { position: absolute; top: 115px; cursor: pointer; } .scrollButtons.left { left: -20px; } .scrollButtons.right { right: -20px; }

    Read the article

  • Emulating old-school sprite flickering (theory and concept)

    - by Jeffrey Kern
    I'm trying to develop an oldschool NES-style video game, with sprite flickering and graphical slowdown. I've been thinking of what type of logic I should use to enable such effects. I have to consider the following restrictions if I want to go old-school NES style: No more than 64 sprites on the screen at a time No more than 8 sprites per scanline, or for each line on the Y axis If there is too much action going on the screen, the system freezes the image for a frame to let the processor catch up with the action From what I've read up, if there were more than 64 sprites on the screen, the developer would only draw high-priority sprites while ignoring low-priority ones. They could also alternate, drawing each even numbered sprite on opposite frames from odd numbered ones. The scanline issue is interesting. From my testing, it is impossible to get good speed on the XBOX 360 XNA framework by drawing sprites pixel-by-pixel, like the NES did. This is why in old-school games, if there were too many sprites on a single line, some would appear if they were cut in half. For all purposes for this project, I'm making scanlines be 8 pixels tall, and grouping the sprites together per scanline by their Y positioning. So, dumbed down I need to come up with a solution that.... 64 sprites on screen at once 8 sprites per 'scanline' Can draw sprites based on priority Can alternate between sprites per frame Emulate slowdown Here is my current theory First and foremost, a fundamental idea I came up with is addressing sprite priority. Assuming values between 0-255 (0 being low), I can assign sprites priority levels, for instance: 0 to 63 being low 63 to 127 being medium 128 to 191 being high 192 to 255 being maximum Within my data files, I can assign each sprite to be a certain priority. When the parent object is created, the sprite would randomly get assigned a number between its designated range. I would then draw sprites in order from high to low, with the end goal of drawing every sprite. Now, when a sprite gets drawn in a frame, I would then randomly generate it a new priority value within its initial priority level. However, if a sprite doesn't get drawn in a frame, I could add 32 to its current priority. For example, if the system can only draw sprites down to a priority level of 135, a sprite with an initial priority of 45 could then be drawn after 3 frames of not being drawn (45+32+32+32=141) This would, in theory, allow sprites to alternate frames, allow priority levels, and limit sprites to 64 per screen. Now, the interesting question is how do I limit sprites to only 8 per scanline? I'm thinking that if I'm sorting the sprites high-priority to low-priority, iterate through the loop until I've hit 64 sprites drawn. However, I shouldn't just take the first 64 sprites in the list. Before drawing each sprite, I could check to see how many sprites were drawn in it's respective scanline via counter variables . For example: Y-values between 0 to 7 belong to Scanline 0, scanlineCount[0] = 0 Y-values between 8 to 15 belong to Scanline 1, scanlineCount[1] = 0 etc. I could reset the values per scanline for every frame drawn. While going down the sprite list, add 1 to the scanline's respective counter if a sprite gets drawn in that scanline. If it equals 8, don't draw that sprite and go to the sprite with the next lowest priority. SLOWDOWN The last thing I need to do is emulate slowdown. My initial idea was that if I'm drawing 64 sprites per frame and there's still more sprites that need to be drawn, I could pause the rendering by 16ms or so. However, in the NES games I've played, sometimes there's slowdown if there's not any sprite flickering going on whereas the game moves beautifully even if there is some sprite flickering. Perhaps give a value to each object that uses sprites on the screen (like the priority values above), and if the combined values of all objects w/ sprites surpass a threshold, introduce the sprite flickering? IN CONCLUSION... Does everything I wrote actually sound legitimate and could work, or is it a pipe dream? What improvements can you all possibly think with this game programming theory of mine?

    Read the article

  • mediaelement.js control sizes are wrong when clip nested in a hidden element

    - by Martin Francis
    It's a nasty one this. In an audio control placed within a container element whose display property is initially set to none, the audio clip does NOT correctly size the progress bar when it is initialised. This is clear when the container's display property is changed from 'none' to '' (which is equivalent to 'static'). But who would ever do that? I make extensive use of 'tabbed' display arrangements on community sites like this one: http://www.churchesInBracebridge.ca Owing to the page arrangement, the audio controls which you see under 'sermons' (which at the time of writing still using Flash rather than John's excellent library here) are initially rendered in a div that is hidden. Simplified Test case Rather than have anyone have to wade through all of that, here's a much simplified test case: http://jsfiddle.net/sJL6T/36 Here's the full page source for those who'd prefer to work with it that way. <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>MediaElementPlayer.js</title> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="http://mediaelementjs.com/js/mejs-2.13.1/mediaelement-and-player.js"></script> <link rel="stylesheet" href="http://mediaelementjs.com/js/mejs-2.13.1/mediaelementplayer.css" /> <script type="text/javascript"> function toggle(id){ document.getElementById(id).style.display= (document.getElementById(id).style.display=='none' ? '' : 'none'); } </script> </head> <body> <h1>MediaElementPlayer.js</h1> <h2 onclick="return toggle('test1')">Initially Hidden (Click to toggle)</h2> <div id='test1' style='display:none'> <audio controls="controls"> <source src="http://mediaelementjs.com/media/AirReview-Landmarks-02-ChasingCorporate.mp3" type="audio/mp3" /> </audio> </div> <h2 onclick="return toggle('test2')">Initially Shown (Click to toggle)</h2> <div id='test2' style=''> <audio controls="controls"> <source src="http://mediaelementjs.com/media/AirReview-Landmarks-02-ChasingCorporate.mp3" type="audio/mp3" /> </audio> </div> <script> $('audio').mediaelementplayer(); </script> </body> </html> Possible Workarounds Now I know that Google maps has the same quirk and there are two possible ways I've used to deal with that: Use absolute positioning in a displayed div to place the element 10,000px to the left then bring it onto the stage when we want to see it Have the map pane displayed when loading then hide it as soon as it's loaded (ugly I know, but it usually works) However either approach would be a pain to do, as I have a lot of legacy code using the simpler div hiding method. I know that JQuery can get the dimensions of an element event if it is hidden - someone thoughtfully fiddled that and it does work: http://jsfiddle.net/sJL6T/9 Perhaps it may be possible to modify the actual library to find correct dimensions, even if the container itself is hidden? That would be wonderful, if it can be done! Initial experiments on mediaelement-and-player.js code I found that when I provided a fixed value in the setControlsSize function for railWidth, I got consistent results with both controls in the test case above (and obviously I'm working with my own copy of the library to do that, not the one stored at mediaelementjs.com): // outer area rail.width(railWidth); Change to this: // outer area railWidth=216; rail.width(railWidth); Many thanks in anticipation! Martin Francis <<

    Read the article

  • Android SQLlite crashes after trying retrieving data from it

    - by Pavel
    Hey everyone. I'm kinda new to android programming so please bear with me. I'm having some problems with retrieving records from the db. Basically, all I want to do is to store latitudes and longitudes which GPS positioning functions outputs and display them in a list using ListActivity on different tab later on. This is how the code for my DBAdapter helper class looks like: public class DBAdapter { public static final String KEY_ROWID = "_id"; public static final String KEY_LATITUDE = "latitude"; public static final String KEY_LONGITUDE = "longitude"; private static final String TAG = "DBAdapter"; private static final String DATABASE_NAME = "coords"; private static final String DATABASE_TABLE = "coordsStorage"; private static final int DATABASE_VERSION = 1; private static final String DATABASE_CREATE = "create table coordsStorage (_id integer primary key autoincrement, " + "latitude integer not null, longitude integer not null);"; private final Context context; private DatabaseHelper DBHelper; private SQLiteDatabase db; public DBAdapter(Context ctx) { this.context = ctx; DBHelper = new DatabaseHelper(context); } private static class DatabaseHelper extends SQLiteOpenHelper { DatabaseHelper(Context context) { super(context, DATABASE_NAME, null, DATABASE_VERSION); } @Override public void onCreate(SQLiteDatabase db) { db.execSQL(DATABASE_CREATE); } @Override public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) { Log.w(TAG, "Upgrading database from version " + oldVersion + " to " + newVersion + ", which will destroy all old data"); db.execSQL("DROP TABLE IF EXISTS titles"); onCreate(db); } } //---opens the database--- public DBAdapter open() throws SQLException { db = DBHelper.getWritableDatabase(); return this; } //---closes the database--- public void close() { DBHelper.close(); } //---insert a title into the database--- public long insertCoords(int latitude, int longitude) { ContentValues initialValues = new ContentValues(); initialValues.put(KEY_LATITUDE, latitude); initialValues.put(KEY_LONGITUDE, longitude); return db.insert(DATABASE_TABLE, null, initialValues); } //---deletes a particular title--- public boolean deleteTitle(long rowId) { return db.delete(DATABASE_TABLE, KEY_ROWID + "=" + rowId, null) 0; } //---retrieves all the titles--- public Cursor getAllTitles() { return db.query(DATABASE_TABLE, new String[] { KEY_ROWID, KEY_LATITUDE, KEY_LONGITUDE}, null, null, null, null, null); } //---retrieves a particular title--- public Cursor getTitle(long rowId) throws SQLException { Cursor mCursor = db.query(true, DATABASE_TABLE, new String[] { KEY_ROWID, KEY_LATITUDE, KEY_LONGITUDE}, KEY_ROWID + "=" + rowId, null, null, null, null, null); if (mCursor != null) { mCursor.moveToFirst(); } return mCursor; } //---updates a title--- /*public boolean updateTitle(long rowId, int latitude, int longitude) { ContentValues args = new ContentValues(); args.put(KEY_LATITUDE, latitude); args.put(KEY_LONGITUDE, longitude); return db.update(DATABASE_TABLE, args, KEY_ROWID + "=" + rowId, null) 0; }*/ } Now my question is - am I doing something wrong here? If yes could someone please tell me what? And how I should retrieve the records in organised list manner? Help would be greatly appreciated!!

    Read the article

  • Rendering a Long Document on iPad

    - by benjismith
    I'm implementing a document viewer with highlighting/annotation capabilities for a custom document format on iPad. The documents are kind of long (100 to 200 pages, if printed on paper) and I've had a hard time finding the right approach. Here are the requirments: 1) Basic rich-text styling: control of left/right margins. Control of font name, size, foreground/background color, and line spacing. Bold, italics, underline, etc. 2) Selection and highlighting of arbitrary text regions (not limited to paragraph boundaries, like in Safari/UIWebView). 3) Customization of the Cut/Copy/Paste popup (what is that thing called anyhow? UIActionBar?) This is one of the essential requirements of the app. My first implementation was based on UIWebView. I just rendered the document as HTML with CSS for text styling. But I couldn't get the kind of text selection behavior I wanted (across paragraph boundaries) and the UIActionBar can't be customized from within UIWebView. So I started working on a javascript approach, faking the device text-selection behavior using JQuery to trap touch events and dynamically modifying the DOM to change the background color of selected regions of text. I built a fake UIActionBar control as a hidden DIV, positioning it and unhiding it whenever there was an active selection region. Not too shabby. The main problem is that it's SLOOOOOOOW. Scrolling through the document is nice and quick, but dynamically changing the DOM is not very snappy. Plus, I couldn't figure out how to recreate the magnifier loupe, so my fake text-selection GUI doesn't look quite the same as the native implementation. Also, I haven't yet implemented the communication bridge between the javascript layer and the objective-c layer (where the rest of the app lives), but it was shaping up to be a huge hassle. So I've been looking at CoreText, but there are precious few examples on the web. I spent a little time with this simple little demo: http://github.com/jonasschnelli/I7CoreTextExample/ It shows how to use CoreText to draw an NSAttributedText string into a UIView. But it has its own problems: It doesn't implement text-selection behavior, and it doesn't present a UIActionBar, so I don't have any idea how to make that happen. And, more importantly, it tries to draw the entire document all at once, with significant performance degradations for long documents. My documents can have thousands of paragraphs, and less than 1% of the document is ever on screen at a time. On the plus side, these documents already contain precise formatting information. I know the exact page-position of every line of text, so I don't need a layout engine. Does anyone know how to implement this sort of view using CoreText? I understand that a full-fledged implementation is overkill for a question like this, but I'm looking for a good CoreText example with a few basic requirements: 1) Precise layout & formatting control (using the formatting metrics and text styles I've already calculated). 2) Arbitrary selection of text. 3) Customization of the UIActionBar. 4) Efficient recycling of resources for off-screen objects. I'd be happy to implement my own recycling when text elements scroll off-screen, but wouldn't that require re-implementing UIScrollView? I'm brand-new to iPhone development, and still getting used to Objective-C, but I've been working in other languages (Java, C#, flex/actionscript, etc) for more than ten years, so I feel confident in my ability to get the work done, if only I had a better feel for the iPhone SDK and the common coding patterns for stuff like this. Is it just me, or does the SDK documentation really suck? Anyhow, thanks for your help!

    Read the article

  • Vertical text inside table headers using a JavaScript-based SVG library

    - by Oleg
    I use jqGrid with many columns containing boolean information, which are displayed as checkboxes inside the table (see http://www.ok-soft-gmbh.com/VerticalHeaders/TestFixedO.htm as an example). To display information more compactly I use vertical column headers. It works very well and works in jqGrid in all browsers (see my discussion with Tony Tomov in jqGrid forum http://www.trirand.com/blog/?page_id=393/feature-request/headers-with-vertical-orientation/), but in IE vertical text is blurred and doesn't look nice enough (open the link above in IE and you will see exactly what I mean). I was asked from users why the text displayed so strangely. So I'm thinking of using a JavaScript-based SVG library like SVG Web ( http://code.google.com/p/svgweb/ ) or Raphaël ( http://raphaeljs.com/ ). SVG is very powerful and it is difficult to find a good example. I need only to display vertical text (-90 grad, from the bottom up) and use if possible without working in mode of absolute positioning. So one more time my question: I need to have a possibility to display vertical text (-90 grad rotation) inside <td> elements of a table header. I want to use a JavaScript-based SVG library like SVG Web or Raphaël. The solution must support IE6. Does anybody have a good reference example which could help me do this? If somebody posts a whole solution of the problem I would be happy. To be exact here is my current solution: I define .rotate { -webkit-transform: rotate(-90deg); /* Safari 3.1+, Chrome */ -moz-transform: rotate(-90deg); /* Firefox 3.5+ */ -o-transform: rotate(-90deg); /* Opera starting with 10.50 */ /* Internet Explorer: */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* IE6, IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)" /* IE8 */; } define RotateCheckboxColumnHeaders function var RotateCheckboxColumnHeaders = function (grid, headerHeight) { // we use grid as context (if one have more as one table on tnhe page) var trHead = $("thead:first tr", grid.hdiv); var cm = grid.getGridParam("colModel"); $("thead:first tr th").height(headerHeight); headerHeight = $("thead:first tr th").height(); for (var iCol = 0; iCol < cm.length; iCol++) { var cmi = cm[iCol]; if (cmi.formatter === 'checkbox') { // we must set width of column header div BEFOR adding class "rotate" to // prevent text cutting based on the current column width var headDiv = $("th:eq(" + iCol + ") div", trHead); headDiv.width(headerHeight).addClass("rotate"); if (!$.browser.msie) { if ($.browser.mozilla) { headDiv.css("left", (cmi.width - headerHeight) / 2 + 3).css("bottom", 7); } else { headDiv.css("left", (cmi.width - headerHeight) / 2); } } else { var ieVer = jQuery.browser.version.substr(0, 3); // Internet Explorer if (ieVer !== "6.0" && ieVer !== "7.0") { headDiv.css("left", cmi.width / 2 - 4).css("bottom", headerHeight / 2); $("span", headDiv).css("left", 0); } else { headDiv.css("left", 3); } } } } }; And include a call like RotateCheckboxColumnHeaders(grid, 110); after creating jqGrid.

    Read the article

  • Heading div images should be displayed at a lower depth

    - by Mack
    I have a webpage where the top 25% of the page is the heading(with images in it) & the rest of the page has the content. I am trying to get the heading div to display is pictures at a lower depth as the content div because currently the heading images overflow into the content div(intentionally) & when they do they mess up the positioning of the HTML elements in the content div. My code below should make the heading div display below the content div but it doesn't. Can you help me figure out why & how to fix it? My CSS: html, body { height: 100%; width: 100%; } body { background-color: RGB(255, 255, 255); margin: 20px; text-align: center; } #outerContainer { background-color: #DCFF9A; height: 100%; width: 100%; } #header { width: 1200px; height: 25%; background-color: blue; margin-left: auto; margin-right: auto; overflow: visible; z-index: -5; } #main { display: block; width: 1200px; height: 60%; background-color: blue; margin-left: auto; margin-right: auto; z-index: 5; } #navBar { float: left; height: 800px; width: 240px; background-color: red; } #content { float: left; height: 800px; width: 760px; background-color: yellow; } #kamaleiText { float: left; } #kamaleiLogo { float: left; padding-top: 30px; background-color: green; z-index: inherit; } #kamaleiLeaves { float: right; z-index: -2; background-color: cyan; z-index: inherit; } And my HTML is the following: <body> <div id="outerContainer"> <div id="header"> <img id="kamaleiLogo" src="" alt="Pic1" height="98%" width="300px"/> <!-- Knowtice if I set the width to something smaller then everything is spaced out correctly, so these elements are not being shown below others when they should be --> <img id="kamaleiLeaves" src="" alt="Pic2" height="300px" width="300px"/> </div> <br/> <div id="main"> <div id="navBar"> </div> <div id="content"> abcdef </div> </div> </div> </body>

    Read the article

  • What is the best free or low-cost Java reporting library (e.g. BIRT, JasperReports, etc.) for making

    - by Max3000
    I want to print, email and write to PDF very simple reports. The reports are basically a list of items, divided in various sections/columns. The sections are not necessarily identical. Think newspaper. I just wasted a solid 2 days of work trying to make this kind of reports using JasperReports. I find that Jasper is great for outputing "normalized" data. The kind that would come out of a database for instance, each row neatly describing an item and each item printed on a line. I'm simplifying a bit but that's the idea. However, given what I want to do I always ended up completely lost. Data not being displayed for no apparent reason, columns of texts never the correct size, column positioning always ending up incorrect, pagination not sanely possible (I was never able to figure it out; the FAQ gives an obscure workaround), etc. I came to the conclusion that Jasper is really not built to make the kind of reports I want. Am I missing something? I'm ready to pay for a tool, as long as the price is reasonable. By reasonable I mean a few $100s. Thanks. EDIT: To answer cetus, here is more information about the report I made in Jasper. What I want is something like this: text text text text ------------------- text | text text |---------- text | text text | text --------| text text |---------- text | text What I made in jasper is this: (detail band) subreport | subreport ------------------------------------ subreport | subreport ------------------------------------ subreport | subreport The subreports are all the same actual report. This report has one field (called "field") and basically just prints this field in a detail band. Hence, running a single subreport simply lists all items from the datasource. The datasource itself is a simple custom JRDatasource containing a collection of strings in the field "field". The datasource iterates over the collection until there are no more strings. Each subreport has its own datasource. I tried many different variations of the above, with all sorts of different properties for the report, subreports, etc. IMO, this is fairly simple stuff. However, the problems I encounter are as follows: Subreports starting from the 3rd don't show up when their position type is 'float'. They do show up when they have 'fix relative to top'. However, I don't want to do this because the first two subreports can be of any length. I can't make each subreport to stretch according to its own length. Instead, they either don't stretch at all (which is not desirable because they have different lenghts) or they stretch according to the longest subreport. This makes a weird layout for sure. Pagination doesn't happen. If some subreports fall outside the page, they simple don't show. One alternative is to increase the 'page height' considerably and the 'detail band height' accordingly. However, in this case it is not really possibly to know the total height in advance. So I'm stuck with calculating/guessing it myself, before the report is even generated. More importantly, long reports end up on one page and this is not acceptable (the printout text is too small, it's ugly/non-professional to have different reports with different PDF page lengths, etc.). BTW, I used iReport so it's possibly limitations of iReport I'm listing here and not of Jasper itself. That's one of the things I'm trying to find out asking this question here. One alternative would be to generate the jrxml myself with just static text but I'm afraid I'll encounter the very same limitations. Anyway, I just generally wasted so much time getting anything done with Jasper that I can't help thinking its not the right tool for the job. (Not to say that Jasper doesn't excel in what it's good at).

    Read the article

  • Javascript/Jquery Super Scrollorama Navigation Issues

    - by Rosencruez
    On a Wordpress site I am currently working on, my client wanted the different sections of the front page to slide up from the bottom and cover up the previous section, like a wipe or slide transition. Using super scrollorama found here: http://johnpolacek.github.com/superscrollorama/, I managed to achieve the desired result. Next, I needed to create a navigation menu on the front page only. I did so, and set anchors at various different points on the pages. I also used the scrollTo library for scolling animations when I click the nav menu links. However, there are a number of problems I have encountered: When at the top and I click "showcase", it brings me down to the showcase section, but the products section (the div right after it) is overlapping it. Other divs seems to have the same problem of the following divs overlapping the current one I can only navigate forwards. When I try to go backwards, it won't (except for "Home") I thought it might have something to do with the CSS "top" property of the divs, so I tried resetting them every time the click function kicked in, but it didn't work. So I removed it for the time being. Currently set the javascript to prevent the default action of scrolling to the anchors and instead setting it to scroll to the actual divs themselves. However, I'm still having the same issues. Here is the site I am currently working on: http://breathe.simalam.ca/ Here is the javascript for the scrolling: $(document).ready(function() { jQuery('.home-link').click(function(e){ e.preventDefault(); jQuery(window).scrollTo(0, 1000, {queue:true}); }); jQuery('.showcase-link').click(function(e){ e.preventDefault(); jQuery(window).scrollTo('#showcase_content', 1000, {queue:true}); }); jQuery('.products-link').click(function(e){ e.preventDefault(); jQuery(window).scrollTo('#products_content', 1000, {queue:true}); }); jQuery('.about-link').click(function(e){ e.preventDefault(); jQuery(window).scrollTo('#about_content', 1000, {queue:true}); }); jQuery('.locator-link').click(function(e){ e.preventDefault(); jQuery(window).scrollTo('#locator_content', 1000, {queue:true}); }); jQuery('.contact-link').click(function(e){ e.preventDefault(); jQuery(window).scrollTo('#contact_content', 1000, {queue:true}); }); }); scrollorama code: $(document).ready(function() { $('#wrapper').css('display','block'); var controller = $.superscrollorama(); var pinDur = 4000; /* set duration of pin scroll in pixels */ // create animation timeline for pinned element var pinAnimations = new TimelineLite(); pinAnimations .append([ TweenMax.to($('#showcase'), .5, {css:{top:0}}) ], .5) .append([ TweenMax.to($('#products'), .5, {css:{top:0}}) ], .5) .append([ TweenMax.to($('#about'), .5, {css:{top:0}}) ], .5) .append([ TweenMax.to($('#locator'), .5, {css:{top:0}}) ], .5) .append([ TweenMax.to($('#contact'), .5, {css:{top:0}}) ], .5) .append(TweenMax.to($('#pin-frame-unpin'), .5, {css:{top:'100px'}})); controller.pin($('#examples-pin'), pinDur, { anim:pinAnimations, onPin: function() { $('#examples-pin').css('height','100%'); }, onUnpin: function() { $('#examples-pin').css('height','2000px'); } }); }); All of the section divs are inside a parent div. The section divs all have a height, width, and top of 100%. The parent div containing all of these section divs are as follows: #examples-pin { position: relative; /* relative positioning for transitions to work? */ width: 101%; /* max width */ height: 2000px; /* height of 2000px for now */ overflow: hidden; /* hide the overflow for transitions to work */ margin-bottom: -200px; /* negative bottom margin */ }

    Read the article

  • Why isn't the inline element inheriting height from its children?

    - by jbarz
    I'm trying to make a rather complicated grid of images and information (almost like Pinterest). Specifically, I'm trying to inline position one set of <ul>s right after another. I have it working but one aspect is causing issues so I'm trying to ask about this small piece to avoid the complication of the whole problem. In order to horizontally align the images and their information we are using inline <li>s with other inline-block level elements inside of them. Everything works correctly for the most part except that the <li>s have almost no height. HTML and CSS is in JSFiddle here if you want to mess with it in addition to below: HTML: <div> <ul class="Container"> <li> <span class="Item"> <a href="#"><img src="http://jsfiddle.net/img/logo.png"/></a> <span class="Info"> <a href="#">Title One</a> <span class="Details">One Point One</span> </span> </span> </li> <li> <span class="Item"> <a href="#"><img src="http://jsfiddle.net/img/logo.png"/></a> <span class="Info"> <a href="#">Title Two</a> <span class="Details">Two Point One</span> </span> </span> </li> </ul> CSS: .Container { list-style-type:none; } .Container li { background-color:grey; display:inline; text-align:center; } .Container li .Item { border:solid 2px #ccc; display:inline-block; min-height:50px; vertical-align:top; width:170px; } .Container li .Item .Info { display:inline-block; } .Container li .Item .Info a { display:inline-block; width:160px; } If you check out the result in the jsfiddle link you can see that the grey background only encompasses a small strip of the whole <li>. I know that changing the <li> to display:inline-block solves this problem but that isn't feasible for other reasons. So first of all, I'm just looking to see if anyone understands why the inline <li> element doesn't have any height. I can't find anything in the spec that explains this. I know I can't add height to an inline element but any explanation as to why this is happening that might enable me to fix would be great. Secondly, if you inspect the elements using IE's Developer Mode you will see that although the background color is in the correct location, the actual location of the <li>'s bounding box is at the bottom of the container according to hovering over the element. I could deal with this problem if it was at the top in every browser but it apparently varies. NOTE: I don't really care about older browsers in this case but I don't use HTML5 or JavaScript positioning. Thanks.

    Read the article

  • Combining mousedown and mousemove events together with Javascript (JQUERY?)

    - by webzide
    Dear experts, I would like to combine a the mousedown and mousemove and mouseup events together. Basically the application of this would be making a UI for selecting elements. Like selecting icons in windows when the mouse is clicked down and as you move it, a dotted border dynamically moves with it. I know this is possible with the predefined UI of Jquery. But I am building a web application that requires the integration of this and would like to know the technique. I spend hours on this and it just doesn't work. here's is the code i have so far and the logic behind it: $(document).bind('mousedown', function (evt) { evt = (evt) ? evt : event; startX = evt.clientX; startY = evt.clientY; div = document.createElement("div"); div.style.position = "absolute"; div.style.left = startX + "px"; div.style.top = startY + "px"; div.style.border = "1px dotted #DDDDDD"; $(document).bind('mousemove', function(evt){ evt=(evt) ? evt: event; alert("TESTING OF THIS WORKS"); }); }); $(document).bind('mouseup',function(evt) { var evt = (evt) ? evt : event; var endX = evt.clientX; var endY = evt.clientY; difX = (endX - startX); difY = (endY - startY) if ((difX || difY) > 0) { div.style.width = difX + "px"; div.style.height = difY + "px"; document.body.appendChild(div); } $(this).unbind('mousemove'); }); As you can see I have placed an event binding of mousemove into the event function of mousedown so that it can only be invoked when the mouse is down. but the problem is, once that event is binded, it does not come off. The borders does not move dynamically as expected. Maybe my logic is entirely messed up. If anyone could point me the the right direction that would be great. THanks in advance.

    Read the article

  • Truncate text to fit table cell without wrapping using css or jquery

    - by Tauren
    I want the text in one of the columns of a table to not wrap, but to just truncate so that it fits within the current size of the table cell. I don't want the table cell to change size, as I need the table to be exactly 100% the width of the container. This is because the table with 100% width is inside of a positioned div with overflow: auto (it's actually inside of a jquery UI.Layout panel). I tried both overflow: hidden and the text still wrapped. I tried white-space: nowrap, but it stretched the table wider than 100% and added a horizontal scroll bar. div.container { position: absolute; overflow: auto; /* user can slide resize bars to change the width & height */ width: 600px; height: 300px; } table { width: 100% } td.nowrap { overflow: hidden; white-space: nowrap; } <div class="container"> <table> <tr> <td>From</td> <td>Subject</td> <td>Date</td> </tr> <tr> <td>Bob Smith</td> <td class="nowrap"> <strong>Message subject</strong> <span>This is a preview of the message body and could be long.</span> </td> <td>2010-03-30 02:18AM</td> </tr> </table> </div> Is there a way using css to solve this? If I had a fixed table cell size, then overflow:hidden would truncate anything that flows over, but I can't used a fixed size as I want the table to stretch with the UI.Layout panel size. If not, then how would I solve this with jquery? My use case is similar to the gmail interface, where an email subject is bolded and the beginning of the message body is shown, but then truncated to fit.

    Read the article

  • Facebook Connect icon isn't showing up in Internet Explorer

    - by John Duff
    I'm working on a site that is using Facebook Connect and recently made some changes so that the main pages are cached and if you are not logged in (checked with an ajax call) it loads the Facebook Connect javascript and renders the connect button into the page. This works perfectly everywhere except Internet Explorer 7 and 8. The weird part is I render the buttons into a hidden Sign Up / Sign In form and when you show either of those the Connect buttons appear. You can take a look here and you will see the button in Firefox and not Internet Explorer. If you click Sign In the button will show up. This is a Rails app so on the server-side we're responding to an ajax call with rjs like this: page['signin-status'].replace(:partial => "common/layout/signin_menu") page.select('.facebook-connect').each do |value, index| value.replace(render(:partial => '/facebook/signin')) end page << <<-eos LazyLoader.load('http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php', function(){ FB.init('#{Facebooker.api_key}','/xd_receiver.html'); }); eos The first line is replacing the header, the second is the Connect buttons in the Modal dialogs. The partial being rendered into the header looks like this: <span id='signin-status'> <%= fb_login_button(remote_function(:url => "/facebook/connect"))%> | <%= link_to_function "Sign In", "showSignInForm();", :id => "signin" %> | <%= link_to_function "Sign Up", "showSignUpForm();", :id => "signup" %> </span> The Partial being rendered into the Modal dialogs looks like this: <div class='facebook-connect'> <div id="FB_HiddenContainer" style="position:absolute; top:-10000px; width:0px; height:0px;" ></div> <label>Or sign in with your Facebook account</label> <%= fb_login_button(remote_function(:url => "/facebook/connect"))%> </div> I find it very strange that showing the Modal dialog causes all the icons to show. Does anyone have any ideas or suggestions about what's going on?

    Read the article

  • Facebook Javascript SDK's FB.ui Bug in IE8

    - by Lukas
    hi everyone i have found a bug in IE8 using the new Facebook Javascript SDK. i call a Post dialog using: FB.ui( { method: 'stream.publish', display: 'dialog', message: 'test', attachment: { name: 'test', caption: 'test', media: [ {type: 'image', src: site_url+'test.jpg', href: site_url} ], description: ( 'test' ), href: site_url } }, my html structure is: <body> <div id="content"></div> <script type="text/javascript"> var params = { wmode: 'opaque', allowScriptAccess: 'always', quality: 'high', allowFullScreen: "true" }; var attributes = { id: 'test' }; swfobject.embedSWF("frontend/swf/stage.swf", "content", "100%", "100%", "10", params, attributes); var site_url = 'http://test.com'; </script> <div id="fb-root"></div> <script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script> <div id="like-dialog" style="display:none;"> <div id="like-dialog-wrapper"> <div id="like-dialog-close"></div> <iframe src="http://www.facebook.com/plugins/likebox.php?id=99999999999&amp;width=292&amp;connections=0&amp;stream=true&amp;header=false&amp;height=395" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:395px;"></iframe> </div> </div> </body> the css: html, #content, body { margin: 0; height: 100%; overflow: hidden; } #content { z-index: 1; } what i do is: i embed my stage i call the FB.init function and then call FB.ui function to overlay my flash. it works in every common browser except IE8. in IE8 the div containing the iframe is behind the div where i embed flash, although i set the z-index and position the dialog absolute. any ideas? thanks in advance

    Read the article

  • How to change Jquery UI Slider handle

    - by Tom
    I want to modify the stock JQuery UI slider so that the handle has a arrow on it rather than being a square. i.e. I want to use a custom image as the handle. There are a few tutorials that do it: http://jqueryfordesigners.com/slider-gallery/ http://www.ryancoughlin.com/2008/11/04/using-the-jquery-ui-slider/ http://www.keepthewebweird.com/creating-a-nice-slider-with-jquery-ui/ But I can't get it to work. The following code results in a stationary handle image: <!DOCTYPE html> <html> <head> <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" /> <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script> <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.slider.js"></script> <style type="text/css"> #myhandle {position: absolute;z-index: 100;height: 25px;width: 35px;top: auto;background: url(http://stackoverflow.com/content/img/so/vote-arrow-down.png) no-repeat;} </style> <script type="text/javascript"> $(document).ready(function(){ $("#slider").slider({handle: '#myhandle'}); }); </script> </head> <body> <div id="slider"><div id="myhandle"></div></div> </body> </html> It is as if JQuery doesn't pick up that I want to use the myhandle id for the handle. I'm wondering: Do I need a plugin for JQuery to recognise the handle option? (it is not documented in http://docs.jquery.com/UI/Slider). Or perhaps it only worked in an old version of JQuery? Any ideas?

    Read the article

  • Attaching .swf assets to Flex3 by calling getDefinitionByName()

    - by Alexander Farber
    Hello! Does anybody please know, how could you attach symbols from an .swf file in the Actionscript part of your Flex3 file? I've prepared a simple test case demonstrating my problem. Everything works (there are icons at the 4 buttons, there is a red circle) - except the getDefinitionByName() part. My target is to attach a symbol from library "dynamically" - i.e. depending at the value of the suit variable at the runtime. Thank you, Alex Symbols.as: package { public class Symbols { [Embed('../assets/symbols.swf', symbol='spades')] public static const SPADES:Class; [Embed('../assets/symbols.swf', symbol='clubs')] public static const CLUBS:Class; [Embed('../assets/symbols.swf', symbol='diamonds')] public static const DIAMONDS:Class; [Embed('../assets/symbols.swf', symbol='hearts')] public static const HEARTS:Class; } } TestCase.mxml: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onCreationComplete();"> <mx:Script> <![CDATA[ private function onCreationComplete():void { var sprite:Sprite = new Sprite(); var g:Graphics = sprite.graphics; g.lineStyle(1, 0xFF0000); g.beginFill(0xFF0000); g.drawCircle(100, 100, 20); g.endFill(); spriteHolder.addChild(sprite); // XXX stuff below not working, can it be fixed? var suit:String = "SPADES"; var mc:MovieClip = new (getDefinitionByName("Symbols.SPADES") as Class); spriteHolder.addChild(mc); } ]]> </mx:Script> <mx:VBox width="100%"> <mx:Button label="1" icon="{Symbols.SPADES}" /> <mx:Button label="2" icon="{Symbols.CLUBS}" /> <mx:Button label="3" icon="{Symbols.DIAMONDS}" /> <mx:Button label="4" icon="{Symbols.HEARTS}" /> <mx:UIComponent id="spriteHolder" width="200" height="200"/> </mx:VBox> </mx:Application>

    Read the article

  • Iterating through a directory with Ant

    - by Shaggy Frog
    Let's say I have a collection of PDF files with the following paths: /some/path/pdfs/birds/duck.pdf /some/path/pdfs/birds/goose.pdf /some/path/pdfs/insects/fly.pdf /some/path/pdfs/insects/mosquito.pdf What I'd like to do is generate thumbnails for each PDF that respect the relative path structure, and output to another location, i.e.: /another/path/thumbnails/birds/duck.png /another/path/thumbnails/birds/goose.png /another/path/thumbnails/insects/fly.png /another/path/thumbnails/insects/mosquito.png I'd like this to be done in Ant. Assume I'm going to use Ghostscript on the command line and I've already worked out the call to GS: <exec executable="${ghostscript.executable.name}"> <arg value="-q"/> <arg value="-r72"/> <arg value="-sDEVICE=png16m"/> <arg value="-sOutputFile=${thumbnail.image.path}"/> <arg value="${input.pdf.path}"/> </exec> So what I need to do is work out the correct values for ${thumbnail.image.path} and ${input.pdf.path} while traversing the PDF input directory. I have access to ant-contrib (just installed the "latest", which is 1.0b3) and I'm using Ant 1.8.0. I think I can make something work using the <for> task, <fileset>s and <mapper>s, but I am having trouble putting it all together. I tried something like: <for param="file"> <path> <fileset dir="${some.dir.path}/pdfs"> <include name="**/*.pdf"/> </fileset> </path> <sequential> <echo message="@{file}"/> </sequential> </for> But unfortunately the @{file} property is an absolute path, and I can't find any simple way of decomposing it into the relative components. If I can only do this using a custom task, I guess I could write one, but I'm hoping I can just plug together existing components.

    Read the article

< Previous Page | 91 92 93 94 95 96 97 98 99 100 101 102  | Next Page >