User Tools

Site Tools


exhibit

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
exhibit [2011/09/06 11:53] – [PRESENTATION] skipidarexhibit [2020/12/27 20:35] (current) – external edit 127.0.0.1
Line 1: Line 1:
 +===== Exhibit =====
 +
 +// An [[http://www.simile-widgets.org/exhibit/|MIT Framework]] to present data quickly, by using JS //
 +
 +Information about it:
 +  * [[http://simile-widgets.org/wiki/Getting_Started_with_Exhibit#Supporting_Filtering_and_Sorting | Here]] is a basic howto.
 +  * [[http://www.simile-widgets.org/wiki/Reference_Documentation_for_Exhibit|Here]] is a Reference - an API to every EXHIBIT View
 +  * [[http://www.simile-widgets.org/wiki/HowTo_Articles|Here]] is a set of howto articles
 +  * [[http://code.google.com/p/simile-widgets/w/list|Here]] is the Sourcecode on Google Code
 +
 +[[ http://groups.google.com/group/simile-widgets/?pli=1|Help ]] can be requested at the simile widgets google group.
 +
 +==== PRESENTATION ====
 +
 +===Collection===
 +Placing a [[http://www.simile-widgets.org/wiki/Exhibit/Collections |collection]] div **somewhere**, e.g under the <body> - forces EXHIBIT to display only the entries (from the JSON file) of the type Author. 
 +Useful if there is more information in the JSON, like a list of publications.
 +<code>
 +<div ex:role="collection" ex:itemTypes="Author"></div>
 +</code>
 +
 +
 +===Facettes===
 +Filters for the data, to display only chose cathegories
 +<code>
 + <div ex:role="facet" ex:expression=".discipline" ex:facetLabel="Discipline"></div>
 + <div ex:role="facet" ex:expression=".relationship" ex:facetLabel="Relationship"></div>
 + <div ex:role="facet" ex:expression=".shared" ex:facetLabel="Shared?"></div>
 + <div ex:role="facet" ex:expression=".deceased" ex:facetLabel="Deceased?"></div>
 +</code>
 +
 +
 +
 +===Views===
 +Views represent the art of presentation, which will be used to present the data, like Tabular, Timeline etc.
 +To precisely style a View - lences should be used.
 +When additional views are inserted to the viewPanel - they will be displayed as tabs.
 +
 +TABLE:
 +<code>
 + <div ex:role="exhibit-view"
 +     ex:viewClass="Exhibit.TabularView"
 +     ex:columns=".label, .imageURL, .discipline, .nobel-year, .relationship-detail"
 +     ex:columnLabels="name, photo, discipline, year, relationship with MIT"
 +     ex:columnFormats="list, image, list, list, list"
 +     ex:sortColumn="3"
 +     ex:sortAscending="false">
 + </div>
 +</code>
 +
 +TIMELINE:
 +For timeline View additional JS FIle must be inserted:
 +<code>
 + <script src="http://api.simile-widgets.org/exhibit/2.2.0/extensions/time/time-extension.js" type="text/javascript"></script>
 +</code>
 +
 +
 +<code>
 + <div ex:role="view"
 +     ex:viewClass="Timeline"
 +     ex:start=".nobel-year"
 +     ex:colorKey=".discipline">
 + </div>
 +</code>
 +
 +===Lences===
 +Is a template to format the presentation.
 +
 +API:
 +^Tag attribute ^ Explanation^
 +| ex:content=".discipline" |graps the property value of the property "discipline"|
 +| ex:src-content=".imageURL"  |graps the property value of the property "imageURL" AND generates a TAG src, with the graped value. src can be replaced by any tag|
 +| ex:if-exists=".co-winner" class="co-winners">...</div> |displays the div only, if the property value of property "co-winner" exists.|
 +| ex:content="**value**"></span> |generates a link to the current item. Linkclick creates a popup with all data about the item.|
 +| <ul ex:content="**!date**"> \\ <li ex:content="value"></li> \\ </ul> | generates a list with item-value-popup-links to items, where the the date property has the value of current-item-label |
 +
 +==== DATA ====
 +As a database a changed JSON files is used. An automatic converter is available :
 +      * use the Babel service to convert your data into Exhibit's JSON format » [[ http://simile.mit.edu/wiki/Exhibit/Creating,_Importing,_and_Managing_Data#Conversion_Using_Babel |Details]]
 +      * use an importer to convert your files into Exhibit's JSON format on-the-fly » [[http://simile.mit.edu/wiki/Exhibit/Creating,_Importing,_and_Managing_Data#Conversion_at_Load_Time|Details]]    
 +
 +Glossar:
 +^Word ^Explanation^
 +|Item | Database Entry with different properties like type,label ... |
 +|Item-property | The key name inside of the JSON container like type,label,uri ...|
 +|Item-Type | there is a special property called type.  |
 +|Item-Value | the data on the right side of : near the property |
 +
 +A singel JSON Database can contain different types of data.
 +An Example of a converted data:
 +<code>
 +{
 + "items" :      [
 + {
 + "label" :         "1988-01",
 + "type" :          "Date"
 + },
 + {
 + "label" :         "My little Knuth, Donald E.",
 + "type" :          "Author",
 + "original-name" : "Donald E. Knuth",
 + "last-name" :     "Knuth",
 + "date" :        "1988-01"
 + },
 + {
 + "label" :         "Knuth, Donald E.",
 + "type" :          "Author",
 + "original-name" : "Donald E. Knuth",
 + "last-name" :     "Knuth"
 + },
 + {
 + "pub-type" : "unpublished",
 + "uri" :      "urn:09caa715f9994e7b82e334d47a46d2fa",
 + "date" :     "1988-01",
 + "author" :   "Patashnik, Oren",
 + "month" :    "January",
 + "note" :     "The part of BibTeX\'s documentation that\'s not meant for general users",
 + "type" :     "Publication",
 + "year" :     "1988",
 + "label" :    "Designing BibTeX Styles",
 + "key" :      "btxhak"
 + },
 +</code>
 +
 +==Properties==
 +Some data entries in the JSON file can be crosslinked to another data entries, by setting its value-type in the JSON file. The property, which should be a link to another item should contain a label-value of the target.
 +
 +<code>
 +{
 +       properties: {
 +           "co-winner" : {
 +               valueType: "item"
 +           }
 +       },
 +    "items" : [
 +        {   type :                  "Nobelist",
 +            label :                 "Burton Richter",
 +            discipline :            "Physics",
 +            shared :                "yes",
 +            "last-name" :           "Richter",
 +            "nobel-year" :          "1976",
 +            relationship :          "alumni",
 +            "co-winner" :           "Samuel C.C. Ting",
 +            "relationship-detail" : "MIT S.B. 1952, Ph.D. 1956",
 +            imageURL :              "http://nobelprize.org/nobel_prizes/physics/laureates/1976/richter_thumb.jpg"
 +        },
 +        {   type :                  "Nobelist",
 +            label :                 "Samuel C.C. Ting",
 +...
 +</code>
 +
 +==Types==
 +A property value can be defined different for plural!!! E.g. property "type" can be Nobelist or Nobelists!
 +<code>
 +   {
 +       types: {
 +           "Nobelist" : {
 +               pluralLabel: "Nobelists"
 +           }
 +       },
 +       properties: {
 +</code>