Thanks! Tried it; no changes to the issues cited. Also tried it with and without the trunk version of the timeline extension. The only thing I noticed was that in some of the CSS classes, word-wordword-word changed to word-wordWord-word.
On Thursday, March 15, 2012 1:44:47 PM UTC-6, DavidK wrote: > > I'll try to take a look at this later, but just in terms of gathering > data, can you try using > http://trunk.simile-widgets.org/exhibit/api/exhibit-api.js > which has a few bugfixes, and see if anything changes? > > > On 3/15/2012 12:09 PM, Sandra wrote: > > I'm impressed with Exhibit and Timeline, and have had a lot of fun working > with them. But it's been a real slog getting past a zillion little issues. > I've gleaned all I can from what I can find online. At this point, I'm > pretty close to being done with my Exhibit, but I still need help with a > few pressing issues. I would absolutely appreciate any help I can get on > these issues. Screen caps and code attached! > > BTW, I'm using the Tabular and Timeline views in Exhibit. I don't know > enough javascript to play around with Timeline proper. > > *ISSUES* > > *Exhibit rowStyler tabular view:* does absolutely nothing to the table. > It's all still white. Javascript console doesn't show any errors. My code > is modeled after the presidents example. With my limited knowledge of Java, > I am stumped. > > *Exhibit timeline extension colorCoder:* works except it totally ignores > one of the spans. The events with .stage="PLANNING" do not appear purple on > the timeline as I have set them up to do. They are grey, which appears > coded as "others" in the legend at the bottom of the timeline. The other > color coded events appear the correct color and correctly in the legend. > > *Exhibit timeline extension iconCoder:* does absolutely nothing. I still > get those little purple default dots on all my events. I have tried both > relative URLs and full URLs in the coder div, and I have tried putting the > icon URLs into the database itself with an 'icon' and an 'iconURL' property. > > *Exhibit timeline extension event label divs:* are fine if I don't style > them. But if I use CSS on the div.timeline-event-label class to change > font-family or font-size, the text of the event labels wraps to a second > line, which in some places makes them illegible as the event placement > appears to assume single-line labels. I can get away with skinny sans-serif > fonts like Gill Sans if I make them 12px or smaller, but that's a little > too tiny for my taste and for my web editor's. > > I've attached screen captures of the above problems in action (except > the rowStyler issue). Code at the bottom of this post. You can see a > working version of the page live at > http://sandrachung.com/exhibit/timeline3copy.html > > *What I've done* > > *API versions:* > I've tried a couple different versions of the Exhibit API and timeline > extension. With Exhibit 3.0 Scripted, my site just sits there and churns > the "working" box at me and displays no timeline or tabular view. If I'm > using the Google spreadsheet converter for my database,the console tells me > object #<object> has no method 'make *iso* 8601 date string'. > <http://www.google.com/webhp?sourceid=chrome-instant&ix=sea&ie=UTF-8&ion=1#hl=en&sa=X&ei=MwZhT9a6GeOe2wX2wf38Bw&ved=0CBgQBSgA&q=Object+%23%3CObject%3E+has+no+method+%27make+ISO+8601+Date+String%27&spell=1&bav=on.2,or.r_gc.r_pw.r_qf.,cf.osb&fp=8fc685d9ca728249&ix=sea&ion=1&biw=1408&bih=779>If > > I give it validated Exhibit JSON, it gives me a "poorly formed" error > message (I've checked for weird spaces and commas and found nothing; > JSONlint also says it's fine). These two versions seem to give me the most > consistent results with either a validated JSON file or converted Google > spreadsheet: > > <script src= > "http://api.simile-widgets.org/exhibit/2.2.0/exhibit-api.js";<http://api.simile-widgets.org/exhibit/2.2.0/exhibit-api.js>type="text/javascript"></script> > <script src= > "http://api.simile-widgets.org/exhibit/2.2.0/extensions/time/time-extension.js";<http://api.simile-widgets.org/exhibit/2.2.0/extensions/time/time-extension.js>type="text/javascript"></script> > > *Database: * > I've tried both the Google spreadsheet converter and linking to a local > JSON file. I created the local file by cutting and pasting the database > from my working version with the Google spreadsheet converter (using the > scissors icon). Validated with JSONlint. > > *Browser: * > Everything I've done I've tested in Chrome, Safari, and FF, all on a Mac, > and so far they're all giving me the exact same issues. > > *Relevant code:* > > <html> > > <head> > <title></title> > > <script src= > "http://api.simile-widgets.org/exhibit/2.2.0/exhibit-api.js";<http://api.simile-widgets.org/exhibit/2.2.0/exhibit-api.js>type="text/javascript"></script> > <script src= > "http://trunk.simile-widgets.org/exhibit/api/extensions/time/time-extension.js";<http://trunk.simile-widgets.org/exhibit/api/extensions/time/time-extension.js>type="text/javascript"></script> > > <script> > var rowStyler = function(item, database, tr) { > var stage = database.getObject(item, "stage"); > var color = "white"; > switch (stage) { > case "PRE-CONCEPT": color = "#C8BDB2"; break; > case "CONCEPT": color="#F7D2CD"; break; > case "PLANNING": color="#DECFE8"; break; > case "DESIGN": color="#CCD7EE"; break; > case "CONSTRUCTION": color="#CCE5DE"; break; > } > tr.style.background = color; > }; > </script> > > <link rel="exhibit/data" > type="application/jsonp" > href= > "https://spreadsheets.google.com/feeds/list/0AtaqlNJIHEAedFU4QkxiS1BQU0tRRThmODgyNjBaZ0E/oda/public/basic?alt=json-in-script";<https://spreadsheets.google.com/feeds/list/0AtaqlNJIHEAedFU4QkxiS1BQU0tRRThmODgyNjBaZ0E/oda/public/basic?alt=json-in-script> > ex:converter="googleSpreadsheets" /> > <link rel="stylesheet" href="stylesheet.css" type="text/css" > media=screen /> > </head> > > <body> > > <div ex:role="coder" ex:coderClass="Color" id="stage-color"> > <span ex:color="#472200">BEFORE NEON</span> > <span ex:color="#D81E05">CONCEPT</span > <span ex:color="#59118E">PLANNING</span> > <span ex:color="#0038A8">DESIGN</span> > <span ex:color="#007c59">CONSTRUCTION</span> > </div> > > <div ex:role="coder" ex:coderClass="Icon" id="dot-color"> > <span ex:icon="images/brown-button.png">BEFORE NEON</span> > <span ex:icon="images/red-button.png">CONCEPT</span> > <span > ex:icon="http://localhost:8888/exhibit/images/purple-button.png";<http://localhost:8888/exhibit/images/purple-button.png> > >PLANNING</span> > <span > ex:icon="http://localhost:8888/exhibit/images/green-button.png";<http://localhost:8888/exhibit/images/green-button.png> > >DESIGN</span> > <span > ex:icon="http://localhost:8888/exhibit/images/blue-botton.png";<http://localhost:8888/exhibit/images/blue-botton.png> > >CONSTRUCTION</span> > </div> > > <table width="100%"> > <tr valign="top"> > <td ex:role="viewPanel"> > <!--This div creates the timeline view--> > <div ex:role="view" > ex:viewClass="Timeline" > ex:label="Interactive Timeline" > ex:timelineHeight="300" > ex:topBandHeight="80" > ex:topBandUnit="month" > ex:topBandPixelsPerUnit="80" > ex:bottomBandHeight="20" > ex:bottomBandUnit="year" > ex:bottomBandPixelsPerUnit="60" > ex:start=".start" > ex:latestStart=".latestStart" > ex:earliestEnd=".earliestEnd" > ex:end=".end" > ex:isDuration=".isDuration" > ex:colorKey=".stage" > ex:colorCoder="stage-color" > ex:iconKey=".stage" > ex:colorCoder="dot-color" > ex:bubbleHeight="400" > ex:bubbleWidth="300" > ex:configuration=timelineConfig"> > <div ex:role="lens" class="timeline-bubble" > style="display:none;"> > <img ex:src-content=".imageURL" class="bubblepic" /> > <p><span ex:content=".month" class="title"></span> > <span ex:content=".year" class="title"></span> > </p> > <p ex:content=".label" class="title"></p> > <p ex:content=".description" class="description"></p> > <div ex:if-exists=".URL"><a ex:href-content=".URL" > class="bubblelink" target="_blank"> read more </a></div> > </div> > </div> > </div> > <!--This div creates the table view--> > <div ex:role="view" > ex:viewClass="Tabular" > ex:label="List of events" > > ex:columns=".year,.month,.label,.description,.shortURL" > ex:columnLabels="year, month, event, description, > link" > ex:columnFormats="list, list, list, list, url" > ex:sortAscending="false" > ex:rowStyle="rowStyler"> > </div> > </td> > </tr> > </table> > > </body> > > </html> > > > Thanks! > > -Sandra- > > -- > You received this message because you are subscribed to the Google Groups > "SIMILE Widgets" group. > To view this discussion on the web visit > https://groups.google.com/d/msg/simile-widgets/-/U5esnee5ON8J. > To post to this group, send email to simile-widgets@googlegroups.com. > To unsubscribe from this group, send email to > simile-widgets+unsubscr...@googlegroups.com. > For more options, visit this group at > http://groups.google.com/group/simile-widgets?hl=en. > > -- You received this message because you are subscribed to the Google Groups "SIMILE Widgets" group. To view this discussion on the web visit https://groups.google.com/d/msg/simile-widgets/-/fKsPU5Dw5n4J. To post to this group, send email to simile-widgets@googlegroups.com. To unsubscribe from this group, send email to simile-widgets+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/simile-widgets?hl=en.
![http://localhost:8888/exhibit/images/purple-button.png"](http://localhost:8888/exhibit/images/purple-button.png"){kind=link}
![http://localhost:8888/exhibit/images/green-button.png"](http://localhost:8888/exhibit/images/green-button.png"){kind=link}
![http://localhost:8888/exhibit/images/blue-botton.png"](http://localhost:8888/exhibit/images/blue-botton.png"){kind=link}
