Skip to content

Instantly share code, notes, and snippets.

@lsquaredleland
Last active January 31, 2016 20:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lsquaredleland/eaa8d14832a9ab9aef72 to your computer and use it in GitHub Desktop.
Save lsquaredleland/eaa8d14832a9ab9aef72 to your computer and use it in GitHub Desktop.
Which UC Berkeley Libraries Are Open

Library Visualization:

A tool to check if there are any open libraries at the University of California, Berkeley. Using import.io to pull real time data from the library page. If there are issues with the endpoint, the visualization will default to the mon-thurs schedule. Yep there are API keys in the JS snippet :$.

Need to improve the overall UX when interacting with the visualization.....such as highlighting to emphasize which libraries are currently open.

Might want to bind data to the DOM rather than reference it... How many ways can the school say the times that a library is open or closed......way too many

var backUpData = {"tables":[{"guid":"8ce84e2a-26a0-43f9-a102-e7fd1c9ac360","queryGuid":"bf3c59ba-187d-4246-b050-fa9ef9564b7d","results":[{"libraryblock_image/_source":"/hours/system/pictures/134/medium/kroeber.jpg?1309378446","libraryinfo_values":"(510)642-2400","libraryinfo_link_1/_text":"Anthropology Library","libraryhours_values":"9 am-6 pm","libraryblock_image/_alt":"Kroeber","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/anthropology-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=The+George+and+Mary+Foster+Anthropology+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"230 Kroeber Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/134/medium/kroeber.jpg?1309378446"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":["Circulation Desk (510) 642-7361","Reference (510) 642-5358"],"libraryinfo_link_1/_text":"Art History/Classics Library","libraryhours_values":"9 am-9 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/art-history-classics-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Art+History%2FClassics+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"308 Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/125/medium/bancroft.jpg?1309378444","libraryinfo_values":["Reference (510)642-6481","Administrative Office (510)642-3781"],"libraryinfo_link_1/_text":"Bancroft Library/University Archives","libraryhours_values":["10 am-5 pm","Material paging ends at 4:30pm"],"libraryblock_image/_alt":"Bancroft","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/bancroft-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Bancroft+Library%2C+University+of+California&z=18","libraryinfo_link_2/_text":"The Bancroft Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/125/medium/bancroft.jpg?1309378444"},{"libraryblock_image/_source":"/hours/system/pictures/154/medium/berkeley-law.jpg?1387403099","libraryinfo_values":"(510)642-4044","libraryinfo_link_1/_text":"Berkeley Law Library","libraryhours_values":"8 am-12 midnight","libraryblock_image/_alt":"Berkeley-law","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/law-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Law+Library+Boalt+Hall%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"Floor 2, Boalt Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/154/medium/berkeley-law.jpg?1387403099"},{"libraryblock_image/_source":"/hours/system/pictures/146/medium/vlsb.jpg?1309378448","libraryinfo_values":["Circulation/Renewals (510)642-2531","Reference (510)642-0456"],"libraryinfo_link_1/_text":"Bioscience & Natural Resources Library","libraryhours_values":"9 am-10 pm","libraryblock_image/_alt":"Vlsb","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/bioscience-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Bioscience+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"2101 Valley Life Sciences Building","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/146/medium/vlsb.jpg?1309378448"},{"libraryblock_image/_source":"/hours/system/pictures/129/medium/haasbusiness.jpg?1309378445","libraryinfo_values":["Reference (510)642-0400","Circulation/Renewals (510)642-0370"],"libraryinfo_link_1/_text":"Business Library","libraryhours_values":"9 am-10 pm","libraryblock_image/_alt":"Haasbusiness","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/business-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Thomas+J.+Long+Business+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"Haas School of Business","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/129/medium/haasbusiness.jpg?1309378445"},{"libraryblock_image/_source":"/hours/system/pictures/143/medium/tang.jpg?1309378448","libraryinfo_values":"(510) 642-2367","libraryinfo_link_1/_text":"Career Counseling Library","libraryhours_values":"10 am-5 pm","libraryblock_image/_alt":"Tang","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/career-counseling-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Tang+Center%2C+UC+Berkeley+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"2222 Bancroft Way (courtyard of the Tang Center), Berkeley, CA 94720-4300","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/143/medium/tang.jpg?1309378448"},{"libraryblock_image/_source":"/hours/system/pictures/147/medium/wurster.jpg?1309378449","libraryinfo_values":"(510)642-3439","libraryinfo_link_1/_text":"CED Visual Resources Center","libraryhours_values":["9 am-12 noon","1 pm-5 pm"],"libraryblock_image/_alt":"Wurster","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/visual-resources-center","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=CED+Visual+Resources+Center%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"492 Wurster Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/147/medium/wurster.jpg?1309378449"},{"libraryblock_image/_source":"/hours/system/pictures/132/medium/hildebrand.jpg?1309378445","libraryinfo_values":"(510)642-3753","libraryinfo_link_1/_text":"Chemistry and Chemical Engineering Library","libraryhours_values":"9 am-7 pm","libraryblock_image/_alt":"Hildebrand","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/chemistry-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Chemistry+and+Chemical+Engineering+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"100 Hildebrand Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/132/medium/hildebrand.jpg?1309378445"},{"libraryblock_image/_source":"/hours/system/pictures/139/medium/moffitt.jpg?1309378447","libraryinfo_link_1":"http://www.lib.berkeley.edu/using-the-libraries/print-scan","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/139/medium/moffitt.jpg?1309378447","libraryinfo_values":"(510)643-7427","libraryinfo_link_1/_text":"Copy Center","libraryinfo_value":"321 Moffitt Library","libraryhours_values":"8:30 am-5 pm","libraryblock_image/_alt":"Moffitt"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":["(510) 423-3282","gtalk: ucbdatalab"],"libraryinfo_link_1/_text":"Data Lab","libraryhours_values":"10 am-5 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/data-lab","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=UC+Berkeley+Library+Data+Lab&z=18","libraryinfo_link_2/_text":"189 Doe Annex","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":["Reference (510)642-6657","Circulation (510)643-4331","Privileges Desk (510)642-3403"],"libraryinfo_link_1/_text":"Doe Library","libraryhours_values":"8 am-9 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/doe-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Doe+Memorial+Library&z=18","libraryinfo_link_2/_text":"Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/136/medium/mccone.jpg?1309378446","libraryinfo_values":"(510)642-2997","libraryinfo_link_1/_text":"Earth Sciences & Map Library","libraryhours_values":"9 am-7 pm","libraryblock_image/_alt":"Mccone","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/earth-sciences-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Earth+Sciences+and+Map+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"50 McCone Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/136/medium/mccone.jpg?1309378446"},{"libraryblock_image/_source":"/hours/system/pictures/124/medium/eal.jpg?1309378444","libraryinfo_values":"(510)642-2556","libraryinfo_link_1/_text":"East Asian Library","libraryhours_values":"9 am-9 pm","libraryblock_image/_alt":"Eal","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/east-asian-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=C.V.+Starr+East+Asian+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"C.V. Starr Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/124/medium/eal.jpg?1309378444"},{"libraryblock_image/_source":"/hours/system/pictures/144/medium/tolman.jpg?1309378448","libraryinfo_values":"Circulation/Renewals (510)642-4209","libraryinfo_link_1/_text":"Education Psychology Library","libraryhours_values":"9 am-9 pm","libraryblock_image/_alt":"Tolman","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/education-psychology-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Education+Psychology+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"2600 Tolman Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/144/medium/tolman.jpg?1309378448"},{"libraryblock_image/_source":"/hours/system/pictures/126/medium/bechtel.jpg?1309378444","libraryinfo_values":"(510)642-3366","libraryinfo_link_1/_text":"Engineering Library","libraryhours_values":"9 am-12 midnight","libraryblock_image/_alt":"Bechtel","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/engineering-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Kresge+Engineering+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"110 Bechtel Engineering Center","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/126/medium/bechtel.jpg?1309378444"},{"libraryblock_image/_source":"/hours/system/pictures/147/medium/wurster.jpg?1309378449","libraryinfo_values":"(510)642-5124","libraryinfo_link_1/_text":"Environmental Design Archives","libraryhours_values":["9:30 am-4:30 pm","by appointment"],"libraryblock_image/_alt":"Wurster","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/environmental-design-archives","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Environmental+Design+Archives%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"280 Wurster Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/147/medium/wurster.jpg?1309378449"},{"libraryblock_image/_source":"/hours/system/pictures/147/medium/wurster.jpg?1309378449","libraryinfo_values":["Reference (510) 643-7421","Circulation/Renewals (510) 642-4818"],"libraryinfo_link_1/_text":"Environmental Design Library","libraryhours_values":"9 am-10 pm","libraryblock_image/_alt":"Wurster","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/environmental-design-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Environmental+Design+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"210 Wurster Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/147/medium/wurster.jpg?1309378449"},{"libraryblock_image/_source":"/hours/system/pictures/142/medium/stephens.jpg?1309378448","libraryinfo_values":"(510)643-1234","libraryinfo_link_1/_text":"Ethnic Studies Library","libraryhours_values":"9 am-5 pm","libraryblock_image/_alt":"Stephens","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/ethnic-studies-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Ethnic+Studies+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"30 Stephens Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/142/medium/stephens.jpg?1309378448"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":"(510)642-4481","libraryinfo_link_1/_text":"Graduate Services","libraryhours_values":"9 am-9 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/graduate-services","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Doe+Graduate+Services%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"208 Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/153/medium/graduate-theological-union-library.jpg?1309984748","libraryinfo_values":["Circulation (510)649-2500","Reference (510)649-2501","Fax (510)649-2508"],"libraryinfo_link_1/_text":"Graduate Theological Union Library","libraryhours_values":"8:30 am-9 pm","libraryblock_image/_alt":"Graduate-theological-union-library","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/graduate-theological-union-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Graduate+Theological+Union+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"2400 Ridge Road","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/153/medium/graduate-theological-union-library.jpg?1309984748"},{"libraryblock_image/_source":"/hours/system/pictures/133/medium/irle.jpg?1309378445","libraryinfo_values":"(510)642-1705","libraryinfo_link_1/_text":"Institute for Research on Labor and Employment Library","libraryhours_values":["9 am-12 noon","1 pm-5 pm"],"libraryblock_image/_alt":"Irle","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/irle-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Center+for+Labor+Research+and+Education+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"2521 Channing Way","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/133/medium/irle.jpg?1309378445"},{"libraryblock_image/_source":"/hours/system/pictures/140/medium/moses.jpg?1309378447","libraryinfo_values":"(510)642-1472","libraryinfo_link_1/_text":"Institute of Governmental Studies Library","libraryhours_values":"9 am-5 pm","libraryblock_image/_alt":"Moses","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/igs-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Inst-Governmental+Studies+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"109 Moses Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/140/medium/moses.jpg?1309378447"},{"libraryblock_image/_source":"/hours/system/pictures/137/medium/mclaughlin.jpg?1309378446","libraryinfo_values":"(510)642-3604","libraryinfo_link_1/_text":"Institute of Transportation Studies Library","libraryhours_values":"1 pm-5 pm","libraryblock_image/_alt":"Mclaughlin","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/its-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Institute+of+Transportation+Studies+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"412 McLaughlin Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/137/medium/mclaughlin.jpg?1309378446"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":"(510)642-7365","libraryinfo_link_1/_text":"Interlibrary Services","libraryhours_values":"10 am-4 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/interlibrary-loan","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Doe+Memorial+Library&z=18","libraryinfo_link_2/_text":"133 Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/155/medium/lawrence-berkeley-national-laboratory-library.jpg?1389314463","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/lbnl-library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/155/medium/lawrence-berkeley-national-laboratory-library.jpg?1389314463","libraryinfo_link_1/_text":"Lawrence Berkeley National Laboratory Library","libraryhours_values":"email: library@lbl.gov","libraryblock_image/_alt":"Lawrence-berkeley-national-laboratory-library"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/main-stacks","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_link_1/_text":"Main (Gardner) Stacks","libraryinfo_value":"Entrance via Doe Library or Moffitt Library","libraryhours_values":"9 am-2 am","libraryblock_image/_alt":"Doe"},{"libraryblock_image/_source":"/hours/system/pictures/125/medium/bancroft.jpg?1309378444","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/bancroft-library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/125/medium/bancroft.jpg?1309378444","libraryinfo_values":"(510) 642-6480","libraryinfo_link_1/_text":"Mark Twain Papers & Project","libraryinfo_value":"The Bancroft Library, Room 475","libraryhours_values":"10 am-4 pm","libraryblock_image/_alt":"Bancroft"},{"libraryblock_image/_source":"/hours/system/pictures/127/medium/evans.jpg?1309378444","libraryinfo_values":"(510)642-3381","libraryinfo_link_1/_text":"Mathematics Statistics Library","libraryhours_values":"9 am-7 pm","libraryblock_image/_alt":"Evans","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/math-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Mathematics+Statistics+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"100 Evans Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/127/medium/evans.jpg?1309378444"},{"libraryblock_image/_source":"/hours/system/pictures/139/medium/moffitt.jpg?1309378447","libraryinfo_values":"(510)642-8197","libraryinfo_link_1/_text":"Media Resources Center","libraryhours_values":"9 am-8:45 pm","libraryblock_image/_alt":"Moffitt","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/media-resources-center","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Media+Resources+Center%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"150 Moffitt Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/139/medium/moffitt.jpg?1309378447"},{"libraryblock_image/_source":"/hours/system/pictures/139/medium/moffitt.jpg?1309378447","libraryinfo_values":"Circulation (510)642-5072","libraryinfo_link_1/_text":"Moffitt Library","libraryhours_values":"8 am-2 am","libraryblock_image/_alt":"Moffitt","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/moffitt-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Moffitt+Undergraduate+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"Includes entrance to Main (Gardner) Stacks","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/139/medium/moffitt.jpg?1309378447"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":"(510)642-3671","libraryinfo_link_1/_text":"Morrison Library","libraryhours_values":["Closed","Closed for special event"],"libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/morrison-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Morrison+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"101 Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/152/medium/music-library.jpg?1309887819","libraryinfo_values":"(510)642-2623","libraryinfo_link_1/_text":"Music Library","libraryhours_values":"9 am-8 pm","libraryblock_image/_alt":"Music-library","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/music-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Jean+Gray+Hargrove+Music+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"Jean Gray Hargrove Music Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/152/medium/music-library.jpg?1309887819"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":"(510)642-2975","libraryinfo_link_1/_text":"Newspapers & Microforms Library","libraryhours_values":"10 am-7 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/newspaper-microform-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Newspapers+%26+Microforms+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"40 Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"},{"libraryblock_image/_source":"/hours/system/pictures/158/medium/northern-regional-library-facility.jpg?1409676296","libraryinfo_values":"(510)232-7767","libraryinfo_link_1/_text":"Northern Regional Library Facility","libraryhours_values":"8 am-5 pm","libraryblock_image/_alt":"Northern-regional-library-facility","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/nrlf","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Northern+Regional+Library+Facility%2C+Richmond%2C+CA&z=18","libraryinfo_link_2/_text":"Berkeley Global Campus; Richmond Field Station Bldg 400","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/158/medium/northern-regional-library-facility.jpg?1409676296"},{"libraryblock_image/_source":"/hours/system/pictures/138/medium/minor.jpg?1309378447","libraryinfo_values":"(510)642-1020","libraryinfo_link_1/_text":"Optometry and Health Sciences Library","libraryhours_values":["9 am-5 pm","5 pm-7 pm","Building Access Only"],"libraryblock_image/_alt":"Minor","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/optometry-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Optometry+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"490 Minor Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/138/medium/minor.jpg?1309378447"},{"libraryblock_image/_source":"/hours/system/pictures/157/medium/pacific-earthquake-engineering-research-library.jpg?1391211780","libraryinfo_values":"(510)665-3419","libraryinfo_link_1/_text":"Pacific Earthquake Engineering Research (PEER) Center Library","libraryhours_values":"9 am-5 pm","libraryblock_image/_alt":"Pacific-earthquake-engineering-research-library","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/earthquake-engineering-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Earthquake+Engineering+Center%2C+1301+S+46th+St+%23453%2C+Richmond%2C+CA&z=18","libraryinfo_link_2/_text":"1301 S. 46th Street, Richmond Field Station Building 453","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/157/medium/pacific-earthquake-engineering-research-library.jpg?1391211780"},{"libraryblock_image/_source":"/hours/system/pictures/141/medium/pacific-film-archive.jpg?1395872057","libraryinfo_values":"(510)642-1437","libraryinfo_link_1/_text":"Pacific Film Archive Library & Film Study Center","libraryhours_values":["Closed","for relocation"],"libraryblock_image/_alt":"Pacific-film-archive","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/pfa-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Pacific+Film+Archive%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"2625 Durant Ave.","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/141/medium/pacific-film-archive.jpg?1395872057"},{"libraryblock_image/_source":"/hours/system/pictures/135/medium/leconte.jpg?1309378446","libraryinfo_values":"(510)642-3122","libraryinfo_link_1/_text":"Physics-Astronomy Library","libraryhours_values":"9 am-7 pm","libraryblock_image/_alt":"Leconte","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/physics-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Physics-Astronomy+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"351 LeConte Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/135/medium/leconte.jpg?1309378446"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_link_1":"http://www.lib.berkeley.edu/using-the-libraries/privileges-desk","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":"(510)642-3403","libraryinfo_link_1/_text":"Privileges Desk","libraryinfo_value":"Floor 1 Doe Library","libraryhours_values":"9 am-5:45 pm","libraryblock_image/_alt":"Doe"},{"libraryblock_image/_source":"/hours/system/pictures/145/medium/university.jpg?1309378448","libraryinfo_values":"(510)642-2511","libraryinfo_link_1/_text":"Public Health Library","libraryhours_values":"9 am-8 pm","libraryblock_image/_alt":"University","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/public-health-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Library+of+Public+Health%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"1 University Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/145/medium/university.jpg?1309378448"},{"libraryblock_image/_source":"/hours/system/pictures/154/medium/berkeley-law.jpg?1387403099","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/law-library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/154/medium/berkeley-law.jpg?1387403099","libraryinfo_values":"(510) 643-1211","libraryinfo_link_1/_text":"Robbins Collection","libraryinfo_value":"Berkeley Law (Boalt Hall)","libraryhours_values":"9 am-5 pm","libraryblock_image/_alt":"Berkeley-law"},{"libraryblock_image/_source":"/hours/system/pictures/131/medium/haviland.jpg?1309378445","libraryinfo_values":"(510)642-4432","libraryinfo_link_1/_text":"Social Research Library","libraryhours_values":"9 am-6 pm","libraryblock_image/_alt":"Haviland","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/social-research-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=Library+of+Social+Welfare%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"227 Haviland Hall","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/131/medium/haviland.jpg?1309378445"},{"libraryblock_image/_source":"/hours/system/pictures/123/medium/doe.jpg?1309378443","libraryinfo_values":"(510)642-3095","libraryinfo_link_1/_text":"South/Southeast Asia Library","libraryhours_values":"10 am-5 pm","libraryblock_image/_alt":"Doe","libraryinfo_link_1":"http://www.lib.berkeley.edu/libraries/ssea-library","libraryinfo_link_2":"https://maps.google.com/maps?hl=en&q=South-Southeast+Asia+Library%2C+Berkeley%2C+CA&z=18","libraryinfo_link_2/_text":"120 Doe Library","libraryblock_image":"http://www.lib.berkeley.edu/hours/system/pictures/123/medium/doe.jpg?1309378443"}],"connectorVersionGuid":"15232d2b-d381-31b2-3b06-75b3bf644cbf","connectorGuid":"316c88fc-b54f-4d3d-aadc-1df1438b2dc1","pageUrl":"http://www.lib.berkeley.edu/hours","outputProperties":[{"name":"libraryblock_image","type":"IMAGE"},{"name":"libraryinfo_link_1","type":"URL"},{"name":"libraryinfo_value","type":"STRING"},{"name":"libraryinfo_link_2","type":"URL"},{"name":"libraryinfo_values","type":"STRING"},{"name":"libraryhours_values","type":"STRING"}],"regionXPath":"/html/body[1][not(@class)][not(@id)]/div[1][for $s in concat(' ',normalize-space(@class),' ') return contains($s, ' html ') and contains($s, ' not-front ') and contains($s, ' not-logged-in ') and contains($s, ' no-sidebars ') and contains($s, ' node-type-page ') and contains($s, ' footer-columns ')][normalize-space(@id)='lwsa-container']/div[1][not(@class)][normalize-space(@id)='page-wrapper']/div[1][not(@class)][normalize-space(@id)='page']/div[2][contains(concat(' ',normalize-space(@class),' '),' clearfix ')][normalize-space(@id)='main-wrapper']/div[1][contains(concat(' ',normalize-space(@class),' '),' clearfix ')][normalize-space(@id)='main']/div[1][contains(concat(' ',normalize-space(@class),' '),' column ')][normalize-space(@id)='content']/div[1][contains(concat(' ',normalize-space(@class),' '),' section ')][not(@id)]/div[1][for $s in concat(' ',normalize-space(@class),' ') return contains($s, ' region ') and contains($s, ' region-content ')][not(@id)]/div[1][contains(concat(' ',normalize-space(@class),' '),' content ')][not(@id)]/div[1][for $s in concat(' ',normalize-space(@class),' ') return contains($s, ' node ') and contains($s, ' node-page ') and contains($s, ' node-full ') and contains($s, ' clearfix ')][not(@id)]/div[1][for $s in concat(' ',normalize-space(@class),' ') return contains($s, ' content ') and contains($s, ' clearfix ')][not(@id)]/div[1][not(@class)][normalize-space(@id)='hours-home']/div[1][not(@class)][normalize-space(@id)='library-hours-block-div']/table[1][not(@class)][normalize-space(@id)='library-hours-block-table']/tbody[1][not(@class)][not(@id)]","resultXPath":"//td[contains(concat(' ',normalize-space(@class),' '),' library-image-block ')][not(@style)]/img[1][not(@class)][not(@style)]/../..","periodicity":0,"scores":{"rowDetector":[440],"tableDetector":[0],"regionDetector":[723],"reliability":826.6363663673401,"normalizedRegion":1163}}]}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Library Visualization</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js"></script>
</head>
<body>
<div id="chartArea"></div>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="backUpData.js"></script>
<script src="js.js"></script>
</body>
</html>
var margin = {top: 20, right: 20, bottom: 20, left: 200};
var height = 500 - margin.top - margin.bottom;
var width = 960 - margin.left - margin.right;
var data = [];
var libraries = [];
var timePrintFormat = d3.time.format("%H:%M");
var rectHeight = 9.5;
//D3 -> better to iterate and append + select via className
// or -> bind data to dom and select via variable name
// Data is loading
var target_url = "http://www.lib.berkeley.edu/hours"
var encoded_url = encodeURI(target_url);
var API_KEY = "1dd8ab3e6c55463dbd719a12731e7226a6948da4e498adb9d7369cde2973976dbf5965386c757b8746ba2129328a79ee8f3695c0d6004c246325190bd2875591e6257d1a6281122f6c0bbf3908595a4c";
var url = "https://api.import.io/store/connector/_magic?url=" + encoded_url + "&format=JSON&js=false&_user=1dd8ab3e-6c55-463d-bd71-9a12731e7226&_apikey=" + API_KEY
data = backUpData.tables[0];
processData();
d3.json(url, function(error, json) {
if (error) {
alert("Cannot load realtime data -> defaulting to mon-fri schedule")
return console.warn(error);
}
data = json.tables[0];
processData();
});
function processData() {
//Multiple time input woes
var formatTime1 = d3.time.format("%I:%M %p"); // `11:12 am`
var formatTime2 = d3.time.format("%I %p"); // `11 am`
var formatTime3 = d3.time.format("%H"); // `23` [0,23]
function processTime(time) {
if (!_.includes(time, '-')) {
return {start:0, end:0};
}
if (time === '24-hour Study Hall') {
return {start:formatTime3.parse("0"), end:formatTime3.parse("23")};
}
var parts = time.split('-');
return {
start: to24(parts[0]),
end: to24(parts[1])
}
}
function to24(time) {
var parseFormat1 = formatTime1.parse(time);
var parseFormat2 = formatTime2.parse(time);
if (parseFormat1) {
return parseFormat1
}
if (parseFormat2) {
return parseFormat2
}
if (_.includes(time,'midnight')) {
return formatTime3.parse("23")
}
if (_.includes(time,'noon')) {
return formatTime3.parse("12")
}
}
libraries = data.results;
_.forEach(libraries, function(lib) {
var hours = lib['libraryhours_values'];
delete lib['libraryhours_values']
hours = _.isArray(hours) ? hours : [hours]
lib['hours'] = _.map(hours, function(time) {
return processTime(time);
})
})
visualization();
}
function createClassName(input) {
return input.replace(/\s+/g, '-').replace(/[^a-zA-Z-]/g, '').toLowerCase();
}
function visualization() {
d3.selectAll("svg").remove();
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
var scaleHeight = d3.scale.linear()
.domain([0, _.size(libraries)])
.range([0, height]);
var timeScale = d3.time.scale()
.domain([timePrintFormat.parse("00:00"), timePrintFormat.parse("23:59")])
.range([0, width]);
var xAxis = d3.svg.axis()
.scale(timeScale)
.ticks(d3.time.hour, 2)
.tickFormat(timePrintFormat);
console.log(libraries)
//Keep each row in a G element -> goal is to have row have the info
//While the individual bars are dumb for the most part
_.forEach(libraries, function(lib, i) {
var className = createClassName(lib['libraryinfo_link_1/_text']);
const row = svg.append("g").classed(className, true);
_.forEach(lib["hours"], function(hours) {
//This rect is used to capture mouse events
row.append('rect')
.classed("background-row", true)
.attr("x", 0)
.attr("y", scaleHeight(i))
.attr("width", width)
.attr("height", rectHeight)
.on('click', function() { window.open(lib.libraryinfo_link_1) })
drawRow(className, hours, i)
})
//mouseover specific elements within the `g` element rather than entire thing?
row.on('mouseover', function() {
d3.select(this).style('fill', 'orange')
d3.selectAll("rect." + className).style("fill", "orange")
//why need to select rect seperatly when inside g-element
})
row.on('mouseout', function() {
d3.select(this).style('fill', 'black')
d3.selectAll("rect." + className).style("fill", "none")
})
const libraryLabel = row.append("g")
.attr("class", "libraryLabel")
.attr("transform", function() { return "translate(" + 0 + "," + (scaleHeight(i) + rectHeight/2) + ")"; })
libraryLabel.append("text")
.attr("x", -6)
.attr("dy", ".35em")
.text(lib["libraryinfo_link_1/_text"])
.on('click', function() {
var win = window.open(lib['libraryinfo_link_1'], '_blank');
win.focus();
})
libraryLabel.append("line")
.attr("x2", width);
})
function drawRow(className, hours, i) {
overflow = hours.end < hours.start;
originalEnd = hours.end
if (overflow) {
hours.end = timePrintFormat.parse("23:59");
}
drawRect(className, hours, i)
if (overflow) {
hours.start = timePrintFormat.parse("00:00");
hours.end = originalEnd
drawRect(className, hours, i)
}
}
function drawRect(className, hours, i) {
const rowElement = d3.select("g." + className);
rowElement.append("rect")
.classed(className, true)
.attr("x", function() {
return timeScale(hours.start);
})
.attr("y", scaleHeight(i))
.attr("width", function() {
return timeScale(hours.end) - timeScale(hours.start);
})
.attr("height", rectHeight)
}
//Drawing axis
svg.append("g")
.attr("class", "x top axis")
.call(xAxis.orient("top")); //What would do to have actions when select individual ticks?
svg.append("g")
.attr("class", "x bottom axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis.orient("bottom"));
var timeLine = {}
timeLine.getXPos = function() {
var current = new Date()
current_semi_processed = current.getHours() + ":" + current.getMinutes()
return timeScale(timePrintFormat.parse(current_semi_processed))
}
timeLine.drawCurrentTime = function() {
var xPos = timeLine.getXPos();
svg.append("line")
.classed('currentTime', true)
.attr("x1", xPos)
.attr("x2", xPos)
.attr("y1", 0)
.attr("y2", height)
.style("stroke", "maroon")
}
timeLine.updateCurrentTime = function() {
var xPos = timeLine.getXPos();
d3.select('line.currentTime').transition()
.duration(1000)
.attr("x1", xPos)
.attr("x2", xPos)
}
timeLine.drawCurrentTime()
d3.timer(timeLine.updateCurrentTime, 1000 * 60) // every minute update current time line
}
svg {
font: 10px sans-serif;
}
.axis path {
display: none;
}
.axis line {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
}
.libraryLabel text {
text-anchor: end;
}
.libraryLabel line {
stroke: #ddd;
stroke-dasharray: 1,1;
shape-rendering: crispEdges;
pointer-events: none;
}
rect {
fill: none;
stroke: black;
}
rect.background-row {
stroke: white;
fill: white;
}
.currentTime {
stroke: maroon;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment