Announcement

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

    getPrintHTML() of Timeline

    Hi there,

    I'm trying to call the printHtml of a Timeline.

    It seems that all events are left out of the export, even if I set the printForExport to true.


    I've tested this against every browser and the latest nightly SmartClient_v100p_2015-09-04_Pro.

    Here is the example code:
    Code:
    isc.VLayout.create({
    	"ID" : "rootLayout",
    	"width" : "100%",
    	"height" : "100%",
    	"autoDraw" : true,
    	"hideUsingDisplayNone" : false,
    	"leaveScrollbarGap" : false,
    	"members" :
    	[
    		isc.Button.create({
    			"width" : 200,
    			"click" : function () {
    				timelines0.getPrintHTML({printForExport :true},function(data){
    					timelineContent.setContents(data);
    					
    					console.log(data);
    				}); 
    			},
    			"title" : "Convert to html",
    		}),
    		isc.Timeline.create({
    			ID : "timelines0",
    			startDate : new Date(2015, 0, 1),
    			endDate : new Date(2015, 0, 15),
    			showControlsBar: false,
    			canCreateEvents: false,
    			alternateLaneStyles: true,
    			canEditEvents: false,
    			todayBackgroundColor: '#E0E0E0',
    			lanes : [{
    					name : "1",
    					title : "January",
    					height : 30
    				}
    			],
    			"data" :
    			[{
    					"lane" : "1",
    					"description" : "Important event1",
    					"startDate" : new Date(2015, 0, 2, 0, 0),
    					"backgroundColor" : "#CF0",
    					"showDate" : true,
    					"endDate" : new Date(2015, 0, 5, 23, 59),
    					"name" : "&nbsp"
    				},{
    					"lane" : "1",
    					"description" : "Important event2",
    					"startDate" : new Date(2015, 0, 7, 0, 0),
    					"backgroundColor" : "#CF0",
    					"showDate" : true,
    					"endDate" : new Date(2015, 0, 10, 23, 59),
    					"name" : "&nbsp"
    				}
    			]
    		}),
    		isc.HTMLPane.create({
    			ID : "timelineContent"
    			})
    	]
    });
    Best regards

    #2
    This has been fixed for builds dated September 6 and later.

    Comment


      #3
      Hi,
      tested with SmartClient_v100p_2015-09-07_Pro, it's working now.
      thanks for the fast repsonse

      Comment


        #4
        Hi there again,
        I'm trying to make my previous example run without visible headers and descriptions.
        Therefor the timeline events doesn't disappear anymore, but are losing their color.

        I've tested this against every browser and the latest nightly SmartClient_v100p_2015-09-07_Pro.
        Following my example code with added lines for showEventDescriptions and showEventHeaders.

        Also there seems to be a slight miss-alignment at the generated html near the begin and end of the events.

        Code:
           isc.VLayout.create({
            "ID" : "rootLayout",
            "width" : "100%",
            "height" : "100%",
            "autoDraw" : true,
            "hideUsingDisplayNone" : false,
            "leaveScrollbarGap" : false,
            "members" :
            [
                isc.Button.create({
                    "width" : 200,
                    "click" : function () {
                        timelines0.getPrintHTML({printForExport :true},function(data){
                            timelineContent.setContents(data);
                            
                            console.log(data);
                        });
                    },
                    "title" : "Convert to html",
                }),
                isc.Timeline.create({
                    ID : "timelines0",
                    startDate : new Date(2015, 0, 1),
                    endDate : new Date(2015, 0, 15),
                    showControlsBar: false,
                    canCreateEvents: false,
                    alternateLaneStyles: true,
                    canEditEvents: false,
                    todayBackgroundColor: '#E0E0E0',
                    showEventDescriptions: false,
                    showEventHeaders: false,
                    lanes : [{
                            name : "1",
                            title : "January",
                            height : 30
                        }
                    ],
                    "data" :
                    [{
                            "lane" : "1",
                            "description" : "Important event1",
                            "startDate" : new Date(2015, 0, 2, 0, 0),
                            "backgroundColor" : "#CF0",
                            "showDate" : true,
                            "endDate" : new Date(2015, 0, 5, 23, 59),
                            "name" : "&nbsp"
                        },{
                            "lane" : "1",
                            "description" : "Important event2",
                            "startDate" : new Date(2015, 0, 7, 0, 0),
                            "backgroundColor" : "#CF0",
                            "showDate" : true,
                            "endDate" : new Date(2015, 0, 10, 23, 59),
                            "name" : "&nbsp"
                        }
                    ]
                }),
                isc.HTMLPane.create({
                    ID : "timelineContent"
                    })
            ]
        });
        Best regards

        Comment


          #5
          What is it that you're trying to do by showing neither the header nor the body of the event?

          Do you just want to show rectangles of color, with no text? If so, you can fix your code by switching showEventDescriptions back on, but setting descriptionField to some non-existant fieldName, like:

          Code:
          descriptionField: "notARealField"
          That will result in no text in eventCanvases, but correct backgroundColor styling in printed output.

          Alternatively, if you set styleName instead of backgroundColor, that will also work correctly in printed output.

          If that's no good to you, or not what you meant, please clarify what it is you're trying to achieve.

          The 1 or 2px offset issue you mention, in printed output, is noted and queued to be looked at - it's cosmetic only.

          Comment


            #6
            Hi there,

            the reason for hiding the description and header is that I got too much information to show on a timeline event.
            Instead of showing the descriptions on events directly, I am adding these informations to the event hover using getEventHoverHTML method.
            Herefor your workaround with enabling showEventDescriptions and setting the descriptionField to an empty string works, but doesn't feel elegant.

            Further I have an issue when showing weekends in a designated color. Showing these in the timeline works fine by overriding getDateCSSText as follows:
            Code:
            getDateCSSText : function (date, rowNum, colNum, viewer) {
                if (colNum != 0 && (date.getDay() == 6 || date.getDay() == 0))
                    return "background-color: #AAA";
                else
                    return this.Super("getDateCSSText", arguments);
            }
            The issue appears when its about printing these differently colored days. The set color (getDateCSSText) will be ignored.

            Following my example code with added getDateCSSText method:
            Code:
            isc.VLayout.create({
                "ID" : "rootLayout",
                "width" : 1000,
                "height" : "100%",
                "autoDraw" : true,
                "hideUsingDisplayNone" : false,
                "leaveScrollbarGap" : false,
                "members" :
                [
                    isc.Button.create({
                        "width" : 200,
                        "click" : function () {
                            timelines0.getPrintHTML({
                                printForExport : true
                            }, function (data) {
                                timelineContent.setContents(data);
            
                                console.log(data);
                            });
                        },
                        "title" : "Convert to html",
                    }),
                    isc.Timeline.create({
                        ID : "timelines0",
                        startDate : new Date(2015, 0, 1),
                        endDate : new Date(2015, 0, 15),
                        showControlsBar : false,
                        canCreateEvents : false,
                        alternateLaneStyles : true,
                        canEditEvents : false,
                        todayBackgroundColor : '#E0E0E0',
                        showEventDescriptions : true,
                        showEventHeaders : false,
                        descriptionField : "",
                        lanes : [{
                                name : "1",
                                title : "January",
                                height : 30
                            }
                        ],
                        getDateCSSText : function (date, rowNum, colNum, viewer) {
                            if (colNum != 0 && (date.getDay() == 6 || date.getDay() == 0))
                                return "background-color: #AAA";
                            else
                                return this.Super("getDateCSSText", arguments);
                        },
                        "data" :
                        [{
                                "lane" : "1",
                                "description" : "Important event1",
                                "startDate" : new Date(2015, 0, 2, 0, 0),
                                "backgroundColor" : "#CF0",
                                "showDate" : true,
                                "endDate" : new Date(2015, 0, 5, 23, 59),
                                "name" : "&nbsp"
                            }, {
                                "lane" : "1",
                                "description" : "Important event2",
                                "startDate" : new Date(2015, 0, 7, 0, 0),
                                "backgroundColor" : "#CF0",
                                "showDate" : true,
                                "endDate" : new Date(2015, 0, 10, 23, 59),
                                "name" : "&nbsp"
                            }
                        ]
                    }),
                    isc.HTMLPane.create({
                        ID : "timelineContent"
                    })
                ]
            });
            Best regards

            Comment


              #7
              Ok, we've fixed both of these for builds dated September 10 and later - you can remove the descriptionField hack and set showEventDescriptions back to false once you have such a build.

              Comment


                #8
                Thanks, i will test it as soon as i can download the lates nightly.
                By the way, i have subscribed this thread, but it seems that the email-motification system is not working. I haven't got an email about your latest posts.

                Comment


                  #9
                  Yes, there are a couple of teething problems with the forums since we upgraded the software this week - we're looking into it.

                  Comment

                  Working...
                  X