configuring to use localStorage as endpoint instead of local server

Question

I am using a javascript library that generates annotations within an ePub. I am hoping to use HTML5 localStorage for storing the annotation data.

Is there a way to have an endpoint url associated with localStorage?

In the hook that invokes the library there is a variable for 'server', which is currently set to a url for the local server, port 5000.

I am hoping to replace that with some pointer to localStorage, but I'm not sure what endpoint would be involved. Seems like the only method for adding in information would be the method "localStorage.setItem", which in turn needs a variable name as an argument, so it wouldn't be appropriate as an endpoint.

The unadulterated hook, before I customized it is in this github repo,

My current version after editing, (which isn't functioning) is as follows:

    EPUBJS.Hooks.register("beforeChapterDisplay").annotate = function(callback, chapter){

        var chap = chapter.bodyEl,
            server = localStorage;
            files = [
                        EPUBJS.filePath + "annotator-full.js"
                     ];

        console.log(files);//show the pathways defined above

        EPUBJS.core.load(files, chapter.doc.head);
        $(chapter.doc.body).annotator().annotator('setupPlugins', {}, {

            Filter:false,
            Store: {
                annotationData: {
                  'uri': chapter.path
                },
                loadFromSearch: {
                    'limit': 100,
                    'uri': chapter.path
                }
            }

        });

        Util.mousePosition = function(e, offsetEl) {
          var offset;
          offset = $(offsetEl).position();
          return {
            top: e.pageY,
            left: e.pageX
          };
        };

            devAnnotator = new Annotator(chapter.doc.body)
            // .addPlugin('Auth', {
            //            tokenUrl: 'http://annotateit.org/api/token',//'http://localhost:5001/api/token'
            //          })
            // .addPlugin('Unsupported')
            // .addPlugin('AnnotateItPermissions')
            // .addPlugin('Store', {
            //   prefix: 'http://annotateit.org/api',//'http://localhost:5000',
            //   loadFromSearch: {
            //     uri: chapter.currentChapter.href
            //   },
            //   annotationData: {
            //     uri: chapter.currentChapter.href
            //   }
            // });

      //         devAnnotator.plugins.Auth.withToken(function (tok) {
      //           console.log(tok);
      //         })

        // EPUBJS.core.addCss("../libs/annotator/css/annotator.css", false, chapter.doc.head);

        if(callback) callback();

        function annotate(){
            // EPUBJS.core.addCss("css/annotator.css", false, chapter.doc.head);

            var s = document.createElement("script");
            s.type = 'text/javascript';

            console.log(jQuery);
            var a = "jQuery.migrateTrace = false;";
            a += "console.log(document.getElementById('c001p0002').getBoundingClientRect());";

            a += "var content = $('body').annotator().annotator('setupPlugins', {}, {Filter:false});";

            //-- Use Local Server:

            a += "var content = $('body').annotator(),";
            a += "  server = '" + server + "';";
            a += "  path = '" + chapter.path + "';";

            a += " content.annotator('addPlugin', 'Store', {";
            // The endpoint of the store on your server.
            a += "  prefix: server,";

            // Attach the uri of the current page to all annotations to allow search.
            a += "  annotationData: {";
            a += "  'uri': path";
            a += "  }";

              // This will perform a search action rather than read when the plugin
              // loads. Will request the last 20 annotations for the current url.
              // eg. /store/endpoint/search?limit=20&uri=http://this/document/only
            a += ","
            a += "  loadFromSearch: {";
            a += "  'limit': 20,";
            a += "  'uri': path";
            a += "  }";
            a += "});";

            s.innerHTML = a;

            chapter.doc.body.appendChild(s);

            if(callback) callback();
        }



}

Answer 1

Just to close the loop on this, solution:

The file isn't an actual ePub, it is a "shell" for ingesting an ePub with ePub.js and then displaying it in a custom way...