Google Maps Intergration
What is the proper JSON format for storing geo coordinates to integrate the mapview class into an exhibit web page? -Dvmorris 08:20, 9 December 2006 (EST)
- Nevermind, I just realized there is an example in this file: [1], if you do a search for 'latlng' -Dvmorris 09:24, 9 December 2006 (EST)
I've added some tutorials on maps. -User:Dfhuynh
ex:if-exists and else statements
is there a way to use else statements in conjunction with the if-exists statement? for example, I have a json file where some items have an image, and others don't, and I'd like to display a default image without adding that default image url to each empty field in the json file... -Dvmorris 07:40, 10 December 2006 (EST)
No such support at this moment... Any suggestion on how the syntax in HTML would look like?
By the way, feel free to edit other parts of the wiki as you're gaining experience over Exhibit. Content organized by one user might be more understandable to another user than by me because I'm not a user. --Dfhuynh 10:37, 10 December 2006 (EST)
- hmmm I don't really know what the syntax would look like, it could get pretty complicated real fast... at first I thought this might work
<span ex:if-exists=".imageURL"><img ex:src-content=".imageURL" /></span> <span ex:if-notexists=".imageURL><img src="path/to/image.jpg" /></span>
- but I'm not sure if that makes sense in the long-run...
- -Dvmorris 12:09, 10 December 2006 (EST)
Creating Dynamic URL's using property values
I sent this as a feature request, but I guess it might be useful here as well. I would like to use property values to form dynamic url's such as google or wikipedia search url's, similar to the way magic words work in wikipedia templates.
<a href="http://www.google.com/search?hl=en&q={{item-property}}" >google search</a>
and it would also be useful for integrating thickbox or lightbox into a page.
<a class="thickbox" rel="gallery-{{.label}}" ex:href-content=".galleryImages" >image </a>
i don't know what the syntax would be for that, but the idea is there...
-Dvmorris 07:44, 10 December 2006 (EST)
Is {{ }} used in other systems? I thought about adding something like that before but wasn't sure which syntax to adopt, and didn't have time anyway. I'm thinking, maybe something more explicit, like
<a ex:href-subcontent="http://google.com/search?q={{.property-id}}">google search</a>
Three reasons for using ex:href-subcontent
- To signal Exhibit to parse that attribute value, so that for other attribute values, you don't have to escape those {{ }}
- To avoid HTML editors and browsers from barfing over invalid attribute values before Exhibit parses the templates and strip them from the DOM
- To not bastardize HTML and keep the standard bodies happy
--Dfhuynh 10:34, 10 December 2006 (EST)
- I picked the {{ }} syntax just because mediawiki uses the brackets for templates and things like that. I'm not sure if it would get in the way of HTML standard though. I like the idea of using a different attribute like subcontent so you would have to worry about escaping anything in other sections. That way, the -subcontent could be appended to any attribute and the parser would know what to do. As long as it would accept more than one variable it would be a really amazing feature. It could be used to link to all sorts of search engines like flickr, googleblogs, wikipedia, etc...
--Dvmorris 12:16, 10 December 2006 (EST)
Done. ex:*-subcontent="... {{ }} ..." now works. Let me know how it goes for you.
--Dfhuynh 17:08, 10 December 2006 (EST)
It works really well! That was a fast change. I made some really quick links to google images, flickr, youtube, etc... and it works great. One thing that I noticed wikipedia does is it offers a magic word for the page title with regular spaces, and one that is url-encoded with %20's and whatever other special characters (click here). Most search engines don't seem to be picky when sending strings with regular spaces anyways, so i guess it's not that big of a deal, though. It could be interesting to offer a kind of on-the-fly string conversion to send out to the picky search engines.
Also, I just tried this chunk of code which references a list from the json file (.gallery), and the {{.label}} call returns null:
<span ex:content=".gallery">
<a class="thickbox" ex:rel-subcontent="gallery-{{.label}}" ex:href-content="value">
<span ex:content="index"></span>
</a>
</span>
I think it's because it's in a child node and not the root. That's not really a bug, just an observation, I guess.
--dave 19:06, 10 December 2006 (EST)
Right. Try !gallery.label instead.
--Dfhuynh 19:28, 10 December 2006 (EST)
Wow. I've never seen that syntax before. that worked. amazing. Thank you so much...
--dave 19:36, 10 December 2006 (EST)
Integrating Lightbox or Thickbox
I think this deserves its own section, but I mentioned it above. I was wondering if it's possible to store image paths as a list in JSON, like this:
"gallery" : [ "images/image1.jpg", "images/image2.jpg", "images/image3.jpg" ],
and then output a list of numbers, like 1 2 3 4 ... with <a href=""> tags that link to the images. I tried this code:
<div ex:if-exists=".gallery"><strong>Images:</strong> <a class="thickbox" rel="gallery-1" ex:href-content=".gallery" ex:content=".gallery" /> </div>
and various renditions of that, but it outputs the entire contents of the list in one href tag instead of separating them into a list like this span element would:
<div ex:if-exists=".gallery"><strong>Architect:</strong> <span ex:content=".gallery"></span></div>
-Dvmorris 10:14, 10 December 2006 (EST)
Try this
<div ex:if-exists=".gallery"><strong>Images:</strong> <span ex:content=".gallery"><img ex:src-content="value" /> </span> </div>
When an element with ex:content has children, then its children are used as the template for the values generated by the ex:content attribute.
- That worked to display all the images in a row, but I would ideally like to output a list of numbers, like 1,2,3... that link to larger versions of the images.
- On this test page, http://dave.showviz.net/hist/buildings.html , I have a link at the top that tests thickbox to make sure it's working and then i use this code on the thumbnail images to see if it works with the exhibit parser:
<a class="thickbox" ex:href-content=".imageURL" title="click to view original image" >
<img ex:src-content=".thumbnailURL" alt="click to view original image" />
</a>
and also this just to see if the ex: needed to be prepended to every attribute in an exhibit lens:
<a ex:class-content="thickbox" ex:href-content=".imageURL" ex:title-content="click to view original image" >
<img ex:src-content=".thumbnailURL" ex:alt-content="click to view original image" />
</a>
i'm not sure what the problem could be. I was trying to inspect the dom with the web developer toolbar extension for FF , but the path is way too long that deep into th document... Is there a better tool for that?
--Dvmorris 12:33, 10 December 2006 (EST)
No, ex:*-content is for dynamically generated content. For static attribute values, just use the normal HTML attribute names. So, don't use ex:class-content, ex:title-content, and ex:alt-content.
I'd recommend FireBug instead of developer toolbar.
As for numbering, try
<div ex:if-exists=".gallery"><strong>Images:</strong>
<ol ex:content=".gallery">
<li><img ex:src-content="value" /></li>
</ol>
</div>
--Dfhuynh 14:25, 10 December 2006 (EST)
I see. That sample will output an ordered list of images, but I can't figure out how to output just a numbered list of links. This code:
<div ex:if-exists=".gallery"><strong>Images:</strong>
<ol ex:content=".gallery">
<li><a ex:href-content="value">link</a></li>
</ol>
</div>
will output an ordered list of the word "link" as a hyperlink to each image, but I can't figure out how to just output the numbers as a link. I am thinking that's not possible.
also, do you know why the thickbox link at the top of my sample page (linked above) works but when i try it in a lens template it doesn't work?
--dave 14:45, 10 December 2006 (EST)
Fixed. Try
<div ex:if-exists=".gallery"><strong>Images:</strong>
<ol ex:content=".gallery">
<li><a ex:href-content="value"><span ex:content="index"></span></a></li>
</ol>
</div>
--Dfhuynh 16:30, 10 December 2006 (EST)
That works great! Sorry to keep bothering you, but is there a way to add a custom separator, like a comma or something? I don't really need to I guess, I was just curious.
The thickbox script is still not working, however. I looked using firebug, which is really amazing, thanks for the tip, and the class="thickbox" attribute is in the <a> tag, but it still won't load the image in the thickbox. Maybe the two javascript files, exhibit and thickbox, or maybe jquery, have some conflicting function names, or something like that...
--dave 18:21, 10 December 2006 (EST)
It looks like thickbox on document load hooks in onclick events for all <a> elements of class thickbox. You need to add a javascript function somewhere called, say, showThickbox:
function showThickbox(a){
var t = a.title || a.name || null;
var g = a.rel || false;
TB_show(t,a.href,g);
a.blur();
return false;
};
and then in your lens template, add an onclick handler like this:
<a class="thickbox" ex:href-content=".imageURL" title="click to view original image" onclick="return showThickbox(this);"> <img ex:src-content=".thumbnailURL" alt="click to view original image" /> </a>
--Dfhuynh 20:43, 10 December 2006 (EST)
That works perfectly. Maybe I should make a page on the wiki with all of these conversations summed up briefly so no one has to go sifting through all this text... thanks again for the help.
I'll add Exhibit/Thickbox integration first.
--dave 04:27, 11 December 2006 (EST)
Custom "permalink" page
When you include this code in a lens template:
<div ex:control="item-link"></div>
It includes a link called "link" that causes a popup div to show the default lens template, hovering over whatever is in the background. Is there a way to make this "link" more permanent, so it just shows the one item on the page by itself according to a lens template, and perhaps include a google map zoomed in on that item's location alone?
--dave 13:32, 10 December 2006 (EST)
Acceptable Date format for BC years
This was also submitted to the issue tracker, but it's probably better off here.
What is the proper format for including a date that is simply a year in BC? I tried "123 BC" which seems to be acceptable on this timeline example:
http://simile.mit.edu/timeline/examples/religions/jewish.xml
but exhibit gives an error when I click on the "timeline" button if i store a date this way.
--dave 13:38, 10 December 2006 (EST)
I've just fixed Timeline to handle negative years, e.g., "-0122-12-10" is December 10th, 123 BC". You will need to hold down Ctrl (or Shift?) and hit Refresh to bypass the browser's cache.
--Dfhuynh 15:45, 10 December 2006 (EST)
Will it also handle "123 BC", or should I just write "123 BC" as -122 ? It seemed strange that it worked on that jewish history calendar, but not on exhibit. I would like to store the dates in the BC format, just for the sake of readability, but either way will work...
--dave 17:47, 10 December 2006 (EST)
No, "123 BC" wouldn't work for Exhibit because Exhibit only understands ISO 8601 while Timeline also understands the native Javascript date format.
--Dfhuynh 18:04, 10 December 2006 (EST)
ok, that's good to know. thanks for all your help.
--dave 18:08, 10 December 2006 (EST)
i am now storing my dates in the format you suggested, and the timeline no longer gives errors, but it says only one of the following can be added to the timeline:
start-year end-year -0476-01-01 -0437-01-01 0118-01-01 0126-01-01 -3299-01-01 -2749-01-01 -2569-01-01 -2499-01-01 -2569-01-01 -2499-01-01 -2529-01-01 -2569-01-01 -2499-01-01 -2529-01-01 -2049-01-01 -1499-01-01 -1999-01-01 -1999-01-01 -1499-01-01 -1896-01-01 -1877-01-01 -1399-01-01 -1299-01-01 -1378-01-01 -1361-01-01 -1349-01-01 -1204-01-01 -1283-01-01 -1263-01-01
and it's the one that doesn't contain any negative numbers... other than that I don't see any mistakes in my formatting, assuming that the must always have a month and a day. Any ideas?
This site suggests that the proper ISO 8601 format for BCE dates would be -0019850412 to represent April 12, -1985. I haven't seen any other reference to the extra 2 zero's before, and I'm not sure if it's necessary here.
This site shows support in their implementation of ISO 8601 for an optional sign before a 4 digit date.
--dave 03:53, 12 December 2006 (EST)
Oops, I fixed the wrong code. It should work now if you Ctrl-refresh.
--Dfhuynh 11:01, 12 December 2006 (EST)
Storing a schema in a spreadsheet format
Is there a way to store a particular schema in a spreadsheet format? I am storing my data in a google spreadsheet, and when I use Babel to convert to JSON, it adds type definitions at the end, and I just delete them before saving the .js file.
I'm wondering if there is a solid way to store the schema in a spreadsheet along with the data. Even if it required two copy pastes to convert with babel, it would be nice to be able to have all the information in one place.
--dave 07:21, 11 December 2006 (EST)
Short answer is no, unfortunately.
But you can do something with the column header, like writing "author: item" and "birth: date" instead of just "author" and "birth" to assert the value types of those properties. Babel should pick up the extra info and put them in the generated schema. If not, let me know.
--Dfhuynh 11:04, 12 December 2006 (EST)
That worked great. Thanks.
--dave 13:12, 12 December 2006 (EST)
ex:if-equals ?
is there a way to implement a kind of ex:if-equals syntax? perhaps it could be
<span ex:if-equals=".status|built"><div style="border:1px solid red">content w/red border</div></span> <span ex:if-equals=".status|unbuilt"><div style="border:1px solid blue">content w/blue border</div></span> <span ex:if-equals=".status|under construction"><div style="border:1px solid green">content w/green border</div></span>
just another thought, i guess it would basically be like the row styler idea for other views without any added javascript code...
--dave 12:09, 12 December 2006 (EST)
I'm entertaining these syntaxes:
<span ex:if=".status equals 'built'">...</span>
<div ex:select=".status"> <span ex:case="built">...</span> <span ex:case="unbuilt">...</span> ... </div>
--Dfhuynh 12:35, 12 December 2006 (EST)
i like it. Is there a reason you chose "ex:select" over "ex:switch" ?
also, if i'm being a pest by asking too many questions, please let me know...
--dave 12:51, 12 December 2006 (EST)
Not at all. It's great to have real users :-)
"switch" has always been obscure to me even as a C/C++/Java programmer. "select" for some reason seems more user friendly.
ex:select is easier to implement than ex:if, I believe.
By the way, feel free to add your exhibits to the examples page.
--Dfhuynh 13:45, 12 December 2006 (EST)
Changing the link in the address bar per click
The way Picasa web albums work is an interesting example of how to keep the interface from reloading but still change the URL in the address bar.
Each image has its own url, but it loads extremely fast and only swaps out what it needs to. I assume it's much faster b/c the change in the html code is only a div with an img tag in it, but the concept seems pretty solid.
Is there a way to implement this kind of url changing scheme in exhibit?
--dave 06:27, 13 December 2006 (EST)
ex:showAll="false" with multiple views
Hi, I'm currently working with a relatively large JSON dataset (329 items) for testing purposes--(to tie it into our semantic search engine as a means of displaying search result sets)--but I'm not getting ex:showAll="false" to work for some reason.
If I use the first example from the "Getting Started" tutorial, there are no exhibit-views, and ex:showAll is presumably set to "false" by default. If I add one or more exhibit-views, like for instance this one, ex:showAll is ignored, it seems:
<div ex:role="exhibit-view"
ex:viewclass="Exhibit.TileView"
ex:showAll="false"
ex:orders=".type"
ex:possibleorders=
".label, .role, .type, .location, .start, .end">
</div>
It looks like ex:showAll="false" is ignored for some reason, and it makes working with larger datasets quite difficult. Is there some additional parameter I should set?
My example is at http://evans.ub.rug.nl:8080/peter/search.htm
Scholing 12:23, 21 March 2007 (EDT)
