Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Window borders not displayed in MSIE

    Hi all,

    I have problems with displaying my application correctly in MSIE. In firefox and in Safari everything looks okay.

    The problem is that the window borders are not displayed in MISE. Everything else looks fine, but the windows have blank borders and are missing the title bar.

    My test code looks like this, based on the demo code:

    MyLittleTest.gwt.xml:
    Code:
    <module>
      	<inherits name='com.google.gwt.user.User'/>
      	<inherits name="com.smartgwt.SmartGwt"/> 	
    	<entry-point class='com.test.MyLittleTest'/>
    </module>
    I have tried setting the user agent to ie6 in this file without any luck.

    MyLittleTest implementations looks like this, which basically is cut and paste from some of the showcase demoes:
    Code:
    public class MyLittleTest implements EntryPoint {
      public static Window createWin(String title, boolean autoSizing, int width, int height, int offsetLeft) {  
        	         Label label = new Label(  
        	                 "<b>Severity 1</b> - Critical problem<br/>System is unavailable in production or is corrupting data, and the error severely impacts the user's operations.<br/><br/>"  
        	                         + "<b>Severity 2</b> - Major problem<br/>An important function of the system is not available in production, and the user's operations are restricted.<br/><br/>"  
        	                         + "<b>Severity 3</b> - Minor problem<br/>Inability to use a function of the system occurs, but it does not seriously affect the user's operations.");  
        	         label.setWidth100();  
        	         label.setHeight100();  
        	         label.setPadding(5);  
        	         label.setValign(VerticalAlignment.TOP);  
        	   
        	         Window window = new Window();  
        	         window.setAutoSize(autoSizing);  
        	         window.setTitle(title);  
        	         window.setWidth(width);  
        	         window.setHeight(height);  
        	         window.setLeft(offsetLeft);  
        	         window.setCanDragReposition(true);  
        	         window.setCanDragResize(true);  
        	         window.addItem(label);  
        	   
        	         return window;  
        	     }  
        
        /**
         * This is the entry point method.
         */
        public void onModuleLoad() {
        	  IButton button = new IButton("Hello World");
              button.addClickHandler(new ClickHandler() {
                                                         public void onClick(ClickEvent event) {
                                                         SC.say("Hello World from SmartGWT");
                                                         }
                                                         });
              
    
        	
            Canvas canvasMain = new Canvas();  
            canvasMain.addChild(createWin("Auto-sizing window", true, 300, 190, 0));  
            canvasMain.addChild(createWin("Normal window", false, 220, 250, 320));  
            canvasMain.addChild(button);
            canvasMain.draw();  
    }    
    }
    This code displays perfectly fine in Firefox/Safari. I get two windows and a button with the standard Enterprise theme used.

    In MSIE, the windows are there, but the borders and the title bar controls are missing. The button is text only. The scrollbar is displayed okay though.
    I've tried this with MSIE 7 and MSIE 8 without any luck.

    See the attached files for screenshots.

    When I look at the loaded images in Firebug, all images needed for the border is loaded. In the DeveloperTool in MSIE, I only find the blank.gif and the scrollbar images. So for some reason, they are not loaded.

    Any ideas what I'm doing wrong? Any setting I need in MyLittleTest.gwt.xml?

    Thanks
    Rolf
    Attached Files
    Last edited by rolgon; 28 Jun 2009, 22:50.

    #2
    Are you sure you've not included custom css, or CSS from the default GWT app creator? These could be interfering.

    Comment


      #3
      I have removed all stylesheets in the HTML that loads the application without resolving the problem. So, I don't think I have any CSS's that interfers.

      Code:
      <html>
      	<body>
      		<script language="javascript" src="com.test.MyLittleTest.nocache.js"></script>
      	</body>
      </html>

      Comment


        #4
        .pngs in particular are not displaying (.gifs are fine). If you are using HTTPS, the combination of HTTPS plus container settings to explicitly disable caching trips a bug in IE that can have this effect. If so, just enable caching for images (a setting that should be on anyway).

        One more possibility would be a non-default browser- or system-wide setting to disable all ActiveX functionality, including ActiveX functionality built into the browser itself - in this case, the AlphaImageFilter used to correctly display .pngs in IE.

        Comment


          #5
          I have the same problem. PNG images are not displayed in Internet Explorer even in smartgwt showcase on smartclient.com. GIFs are OK and Mozilla works fine. I've upgraded MSIE, but it did not help. My computer is running Vista. Internet Explorer shows transparent PNGs from the other sites. The problem is only with smartgwt.

          I tested this issue on another Windows XP system with similar settings: Internet explorer 8 and Mozilla Firefox as default browser and realized that everything works perfect.

          What should I do solve this problem?

          P.S. Screenshots, provided in original posts exactly match my case.

          Comment


            #6
            If you run Fiddler, do you see the images being successfully downloaded? Perhaps a proxy is interfering.

            What are you settings for browser caching? If you revert to the defaults for the browser, does the problem go away?

            Comment


              #7
              When I use MSIE, Fiddler shows only GIF images downloading. With Firefox it shows lots of images. Resetting IE settings did not helped too.

              I do not use proxy on my computer.

              It looks like the issue specifically with smartclient/smartgwt, because everything else works perfect.

              Comment


                #8
                If the .pngs are not even downloading, you have some kind of security setting that is disabling IE filters (eg AlphaImageLoader). These are required for transparent PNGs (many sites use this approach).

                Comment


                  #9
                  I've reproduced PNG disappearing on my computer. PNG images disappear only when images are provided with CSS filter option, like:
                  Code:
                  <img src="blank.gif" width="100" height="100" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image/penguins_light.png', sizingMethod='scale')" />
                  disregarding the way style is set: using style attribute, css stylesheet or javascript.

                  When applying filter using "expression" css construct, everything works fine
                  Code:
                  <style type="text/css">
                  * html div.preview
                     {
                     width: expression(this.firstChild.width);
                     filter: expression("progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.firstChild.src + "', sizingMethod='image')");
                  
                     background: expression("transparent url(" + this.firstChild.src.replace(".png", ".gif") + ") no-repeat");
                     background: none !important;
                     }
                  
                  * html div.preview img
                     {
                     behavior: expression(this.style.visibility = "hidden");
                     }
                  </style>
                  
                  <div class="preview"><img src="image/penguins_light.png" /></div>
                  PNGs without setting AlphaImageLoader work fine too. Since transparent PNG support was added since MSIE 7, it looks like the best way is to use conditional AlphaImageLoader binding using construct such
                  Code:
                  <!--[if lte IE 6]> ... <![endif]-->
                  I did not managed to tune my IE settings to make PNGs to be always visible on my personal computer, though I am free to tune any settings. I think, using smartgwt in corporate environment with security policies may be almost impossible.

                  Comment


                    #10
                    @MasterHard whatever condition you have, it's not typical of corporate environments. As you actually using a final release of IE or some kind of release candidate? Because Microsoft put out a release candidate in which a workaround like you describe is required.

                    Note that while IE7 introduced some limited PNG support, it continues to be necessary to use IE filters to get *both* PNG alpha channel support *and* opacity effects at the same time.

                    Comment


                      #11
                      I used IE7 bundled with Vista, then upgraded it to IE 8.0.6001.18702C0.

                      Comment


                        #12
                        Any idea where the "C0" on the end of your version string comes from? If you Google it, you actually hit this thread, and some sites in Chinese - nothing else.

                        Comment


                          #13
                          Maybe C0 is locale option... (I use russian IE). This version of IE8 is available on Microsoft download site now. I just have uninstalled IE8, and downloaded and installed the newest one. It shows the same version. If you google IE 8.0.6001.18702 (without C0), you'll get lots of pages.

                          It looks like AplhaImageLoader is a messy thing. GWT team decided not to use AlphaImageLoader under IE7 and greater (http://code.google.com/p/google-web-...etail?id=3588).

                          I have no idea, how to make smartclient work on my computer :(

                          *** Addition: I just have realized, that "o" is at the end of IE version, not zero. So, correct version is IE 8.0.6001.18702co.
                          Last edited by Masterhard; 24 Oct 2009, 12:24.

                          Comment


                            #14
                            Smartgwt 2.2
                            ie- 8.0.6001.18943
                            ie - 6
                            quirks mode-
                            Tomcat server
                            SSL enabled

                            Hi, please help, I am building a smartgwt application for the enterprise, and if i can't solve this problem might be forced to switch over to some other technology.

                            None of the png images are loading, including normal smartgwt skins.

                            I have forced caching off as i read in another thread, but to no avail. I see the same alphaimageloader line in the generated code.

                            Any help will be appreciated.

                            Regards,
                            Jai

                            Comment

                            Working...
                            X