Digital Library

While creating a porfolio of my work, I was interested in the interface in which I would like to showcase the books that I have read. A personal library can tell a lot about a person and I have been interested in creating a virtual reality library because of the cool hacks I've done with software similar to spritz. I tried at first using the pipe and cylinder objects found in that come with Janus by default inside ~/JanusVRBin/assets/primitives/ but they weren't so good. What I found worked best was from an asset pack an Aussie had sent me earlier, now uploaded on the master branch of gitlab.

This would be perfect for displaying the books. So what I did next was open gimp and create a transparent background of about 3840 x 600 and added in my book covers that I downloaded from Goodreads:

I created an AssetObject id="screen360" pointed to the raw mesh file and the AssetImage's of the transparent png's I just made in gimp. The HTML looks like this:

<!-- Written with Janus VR.  URL: file:///home/avi/library.html -->
<html>
<head>
<title>Library</title>
</head>
<body>
<FireBoxRoom>
<Assets>
<AssetObject id="screen360" src="https://gitlab.com/janusvr/cyberia/raw/master/obj/360screen2.obj" />
<AssetObject id="sphere1" src="https://gitlab.com/janusvr/cyberia/raw/master/church.dae" />
<AssetObject id="sphere2" src="https://gitlab.com/janusvr/cyberia/raw/master/church1.dae" />
<AssetObject id="cylinder" src="https://gitlab.com/janusvr/cyberia/raw/master/obj/cylinder.obj" />
<AssetImage id="HacDC" src="https://gitlab.com/janusvr/cyberia/raw/master/hacdc-logo.png" />
<AssetImage id="books1" src="http://a.pomf.se/sbhfcr.png" />
<AssetImage id="books2" src="http://a.pomf.se/budcrw.png" />
<AssetImage id="books3" src="http://a.pomf.se/icjdew.png" />
<AssetImage id="books4" src="http://a.pomf.se/aoutbn.png" />
<AssetImage id="books5" src="http://a.pomf.se/ubbhsq.png" />
<AssetImage id="books6" src="http://a.pomf.se/zlunyw.png" />
</Assets>
<Room use_local_asset="room_plane" pos="0.000000 0.100000 10.000000" xdir="-1.000000 0.000000 0.000004" ydir="0.000000 1.000000 0.000000" zdir="-0.000004 0.000000 -1.000000" col="0.000000 0.000000 0.000000" default_sounds="false" fog="true" fog_density="0.010000" fog_end="50.000000" fog_col="0.600000 0.600000 0.600000">
<Image id="HacDC" js_id="dasdas3" pos="0.000000 5.400000 10.400001" xdir="-1.000 0.000 0.000" zdir="0.000 0.000 -1.000" scale="1.500000 1.500000 1.000000" />
<Object id="sphere2" js_id="17223c" pos="0.000000 1.500000 0.000000" scale="1.000000 0.700000 1.000000" cull_face="none" />
<Object id="sphere1" js_id="172s2" pos="0.000000 1.500000 0.000000" scale="1.000000 0.700000 1.000000" lighting="false" cull_face="none" collision_id="sphere1" />
<Object id="screen360" js_id="alusion-0-1429073195" pos="0.400000 1.900000 -5.100000" xdir="-0.322 0.003 0.947" ydir="-0.006 -1.000 0.001" zdir="0.947 -0.005 0.322" scale="0.200000 0.100000 0.200000" image_id="books1" />
<Object id="screen360" js_id="" pos="0.400000 2.600000 -5.100000" xdir="-0.322 0.003 0.947" ydir="-0.006 -1.000 0.001" zdir="0.947 -0.005 0.322" scale="0.200000 0.100000 0.200000" image_id="books2" />
<Object id="screen360" js_id="" pos="0.400000 3.200000 -5.100000" xdir="-0.322 0.003 0.947" ydir="-0.006 -1.000 0.001" zdir="0.947 -0.005 0.322" scale="0.200000 0.100000 0.200000" image_id="books3" />
</Room>
</FireBoxRoom>
</body>
</html>

The only thing I changed was I adjoined two of the transparent png's horizontally so I can fit 20 books in a ring, the total resolution of the file being 7680x600 pixels at < 5mb in size. The results look very good inside ~

From the outside it seems like you could build a tower of books this way

The inside looks spectacular, everything is readable and it is a funny feeling being surrounded by the books you read and love. I would like to implement some JavaScript for the images to rotate on mousehold next.

I have the full text file of Mona Lisa Overdrive and in the future plan to play with this idea further to allow conversion of the book into a speed read video or an audiobook reading. It'd be cool to have a virtual reality library where you can just pick a book and relax as the words stream into your subconsciousness in any environment of your choosing.

The process of grabbing the book covers and creating the panormas was a bit too manual for me so I sought ways to automate it, here's what I found out so far:

I first went into my goodreads profile here:

https://www.goodreads.com/user/show/22526865-alusion

and then traversed to view all books (20 by page)

https://www.goodreads.com/review/list/22526865-alusion?page=1&print=true&shelf=%23ALL%23&view=covers

From here, I could use image-scraper (written in python) to see how much it can grab, the results weren't bad

# Create new directory, scrape max of 30 images to saved directory scrape/ of the url
mkdir scrape/; image-scraper -m 30 -s scrape/  https://www.goodreads.com/review/list/22526865-alusion\?utf8\=%E2%9C%93\&utf8\=%E2%9C%93\&shelf\=%23ALL%23\&view\=covers\&per_page\=20

Lets check out the loot!

Book covers! Tiny book covers!

I needed to dig deeper to get the enlarged book covers. I went on goodreads, opened up firebug, and clicked on a book. The url looks like this:

https://www.goodreads.com/book/show/13529210-the-15-invaluable-laws-of-growth

I then searched through the html with firebug to look for that unique number that came attached with the url (13529210) and here's what I found when I took a look at a couple books:

## Book 1
https://www.goodreads.com/book/show/13529210-the-15-invaluable-laws-of-growth
<img id="coverImage" src="https://d.gr-assets.com/books/1372058919l/13529210.jpg" alt="The 15 Invaluable Laws of Growth: Live Them and Reach Your Potential">

## Book 2
https://www.goodreads.com/book/show/8034188-where-good-ideas-come-from
<img id="coverImage" src="https://d.gr-assets.com/books/1311705993l/8034188.jpg" alt="Where Good Ideas Come From: The Natural History of Innovation">

The number has a relationship with the pathname to the image source of the enlarged book cover. Here's where it appears again with some context:

<div class="bookCoverActions" style="display: none;">
<div class="coverButtonContainer">
<div class="coverButtonContainer">
<div id="edition_8034188_enlarge" class="coverButton enlargeCover"> Enlarge cover </div>
<div id="edition_8034188_enlarge_cover" class="editionCover" style="display: none;">
<img src="https://d.gr-assets.com/books/1311705993l/8034188.jpg" alt="8034188">

I also noticed some other things through firebug such as a weak SHA-1 certificate. If one were to browse to https://d.gr-assets.com/books/ you'd get an AccessDenied page:

This will continue to be a work in progress as I figure out how to get quickly grab those nice higher quality book covers. If anyone has any ideas through python or curl let me know ^.~