app_it.html 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" version="XHTML+RDFa 1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.w3.org/1999/xhtml http://www.w3.org/MarkUp/SCHEMA/xhtml-rdfa-2.xsd" lang="it" xmlns="http://www.w3.org/1999/xhtml" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#" xmlns:xsd="http://www.w3.org/2001/XMLSchema#" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:foaf="http://xmlns.com/foaf/0.1/">
  3. <head profile="http://www.w3.org/1999/xhtml/vocab">
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1" />
  6. <title property="dc:title">LodLive - browsing the Web of Data</title>
  7. <link rel="shortcut icon" href="favicon.png" />
  8. <link rel="icon" type="image/png" href="favicon.png" />
  9. <link rel="image_src" href="http://lodlive.it/img/logoLodLive.jpg" />
  10. <meta property="og:image" content="http://lodlive.it/img/logoLodLive.jpg" />
  11. <link property="dc:creator" href="http://purl.org/net/foaf:Person/diego-valerio-camarda" />
  12. <link property="dc:creator" href="http://purl.org/net/foaf:Person/silvia-mazzini" />
  13. <link property="dc:creator" href="http://purl.org/net/foaf:Person/alessandro-antonuccio" />
  14. <link property="dc:subject" href="http://dbpedia.org/resource/Semantic_Web" />
  15. <link property="dc:subject" href="http://dbpedia.org/page/Linked_Data" />
  16. <link property="dc:subject" href="http://dbpedia.org/resource/SPARQL" />
  17. <link property="cc:licence" href="http://www.opensource.org/licenses/mit-license.php" />
  18. <meta property="og:title" content="LodLive - browsing the Web of Data" />
  19. <meta property="og:description" content="LodLive &egrave; un progetto sperimentale nato per divulgare la filosofia dei linked open data e per creare uno strumento in grado di associare le potenzialità di un browser RDF all'efficacia della rappresentazione a grafo proponendosi come primo navigatore di risorse RDF basato unicamente su endpoint SPARQL." />
  20. <meta property="dcterms:created" content="2012-04-25T13:00:00" />
  21. <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
  22. <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
  23. <script>
  24. window.jQuery || document.write('<script src="js/jquery-2.0.3.min.js"><\/script>')
  25. </script>
  26. <script type="text/javascript">
  27. var _gaq = _gaq || [];
  28. _gaq.push(['_setAccount', 'UA-1940652-20']);
  29. _gaq.push(['_setDomainName', 'lodlive.it']);
  30. _gaq.push(['_trackPageview']);
  31. (function() {
  32. var ga = document.createElement('script');
  33. ga.type = 'text/javascript';
  34. ga.async = true;
  35. ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  36. var s = document.getElementsByTagName('script')[0];
  37. s.parentNode.insertBefore(ga, s);
  38. })();
  39. </script>
  40. <script type="text/javascript">
  41. WebFontConfig = {
  42. google : {
  43. families : ['Open+Sans:400italic,700italic,800italic,300italic,600italic,400,300,600,800,700:latin']
  44. }
  45. };
  46. (function() {
  47. var wf = document.createElement('script');
  48. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') + '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  49. wf.type = 'text/javascript';
  50. wf.async = 'true';
  51. var s = document.getElementsByTagName('script')[0];
  52. s.parentNode.insertBefore(wf, s);
  53. })();
  54. </script>
  55. <script type="text/javascript" src="js/jquery-ui-1.9.2.min.js"></script>
  56. <link rel="stylesheet" href="js/jquery.fancybox/jquery.fancybox.css" type="text/css" media="all" />
  57. <link rel="stylesheet" href="css/lodlive.core.css?01" type="text/css" media="all" />
  58. <link rel="stylesheet" href="css/lodlive.profile.css?01" type="text/css" media="all" />
  59. <link rel="stylesheet" href="css/lodlive.app.css?01" type="text/css" media="all" />
  60. <script type="text/javascript" src="js/jquery.fancybox/jquery.fancybox.pack.js"></script>
  61. <script type="text/javascript" src="js/jquery.slimScroll.min.js"></script>
  62. <script type="text/javascript" src="js/jquery.json-2.3.min.js"></script>
  63. <script type="text/javascript" src="js/jquery.jsonp-2.4.0.min.js"></script>
  64. <script type="text/javascript" src="js/jquery.jstorage.js"></script>
  65. <script type="text/javascript" src="js/jquery.jcanvas.js"></script>
  66. <script type="text/javascript" src="js/jquery.doTimeout.js"></script>
  67. <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
  68. <script type="text/javascript" src="js/jquery.gmap3.js"></script>
  69. <script type="text/javascript" src="js/jquery.ThreeDots.min.js"></script>
  70. <script type="text/javascript" src="js/lodlive.profile.js?01"></script>
  71. <script type="text/javascript" src="js/lodlive.core.js?01"></script>
  72. <script type="text/javascript" src="js/lodlive.lang.js?01"></script>
  73. <script type="text/javascript" src="js/lodlive.utils.js?01"></script>
  74. <script type="text/javascript" src="js/lodlive.custom-lines.js?01"></script>
  75. <script type="text/javascript" src="js/lodlive.app.js?01"></script>
  76. <script type="text/javascript">
  77. $.jStorage.set('selectedLanguage', 'it')
  78. </script>
  79. </head>
  80. <body>
  81. <h1 style="display: none" property="dc:title">LodLive - browsing the Web of Data</h1>
  82. <div id="lang-it">
  83. <div id="nextPage" class="spriteHome paginator"></div>
  84. <div id="prevPage" class="spriteHome paginator"></div>
  85. <div id="startPanel">
  86. <div id="logo" class="sprite"></div>
  87. <div id="boxes">
  88. <div id="firstLineBoxes"></div>
  89. <div id="boxesCont"></div>
  90. </div>
  91. <div class="startBoxMainText">
  92. <div>
  93. <p>
  94. LodLive &egrave; il primo navigatore di risorse RDF basato unicamente su endpoint <a href="http://www.w3.org/TR/rdf-sparql-query/">SPARQL</a>.
  95. </p>
  96. <p>
  97. LodLive associa le potenzialit&agrave; di un browser RDF all'efficacia della rappresentazione a grafo.
  98. </p>
  99. </div>
  100. <a href="https://github.com/dvcama/LodLive" target="_blank">DOWNLOAD LodLive</a>
  101. </div>
  102. <div class="startBoxMainTextPlain">
  103. <div>
  104. <p>
  105. LodLive &egrave; realizzato interamente in Javascript, si compone di un plug-in jQuery (LodLive-core), un file JSON di configurazione (LodLive-profile), una pagina HTML, poche immagini (sprites) e alcuni plug-in pubblici. LodLive &egrave; in grado di connettere le risorse presenti negli endpoint configurati al suo interno, consentendo all'utente di passare da un endpoint all'altro sfruttando le capacit&agrave; di interconnesione insite nella LOD.
  106. </p>
  107. </div>
  108. <p>
  109. LodLive &egrave; gratuito, opensource e pronto per essere utilizzato da subito, viene rilasciato sotto <a href="http://www.opensource.org/licenses/MIT" rel="cc:license">licenza MIT</a> ed &egrave; facilmente integrabile nelle proprie applicazioni o utilizzabile online su <a href="http://lodlive.it">lodlive.it</a>
  110. </p>
  111. </div>
  112. </div>
  113. <div id="footer">
  114. <div id="footerContainer">
  115. <div class="footerBox segnala">
  116. <h2>condividi LodLive</h2>
  117. <a class="tw spriteHome" href="http://twitter.com/home?status=via+%40LodLive+-+%23lodlive+-+browsing+the+web+of+data" target="_blank" title="condividi su Twitter"></a><a class="fb spriteHome" href="http://www.facebook.com/sharer.php?s=100&amp;p[title]=LodLive+-+browsing+the+web+of+data&amp;p[summary]=LodLive+%C3%A8+un+progetto+sperimentale+nato+per+divulgare+la+filosofia+dei+linked+open+data+e+per+creare+uno+strumento+in+grado+di+associare+le+potenzialità+di+un+browser+RDF+all'efficacia+della+rappresentazione+a+grafo.&amp;p[url]=http://lodlive.it&amp;&amp;p[images][0]=http://lodlive.it/img/logoLodLive.jpg" target="_blank" title="condividi su FaceBook"></a>
  118. <br />
  119. <br />
  120. <h2>segui LodLive</h2>
  121. <a class="tw spriteHome" href="https://twitter.com/#!/LodLive" target="_blank" title="segui su Twitter"></a><a class="fb spriteHome" href="https://www.facebook.com/lodlive.browser" target="_blank" title="segui su FaceBook"></a>
  122. </div>
  123. <div class="footerBox" id="menu">
  124. <h2>menu</h2>
  125. <ul>
  126. <li>
  127. <a href="#what">Cosa &egrave; LodLive?</a>
  128. </li>
  129. <li>
  130. <a href="http://blog.lodlive.it">Blog/documentazione</a>
  131. </li>
  132. <li>
  133. <a href="#faq">FAQ</a>
  134. </li>
  135. <li>
  136. <a href="#send">Segnala un endpoint</a>
  137. </li>
  138. <li>
  139. <a href="#links">Link utili</a>
  140. </li>
  141. <li>
  142. <a href="#get">Download</a>
  143. </li>
  144. <li>
  145. <a href="#credits">Crediti e contatti</a>
  146. </li>
  147. </ul>
  148. </div>
  149. <div class="footerBox">
  150. <h2>best experienced with</h2>
  151. LodLive non sfrutta alcuna componente server.
  152. <br />
  153. Per il suo utilizzo si consiglia un browser di ultima generazione. <div class="spriteHome browsers" title="FireFox - Chrome - Safari - Opera"></div>
  154. </div>
  155. <div class="best">
  156. 2012, lodlive.it <a href="http://creativecommons.org/licenses/by-sa/2.0/" target="_blank">CC BY-SA</a>, lodlive.js <a href="http://www.opensource.org/licenses/mit-license.php" target="_blank">MIT License</a>
  157. <div class="license spriteHome"></div>
  158. </div>
  159. </div>
  160. </div>
  161. <div id="faq" class="hd">
  162. <p>
  163. <strong>Navigando il grafo, come faccio a capire su quale endpoint mi trovo?</strong>
  164. <br />
  165. Passando con il mouse sulla risorsa, in basso a sinistra compare un box in cui vengono ne evidenziate le caratteristiche, incluso l'endpoint di appartenenza.
  166. <br />
  167. <br />
  168. <strong>Il sistema sembra bloccarsi all'apertura di certe risorse e con IE non sembra funzionare.</strong>
  169. <br />
  170. LodLive sfrutta in tutto e per tutto la potenza del computer dal quale si sta facendo accesso e questo ci ha consentito di sviluppare un'applicazione che non necessita di alcuna componente server e che, una volta scaricata, &egrave; subito pronta all'utilizzo.
  171. <br />
  172. Consigliamo di usare un browser aggiornato, in particolare Opera,
  173. Safari o Google Chrome; FireFox funziona a dovere ma la navigazione nel suo complesso risulta pi&ugrave; lenta; Internet Explorer non &egrave; attualmente supportato perch&eacute; non gestisce alcune delle funzionalit&agrave; di cui LodLive si avvale.
  174. </p>
  175. </div>
  176. <div id="links" class="hd">
  177. <p>
  178. <strong>A proposito di SPARQL</strong>
  179. <br />
  180. <a href="http://www.w3.org/TR/rdf-sparql-query/" target="_blank">www.w3.org/TR/rdf-sparql-query</a>
  181. <br />
  182. <br />
  183. <strong>A proposito di standard e web semantico</strong>
  184. <br />
  185. <a href="http://www.w3.org/RDF/" target="_blank">www.w3.org/RDF</a>
  186. <br />
  187. <a href="http://www.w3.org/standards/semanticweb/" target="_blank">www.w3.org/standards/semanticweb</a>
  188. <br />
  189. <a href="http://www.w3.org/DesignIssues/LinkedData.html" target="_blank">www.w3.org/DesignIssues/LinkedData.html</a>
  190. <br />
  191. <br />
  192. <strong>Tutorial sparql del working group del w3c</strong>
  193. <br />
  194. <a href="http://www.cambridgesemantics.com/it/semantic-university/sparql-by-example" target="_blank">www.cambridgesemantics.com/it/semantic-university/sparql-by-example</a>
  195. <br />
  196. <br />
  197. </p>
  198. </div>
  199. <div id="get" class="hd">
  200. <p>
  201. LodLive &egrave; scaricabile da GitHub <a href="https://github.com/dvcama/LodLive" target="_blank">https://github.com/dvcama/LodLive</a>
  202. </p>
  203. </div>
  204. <div id="credits" class="hd">
  205. <p>
  206. <strong>Hanno partecipato</strong>
  207. <br />
  208. <span itemscope itemtype="http://data-vocabulary.org/Person"><span itemprop="name">Diego Valerio Camarda</span> (diego@lodlive.it), <span itemprop="name">Silvia Mazzini</span> (silvia@lodlive.it) e <span itemprop="name">Alessandro Antonuccio</span> (ale@lodlive.it)</span>
  209. <br />
  210. <br />
  211. Diego ha curato la realizzazione, Silvia stabilito i criteri di base e Alessandro si &egrave; occupato del disegno dell'interfaccia. Il gruppo ha lavorato insieme giorno per giorno ed &egrave; difficile stabilire i limiti delle competenze di ognuno.
  212. <br />
  213. <br />
  214. Per maggiorni informazioni e contatti info@lodlive.it.
  215. </p>
  216. </div>
  217. <div id="send" class="hd">
  218. <p>
  219. &Egrave; possibile segnalare a info@lodlive.it un endpoint di modo che sia inserito nell'applicazione disponibile su lodlive.it. In generale si ottengono risultati migliori con dataset che hanno relazioni owl:sameAs verso altre risorse disponibili su un endpoint SPARQL.
  220. <br />
  221. <br />
  222. &Egrave; importante fornire pi&ugrave; informazioni possibili sulle risorse presenti nell'endpoint e sulle specificit&agrave; del dataset. LodLive pu&ograve; essere configurato specificatamente per rappresentare al meglio i contenuti che deve navigare.
  223. </p>
  224. </div>
  225. <div id="what" class="hd">
  226. <p>
  227. LodLive &egrave; un progetto sperimentale nato per divulgare la filosofia dei linked open data e per creare uno strumento in grado di associare le potenzialit&agrave; di un browser RDF all'efficacia della rappresentazione a grafo.
  228. <br />
  229. <br />
  230. LodLive &egrave; il primo navigatore di risorse RDF basato unicamente su endpoint SPARQL.
  231. <br />
  232. <br />
  233. LodLive vuole dimostrare che le risorse pubblicate secondo gli standard del W3C per il semantic web possono essere facilmente accessibili e comprensibili con strumenti adeguati.
  234. <br />
  235. <br />
  236. LodLive &egrave; in grado di connettere le risorse presenti negli endpoint configurati al suo interno, consentendo all'utente di passare da un endpoint all'altro
  237. sfruttando le capacit&agrave; di interconnessione insite nei LOD.
  238. </p>
  239. </div>
  240. <div class="help hd">
  241. <div>
  242. <h2>HELP</h2>
  243. <p>
  244. <a href="http://www.youtube.com/embed/BQ9Ckh2ov-c?rel=0" class="sprite videoHelp"></a>
  245. </p>
  246. <p>
  247. Al centro di ogni cerchio viene visualizzata la label della risorsa.
  248. </p>
  249. <p>
  250. Il colore dei cerchi rispetta la logica delle classi di appartenenza delle risorse, quindi per risorse appartenenti a medesime classi si avr&agrave; il cerchio dello stesso colore.
  251. </p>
  252. <p>
  253. Intorno al cerchio vengono posizionati altri piccoli cerchi che indicano i collegamenti con altre risorse sia interne al medesimo dataset che esterne (purch&eacute; fruibili attraverso un Endpoint SPARQL).
  254. </p>
  255. <p>
  256. LodLive riconosce la propriet&agrave; owl:sameAs presente nella risorsa per favorire la "navigazione trasversale" e consentire il passaggio da un endpoint ad un altro.
  257. </p>
  258. <p>
  259. &Egrave; possibile trascinare con drag and drop i cerchi per posizionarli come si preferisce.
  260. </p>
  261. </div>
  262. </div>
  263. <div class="legenda hd">
  264. <div>
  265. <h2>LEGENDA</h2>
  266. <ul class="optionsList legend">
  267. <li>
  268. <span class="spriteLegenda"></span>strumenti
  269. </li>
  270. <li>
  271. <span class="spriteLegenda"></span>informazioni aggiuntive
  272. </li>
  273. <li>
  274. <span class="spriteLegenda"></span>chiudi la risorsa
  275. </li>
  276. <li>
  277. <span class="spriteLegenda"></span>"centra" la risorsa
  278. </li>
  279. <li>
  280. <span class="spriteLegenda"></span>apri l'URI della risorsa
  281. </li>
  282. <li>
  283. <span class="spriteLegenda"></span>espandi tutte le relazioni visibili
  284. </li>
  285. <li>
  286. <span class="spriteLegenda"></span>relazione diretta
  287. </li>
  288. <li>
  289. <span class="spriteLegenda"></span>gruppo di relazioni dirette
  290. </li>
  291. <li>
  292. <span class="spriteLegenda"></span>relazione inversa
  293. </li>
  294. <li>
  295. <span class="spriteLegenda"></span>gruppo di relazioni inverse
  296. </li>
  297. <li>
  298. <span class="spriteLegenda"></span>relazioni di tipo owl:sameAs
  299. </li>
  300. </ul>
  301. </div>
  302. </div>
  303. </div>
  304. </body>
  305. </html>