My Project has been using selenium to run it frontend regression tests for quite a while now. Due to a shift in Dev tools, an area of the screen that was using jquery to display some front-end stuff, has now shifted to using canvas element (HTML5?). This is causing me a bit of a headache as I have no idea how to go about testing something in selenium c# that has no tags, XPaths or identifiable factors with which to interact in the usual way.
The canvas effectively creates an entire hierarchy tree of different boxes, which depending on the text in the box, changes size and location(X and Y).
What is 'recommended' best way of interacting with a canvas element?
Talk to the dev team and have them write/expose the APIs that you need to do the desired testing. You can then call them using JS in your script.
My company converted a personalization page from Flash to HTML5 canvas a couple years ago and this is what I did and it's worked out fine. I generally use the UI like a user would to set up the scenario and then call the internal APIs to query the CANVAS on if an image was added, if the text displayed is correctly, etc.
Situation:
I'm currently working on a project that requires collision detection with complex shapes:
.
Now the shape as a whole (The black outline) is displayed to the user as a regular image (Using Graphics.DrawImage). The image is broken down into distinct disjoint parts saved and drawn using GraphicsPath. The user clicks on the section, and if the area is clicked then the path is filled in.
Problem:
My problem is that on average there is 338 sections for the image.
Example saved data for GraphicsPath for one section:
1:41,1:42,1:43,1:44,1:45,1:46,2:46,3:47,4:47,5:48,6:48,7:48,8:48,9:48,10:48,11:49,12:48,13:48,14:48,15:48,16:48,17:48,18:48,19:48,20:47,21:47,22:47,23:47,24:46,25:46,26:45,27:45,28:44,29:44,30:43,31:43,32:43,33:43,34:43,35:42,36:42,37:43,38:43,39:43,40:43,41:44,42:44,43:44,44:45,45:46,46:46,47:47,48:48,49:48,50:48,51:48,52:48,53:48,53:47,54:47,54:46,54:45,54:44,54:43,54:42,54:41,53:40,53:39,52:38,52:37,52:36,51:35,51:34,50:33,50:32,50:31,50:30,50:29,50:28,50:27,50:26,50:25,50:24,50:23,50:22,51:21,51:20,51:19,51:18,51:17,51:16,50:15,50:14,50:13,50:12,50:11,50:10,50:9,50:8,49:7,49:6,49:5,49:4,48:3,48:2,48:1,47:1,46:1,45:1,44:1,43:1,42:1,41:1,40:1,39:1,38:1,37:1,36:1,35:1,34:1,33:1,32:1,31:1,30:1,29:1,28:2,27:2,26:2,25:2,24:2,23:3,22:3,21:3,20:4,19:4,18:5,17:5,16:6,15:6,15:7,14:7,13:8,12:9,11:10,10:11,10:12,9:13,8:14,8:15,7:16,7:17,7:18,6:19,6:20,6:21,5:22,5:23,5:24,4:25,4:26,4:27,4:28,4:29,3:30,3:31,3:32,3:33,3:34,2:35,2:36,2:37,2:38,2:39,
which is a whole lot of data to save and load into GraphicsPath and then eventually drawn.
Format x:y,...
My question:
Now here is the question, which is really open and I do apologize for. But is there a more elegant solution to this problem? A more simplified version? My supervisor is not thrilled with the solution I've come up with and has instructed me to search for a better one. We're open to using new technology that is compatible with dot net 3.5
Thank-you everyone.
I ended up going with a manual solution. My solution requires the user to define the points. More points = smooth. Less points = more polygon like.
I need to zoom in and out of a picture, grab it and browse different parts of it as you would a map, and set pushpins as markers to remind me of locations I found interesting. Essentially I want to perform similar functionality that bing (or google) maps provides but on a picture I have. From this tutorial : http://www.microsoft.com/web/post/using-the-bing-maps-api
I have tried swapping the source to point to the picture on my local drive but that don't work. What would be a good language / approach to take/use in solving this issue? I was trying to do this in C# first but now need to do this for a web application, please advise; newbie to Web development btw...
I am not able to understand why are you trying to view Picture as Map; zooming, clicking, dragging. But however, try to use jQuery for this.
The API that you are using, would work for Bing Maps. Its their server API and I don't think you can use that for any other work. But you can still re-write it and compile it to work for you.
The basic code or what you can say, the basic events for it would be .click() .dblclick() then you can use jQuery Draggable. These would be the basics only.
However if you are working with image. You would definitely need some other tools that would be able to let you work with Images, try SilverLight.
You mentioned Google Maps, Bing Maps, I need to clarify they use huge amount of JavaScript. To check where click was made, what is its location, where to zoom in where to zoom out. If it was me, I would have first tried to learn jQuery and JavaScript. To learn what are events, how they are used, and how I can use them in my project.
jQuery zoom is nothing or should I say, there is no such thing as a Zoom for any object in jQuery API. But this is a great site that I just found right now I hope it would be a kick start for you jQuery Zoom jacklmoore.com. For this site, you might need some plugin from the person, link is provided on that page! Go an have a look. :)
Again: Try to learn the basics first. You never know when the very basic event is needed and you are trying to use the expert level one. I hope it helps! :) Comment for any question or any objection.
Cheers.
I have a C# application that has an existing WinForm that I now need to display upside down.
The application will be displayed on a touchscreen Windows 7 device. If two people are using the device, one person is viewing it right-side-up while another user will be simultaneously viewing it upside-down. I will need to have one control displayed right-side-up while another control is displayed upside-down, each duplicate forms. Both need to be functional. It is not necessary for the title bar and Windows close, maximize, and minimize to be rotated.
Is there a way to easily rotate this Form and all of its contents without having to rewrite it from scratch?
Unfortunately, rotating controls is not directly possible in WinForms.
At least, not if you want them to retain their functionality. It would be relatively simple to draw the control into a bitmap, rotate the bitmap, and then draw that back to the desired location on the form. But you would obviously lose the ability to interact with the controls. They would just be static representatives of their original selves.
But making functional upside-down controls just isn't going to happen. I mean, you could try to write a bunch of custom drawing code for owner-drawn controls, but you'll still run into a bunch of bugs, corner cases, and compatibility problems. The Win32 controls that WinForms is based on just don't support this. No big surprise, really, considering they were invented some 20–25 years before anyone thought of computer screens that you could carry around in your pocket and rotate in any direction. There is a good reason that UI technologies like WPF came out around the time that touch screens and tablets did.
There are some possibilities that can be explored when it comes to flipping the entire screen, but that's not going to help when you want different controls going different directions. (And I guess it betrays my vantage point as a desktop app guy when I say this, but that just sounds like an incredibly confusing UI.)
If you absolutely have to have this, someone else is going to have to give you another route to hack it, perhaps along the lines of Dhawalk's comment: hosting the WinForms control inside of a WPF app that does provide built-in support for rotated controls. I don't know enough about this to make any concrete suggestions down that path. From a few minutes of searching, it appears that WindowsFormsHost does not actually support rotation transforms, so this may be a non-starter anyway.
I am writing a WPF application using Csharp. Its a touch application that has four browser windows displayed. Two upside down. The screen will be built into a table and lie flat. Four people will use the table - two on one side and two on the other. Thus the need for the upside down (or 180 degree rotation) browsers. I have tried using SilverLight and its Browser Brush. This works to display the browser content upside down BUT to interact with the browser you have to make the browser control active (instead of the Brush) and this turns the content back the right way up. I guess what I need is a Browser control that can be rotated in the normal way and work rotated. IE in Dot Net wont work.
Sascha Barber and Chris Cavanagh have blog posts about an alternative WebBrowser Control based on Chromium that behaves like a real WPF control. Check out http://sachabarber.net/?p=597 and http://chriscavanagh.wordpress.com/2009/08/25/a-real-wpf-webbrowser/
If it is WPF application you can use a simple RotateTransform to rotate controls any degree you want. So upside down should be no problem.
Sample/Tutorial