* added basic highlight adding support (no display yet)

* adjust some CSS settings in the versePopup

4 files changed, 127 insertions, 17 deletions

diff --git a/source/App.css b/source/App.css
index db42b4a..ef93c0c 100644
--- a/source/App.css
+++ b/source/App.css
@@ -61,7 +61,7 @@
 }
 
 .biblez-bc-popup {
-    height: 500px;
+    height: 480px;
     width: 495px;
 }
 
@@ -117,12 +117,24 @@
     padding: 10px;
 }
 
-.verse-popup {
+.color-button {
+    height: 30px;
+    width: 30px;
+    margin: 2px;
+}
 
+.color-container {
+    height: 40px;
+    padding-top: 5px;
+}
+
+.verse-popup {
+    height: 85px;
+    width: 255px;
 }
 
 .verse-popup-cell {
-    width: 100px;
+    width: 50%;
     text-align: center;
     padding: 5px;
 }
@@ -169,7 +181,7 @@ h3, h1 {
     max-width: 600px;
     margin-left: auto;
     margin-right: auto;
-    margin-top: 10px;
+    padding: 10px;
 }
 
 .settings-item {
diff --git a/source/api.js b/source/api.js
index 07f7306..ef5deac 100644
--- a/source/api.js
+++ b/source/api.js
@@ -7,22 +7,22 @@ var api = {
     noteStore: null,
     isHlInitialized: false,
     hlStore: null,
+    store: sword.dataMgr.getIDBWrapper(),
 
     //Wraps the initialization of the IndexedDB Wrapper function
     wrapper: function (inCallback) {
         //console.log("isInitialized...", this.isInitialized);
         if (this.isInitialized) {
-            inCallback(null, db);
+            inCallback(null, this.db);
         } else {
-            var store = sword.dataMgr.getIDBWrapper();
             var self = this;
-            db = new store({
+            this.db = new this.store({
                 storeName: "biblez",
                 dbVersion: 3,
                 onStoreReady: function() {
                     //console.log("isInitialized", self.isInitialized);
                     self.isInitialized = true;
-                    if(inCallback) inCallback(null, db);
+                    if(inCallback) inCallback(null, self.db);
                 },
                 onError: function(inError) {
                     self.isInitialized = false;
@@ -35,11 +35,10 @@ var api = {
     bmWrapper: function (inCallback) {
         //console.log("isInitialized...", this.isInitialized);
         if (this.isBmInitialized) {
-            inCallback(null, bmStore);
+            inCallback(null, this.bmStore);
         } else {
-            var store = sword.dataMgr.getIDBWrapper();
             var self = this;
-            bmStore = new store({
+            this.bmStore = new this.store({
                 storeName: "bookmarks",
                 keyPath: 'id',
                 autoIncrement: true,
@@ -47,7 +46,7 @@ var api = {
                 onStoreReady: function() {
                     //console.log("isInitialized", self.isInitialized);
                     self.isBmInitialized = true;
-                    if(inCallback) inCallback(null, bmStore);
+                    if(inCallback) inCallback(null, self.bmStore);
                 },
                 onError: function(inError) {
                     self.isBmInitialized = false;
@@ -57,8 +56,32 @@ var api = {
         }
     },
 
+    hlWrapper: function (inCallback) {
+        //console.log("isInitialized...", this.isHlInitialized);
+        if (this.isHlInitialized) {
+            inCallback(null, this.hlStore);
+        } else {
+            var self = this;
+            this.hlStore = new this.store({
+                storeName: "highlights",
+                keyPath: 'id',
+                autoIncrement: true,
+                dbVersion: 1,
+                onStoreReady: function() {
+                    self.isHlInitialized = true;
+                    if(inCallback) inCallback(null, self.hlStore);
+                },
+                onError: function(inError) {
+                    self.isHlInitialized = false;
+                    if(inCallback) inCallback(inError);
+                }
+            });
+        }
+    },
+
     //Put something in the ObjectStores
     _put: function (inDB, inObject, inCallback) {
+        //console.log("Put this:", inDB, inObject);
         inDB.put(inObject,
             function (inId) {
                 if(inCallback) inCallback(null, inId);
@@ -97,6 +120,27 @@ var api = {
         }));
     },
 
+    putHighlight: function (inObject, inCallback) {
+        this.hlWrapper(enyo.bind(this, function (inError, inDB) {
+            if(!inError)
+                this._put(inDB, inObject, enyo.bind(this, function(inError, inId) {
+                    if(!inError)
+                        this.get(inObject.osisRef, enyo.bind(this, function(inError, inOsisObject) {
+                            if(!inError) {
+                                if(inOsisObject === undefined)
+                                    inOsisObject = {id: inObject.osisRef};
+                                inOsisObject["highlightId"] = inId;
+                                this.put(inOsisObject, inCallback);
+                            } else
+                                inCallback(inError);
+                        }));
+                    else
+                        inCallback(inError);
+                }));
+            else inCallback(inError);
+        }));
+    },
+
     _get: function (inDB, inId, inCallback) {
         inDB.get(inId,
             function (inObject) {
@@ -108,6 +152,17 @@ var api = {
         );
     },
 
+    _getBatch: function (inDB, inIds, inCallback) {
+        inDB.getBatch(inIds,
+            function (inObject) {
+                if(inCallback) inCallback(null, inObject);
+            },
+            function (inError) {
+                if(inCallback) inCallback(inError);
+            }
+        );
+    },
+
     _getAll: function (inDB, inCallback) {
         inDB.getAll(
             function (inObject) {
@@ -147,6 +202,13 @@ var api = {
         }));
     },
 
+    getHighlights: function (inIds, inCallback) {
+        this.hlWrapper(enyo.bind(this, function (inError, inDB) {
+            if(!inError) this._getBatch(inDB, inIds, inCallback);
+            else inCallback(inError);
+        }));
+    },
+
     getUserData: function(inOsis, inVMax, inCallback) {
         var z=1,
             userData = {};
@@ -156,6 +218,8 @@ var api = {
                 if(!inError) {
                     if(inData && inData.bookmarkId)
                         userData[inData.id] = inData;
+                    if(inData && inData.highlightId)
+                        userData[inData.id] = inData;
                     if(z === inVMax) inCallback(null, userData);
                     else z++;
                 } else
diff --git a/source/main.js b/source/main.js
index f6b69aa..707f3cd 100644
--- a/source/main.js
+++ b/source/main.js
@@ -13,7 +13,7 @@ enyo.kind({
     },
     components:[
         {kind: "Signals", onOrientationChange: "handleOrientation"},
-        {kind: "biblez.versePopup", name: "versePopup", onBookmark: "handleBookmark"},
+        {kind: "biblez.versePopup", name: "versePopup", onBookmark: "handleBookmark", onHighlight: "handleHighlight"},
         //{kind: "Signals", onbeforeunload: "handleUnload"},
         {name: "messagePopup", kind: "onyx.Popup", centered: true, floating: true, classes: "message-popup"},
         {kind: "onyx.MoreToolbar", name: "topTB", components: [
@@ -210,7 +210,8 @@ enyo.kind({
     },
 
     handleUserData: function (inOsis) {
-        var vmax = this.currentModule.getVersesInChapter(inOsis);
+        var vmax = this.currentModule.getVersesInChapter(inOsis),
+            hlKeys = [];
         api.getUserData(inOsis, vmax, enyo.bind(this, function (inError, inUserData) {
             if(!inError) {
                 this.userData = inUserData;
@@ -218,7 +219,18 @@ enyo.kind({
                     if(inUserData[key].bookmarkId && !enyo.dom.byId("img"+key)) {
                         enyo.dom.byId(key).insertAdjacentHTML("beforeend", " <img id='img" + key + "' src='assets/bookmark.png' />");
                     }
+                    if(inUserData[key].highlightId) {
+                        hlKeys.push(inUserData[key].highlightId);
+                    }
                 });
+                if (hlKeys.length !== 0) {
+                    api.getHighlights(hlKeys, enyo.bind(this, function (inError, inHighlights) {
+                        if(!inError) {
+                            console.log(inHighlights);
+                        } else
+                            this.handleError(inError);
+                    }));
+                }
             }
         }));
 
@@ -232,6 +244,11 @@ enyo.kind({
         this.handleUserData(this.currentPassage.osis);
     },
 
+    handleHighlight: function (inSender, inEvent) {
+        console.log("Added Highlight");
+        this.handleUserData(this.currentPassage.osis);
+    },
+
     handleBcSelector: function (inSender, inEvent) {
         if(enyo.platform.firefox) {
             this.$.bcPopup.showAtEvent(inEvent);
diff --git a/source/popup.js b/source/popup.js
index 2cd6974..4cd7e00 100644
--- a/source/popup.js
+++ b/source/popup.js
@@ -21,9 +21,15 @@ enyo.kind({
                 {name: "bmLabel", content: $L("Bookmark"), classes: "verse-popup-cell cell-top-left", ontap: "handleBookmark"},
                 {name: "noteLabel", content: $L("Note"), classes: "verse-popup-cell cell-top-right", ontap: "handleNote"},
             ]},
-            {kind: "enyo.FittableColumns", components: [
-                {content: $L("Highlight"), classes: "verse-popup-cell", ontap: "handleHighlight"},
-                {content: $L("Copy&Share"), classes: "verse-popup-cell cell-bottom-right", ontap: "handleCopyShare"},
+            {kind: "enyo.FittableColumns", classes: "color-container", components: [
+                {kind: "onyx.Button", content: " ", ontap: "highlightVerse", classes: "color-button", color: "rgba(255,99,71,0.5)", style: "background-color: red;"},
+                {kind: "onyx.Button", content: " ", ontap: "highlightVerse", classes: "color-button", color: "rgba(255,255,0,0.5)", style: "background-color: yellow;"},
+                {kind: "onyx.Button", content: " ", ontap: "highlightVerse", classes: "color-button", color: "rgba(152,251,152,0.5)", style: "background-color: green;"},
+                {kind: "onyx.Button", content: " ", ontap: "highlightVerse", classes: "color-button", color: "rgba(238,130,238,0.5)", style: "background-color: violet;"},
+                {kind: "onyx.Button", caption: " ", ontap: "highlightVerse", classes: "color-button", color: "rgba(255,165,0,0.5)", style: "background-color: orange;"},
+                {kind: "onyx.IconButton", src: "assets/delete.png", ontap: "highlightVerse"}
+                //{content: $L("Highlight"), classes: "verse-popup-cell", ontap: "handleHighlight"},
+                //{content: $L("Copy&Share"), classes: "verse-popup-cell cell-bottom-right", ontap: "handleCopyShare"},
             ]}
         ]}
     ],
@@ -51,5 +57,16 @@ enyo.kind({
                 } else
                     console.log(inError);
             }));
+    },
+
+    highlightVerse: function (inSender, inEvent) {
+        this.hide();
+        api.putHighlight({osisRef: this.osisRef, color: inSender.color}, enyo.bind(this, function (inError, inId) {
+            if(!inError)
+                this.doHighlight();
+            else
+                console.log(inError);
+        }));
+
     }
 });
\ No newline at end of file