First off, thanks for your hard work on this module. I've been using SIMILE widgets and the Drupal Exhibit module for a while. I'm just getting started with the Timeline module.

I'm using CCK imagefields as the event icons. However, the labels overrun the images. The labels also overun the icons of future events if one is present. It seems like the size of the icons are not taken into account when Timeline determines the placement of events and labels.

Any ides on how to fix this? if not, maybe download the Timeline source code and give a larger icon spacing to use in its calculations. I don't know. Thanks.

Comments

xamanu’s picture

You might want to have a look on the timeline themes. There you can define and change the things you desire.
You should create a new theme, based on the existing ones and simply change the values so that your icons are getting displayed properly.

diodata’s picture

Thanks for the reply. I just noticed that too last night. I seem to have something working for my case.

Of course, it seems like that should be configurable in the View options, such as next to the choice of which imagecache preset to use for the icons. I'd hate to create multiple themes that only differ by the icon size. And, obviously, I can see people wanting to create timelines that don't have access to create new themes.

Would it be hard to make those options configurable per view, such as what's done (args) in the js/timeline.js file? Is there someway to set a value and then not specify iconHeight/iconWidth in theme.js? I don't know how hard or easy that would be, but very useful.

cyberwolf’s picture

Subscribing.

Tom Kraft’s picture

I'm having a similar issue. I'm trying to use CSS to position the icon so it doesn't overlap with the text which worked. However the icons vertical height of the icons are 50 pixels. This is higher than the vertical spacing of the text and icon units, so I need to space them out so the icons don't overlap.

I've tried using img to space them out but it doesn't add space to the individual icon IMGs only to the top all IMGs. The only thing that seems to work is when I put margin on the labels. At first this seems like a fix, however when you scroll to the left, advancing the timeline, at a certain point, it snaps up and losses all the CSS vertical spacing.

Am I missing something or is this a bug? Here is my CSS:

.DarkTheme .label-timeline_nodes-set-0 {
	margin-left: 25px;
	padding-top: 20px;
	margin-bottom: 30px
	text-align: left;
	}
.DarkTheme img {
	padding-top: 50px;
}

Thanks for any advice or help.

Tom Kraft’s picture

Figured out how to fix the overlapping labels and icons. Maybe basic for some but I dug around the theme folder's theme (in this case "DarkTheme"), as mentioned above. There I modified the positions of the label and icon in the theme.js file. Under "this.event" I increased the gap and offset. Also increased the overviewTrack's offset.

Hope that helps anyone have issues with overlapping icons.

xamanu’s picture

Status: Active » Closed (won't fix)

This is an issue of the timeline theme and can be adjusted as described above. I'm not willing to implement anything further on that.