Announcement

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

    Help with HTMLPane PDF display [SC 7.0 Beta]

    Hi,

    First of all I would like to wish everyone in Isomorphic and in the forum a merry christmas and a very happy new year. Hope you guys wil still find some time to attend to the forums in this holiday season :-)

    Now to my problem. I have built a standard application layout with VLayout, HLayout and SectionStacks. Now I have found some problems when loading a HTMLPane within a section stack with PDF files. We work with PDF a lot and I hope you will be able to help with these problems. I have attached a sample code that runs on smartclient explorer and able to reproduce the problems listed here. If I have erred on my part, do point me in the right direction. Thank you.

    On Safari & Google Chrome:
    1. The PDF file does not load to the proper sizes.
    2. Popping up a dialog box will cause it to be hidden by the PDF. (PDF on top of the dialog box)
    3. similarly dragging the section title pane down to reduce the HTMLPane size will also have portion of it overlapped by the PDF.

    On internet explorer:
    1. After setting the PDF, popping up a dialog box will have the dialog box window frame hidden by the PDF.
    2. Unable to resize (reducing) the section pane ifcontains a PDF file.

    On firefox we have basically the same problem [2] with the hidden bar but firefox is still able to do resizing correctly.

    Run the sample code and then press on the "Set PDF" button on the top left "Menu 1" section. The bottom right pane will load the "Getting Started Guide" from your website. Then click on the "Pop up dialog" button on menu 1 to see the what I mean. Finally place with the resizing of section stack section title pane.

    regards,
    Devon


    Code:
    isc.HTMLFlow.create({
        ID: "htmlFlow",
        overflow: "auto",
        padding:10,
        contents: "<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."
    });
    
    isc.SectionStack.create({
    	   ID: "leftPane",
    		autoDraw: false,
    	   height: "100%",
    	   width: "30%",
    	   sections: [
    	      {title: "Menu 1", canCollapse: true, expanded: true, items: [
    						isc.Button.create({
    						    title: "Set to PDF", width: "100%",
    						    click: "pdfPane.setContentsURL('http://www.smartclient.com/devcenter/isomorphicSDK/docs/SmartClient_Quick_Start_Guide.pdf')"
    						}),
    						isc.Button.create({
    						    title: "Pop up dialog", width: "100%",
    						    click: "isc.ask('testing with a very logn text <br> to see the effects<br><br><br><br>OKOKOKOK');"
    						})
    	      ]},
            {title: "Yellow Piece", canCollapse: true, expanded: true, items: [
                isc.Img.create({autoDraw: false, width: 48, height: 48, src: "pieces/48/piece_yellow.png"})
            ]}
    	      
    	   ]
    });
    
    isc.VLayout.create({
    	ID: "rightPane",
    	autoDraw: false,
      height: "100%",
      members: [
    		isc.SectionStack.create({
    		    ID: "sectionStack",
    		    visibilityMode: "multiple",
    		    width: "100%", height: "100%", autoDraw: false,
    		    border:"1px solid blue",
    		    sections: [
    		        {title: "HTMLFlow", expanded: true, canCollapse: true, items: [ htmlFlow ]},
    		        {title: "Green Cube", canCollapse: true, expanded: true, items: [
    		            isc.HTMLPane.create({
    		            	  ID: "pdfPane",
    		            	  autoDraw: false,
    								    width: "100%",height: "65%", showEdges:true,
    								    contents: "<HTML><BODY></BODY></HTML>",
    								    contentsType:"page",
    								    overflow: "auto"
    								})
    		        ]}
    		    ]
    		})
    ]
    });
    
    isc.VLayout.create({
    	  ID: "mainLayout",
    	  width: "100%", height: "100%",
    	  members:[
    	  	isc.Label.create({ autoDraw: false, width: "100%", height: 16, contents: "Welcome", align: "center" }),
    	  	isc.HLayout.create({
    	  		autoDraw: false,
    	  		members:[
    	  			leftPane, rightPane
    	  		]
    	  	}),
    	  	isc.Label.create({ autoDraw: false, width: "100%", height: 16, contents: "Status Bar Information"})
    	  ]
    });

    #2
    This is a problem with most embedded objects, you can't float HTML over them.

    One way round this would be to hide the PDF before showing the popup.

    Comment


      #3
      NickC is correct..

      As far as the resizing problem, set overflow:"hidden" to make the HTMLFlow resizeable.

      Comment

      Working...
      X