CafeSync: Notes and Encryption

Repository

https://github.com/OpenSeedINC/CafeSync

In the last few updates I have been focusing on users actions beyond card collection and transmission. The updates in this cycle are continuing in that direction.

New Features

Contact Actions

Once a user has saved a contact the extra options appear in the home page of the contact's card. Shown above you have the ability to set your "Relationship" (Used for future event creation) Git Issue #88 with the contact, which will be used in future features. As well as four quick options to add functionality to the page. From top left to bottom right: See all events between you and the contact, create new event with contact, view and write notes about contact, and view stats about your interactions with the contact. The options are 'greyed' out if they is no applicable information under that option.

Implementation

Pull Request : 108 , 111

Largely a cosmetic change the new contact actions are found under the Home.qml file. Though rather straight forward I took the opportunity to create a element for circular buttons. The qml file for the element has been in the repository for a while, but is now being refined to replace all circular buttons within the interface. The element is called CircleIndicator.qml( code reference ) if you would like to see how the item is created.

Along with the usual interface additions the relationship variable is saved and retrieved using functions found in main.js code reference. The logically named the save_contact_info saves the data to the local database. Likewise the get_contact_info returns the requested value from the database if available. Unlike profile settings we use an auto save option for the relationship SpinBox. This way the end user isn't bothered with a dialog that is otherwise unnecessary.

AutoSave snippet:

onValueChanged: Scripts.save_contact_info(currentcard_thecard,value,"relation");

Where 'current_thecard' is the current card shown, 'value' is the value currently displayed in the spinbox, and 'relation' is a unique identifier for the database to store the data under.

The grid buttons to the right of the relationship SpinBox call other functions and interface options. The event creation button is called with the code snippet below:

  CircleIndicator {
              width:parent.width * 0.40
              height:parent.width * 0.40
               fillColor: highLightColor1
               icon:"./icons/calendar-today.svg"
                //enabled: false
                MouseArea {
                      anchors.fill: parent
                      onClicked: {eventEdit.iswith = currentcard_thecard;eventEdit.state ="Active";}
                      }

}

In this update I added the iswith variable which informs the event editor to add the contact you are viewing to the list of invites to the event. It also adds the "Width Name" area to the title of the element which is just a nice touch.

Like wise the notes interface is launched from

CircleIndicator {
         width:parent.width * 0.40
          height:parent.width * 0.40
          fillColor: highLightColor1
           icon:"./icons/edit-text.svg"

            MouseArea {
                  anchors.fill: parent
                  onClicked: {notes.state = "Active"}
            }

}

Home.qml code changes: full reference
main.js code changes: full reference

Notes

Once a users has saved a card to their contacts it is important that they keep track of various aspects of the relationship, what kind of drinks do they like, name of people that are important to them, projects they're working on, etc. It is also helpful to remember what you wanted to talk to them about at an event, or in chance meetings, or phone calls. Our note implementation aims to tackle all those things.

Implementation

Pull Request : 108 , 111

Like all interfaces we have a Notes.qml file for the layout and a notes.js file that contains the logic. However for the Notes interface we also use the encryption.js file to encrypt and decrypt the messages found within notes. Because most note taking interfaces are the same I would like to highlight key points within the interface and logic that may be of interest.

NOTE: Secret is what I import the encryption.js file as.

Per user encryption:

 onStateChanged: if(state == "Active") {key = Secret.genkey(devId,"note",currentcard_thecard); Notes.get_notes(currentcard_thecard);}

Here we feed the genkey function the options needed to create a key for the notes for the current contact. genkey checks to see if there is already a key created for the user and if so returns that instead of creating a new key. The key generation takes several seconds so after the initial creation the Note interface calls Notes.get_notes() which is found in notes.js.

On need decryption:

 Text {
          anchors.left: parent.left
           wrapMode: Text.WordWrap
           maximumLineCount: 2
           width:parent.width
          elide: Text.ElideRight
           text: Secret.decrypt(key,summary)
           color:fontColor
           height:parent.height * 0.33
}

The data is encrypted both locally and remotely, and is only decrypted when it is time to read. Once the data is no longer visible its flushed during garbage collection stage.

At save Encryption:

CircleIndicator {
        anchors.right:parent.right
        anchors.bottom:parent.bottom
        anchors.margins: mainView.width * 0.04
        width:parent.width * 0.08
        height:parent.width * 0.08
        icon:"./icons/check.svg"
        fillColor: highLightColor1

    MouseArea {
        anchors.fill: parent
        onClicked: {

                Notes.save_note(currentcard_thecard,Secret.encrypt(key,noteTitleField.text),Secret.encrypt(key,notebody.text),nN.noteOrigin);
            nN.noteSelected = "";
            //notebody.focus = false;
            editing = false;


        }
    }

    }

Whether a new file or an update the, data is encrypted with a unique value, adding just one more layer of security.

In notes.js the functions are all very straight forward and follow the logical progression of Get, Save, Send, Update,Sync, Delete. However I have refined my remote syncing setup for OpenSeed's narratives api to be a little less bandwidth hungry. By simply adding a check function to the list of API calls it sends only a few bytes of data to the client. If the clients data doesn't line up with the servers the client then asks for the full data set. Reference

Notes.qml: Full Reference
notes.js: Full Reference

Encryption

We must always assume someone wants to know what we're saying or doing, even if what we are doing is mundane it doesn't give the rights for others to look at the data without our consent. This is the beginning of the attempt to make it just that much more annoying to get to the most likely pointless data about a person.

Implementation

Pull Request : 108 , 111

Found in the encryption.js file the encryption setup is key based where each interface that requires a key can generate their own for that specific task and contact. The key is then stored locally and if lost will render all its encrypted data useless.

When data needs to be encrypted the key is used as a salt randomly mixed in with the random message based on the Math.random function. Once successfully mixed various letter and number substitutions happen creating a completely new string of a randomly defined length.

The new data is then returned to whatever function called the encryption algorithm.

Both the Key and the Encrypt functions require local only data that can not be known by the server, this should add to the amount of time anyone without the key would need to crack the code.

Decryption is handled much like all decryption functions. We take the key, which will get us closer to the original and using similar but reverse loops we are able to get back to the original message.

encryption.js: Full Reference

Find out more

Curious about CafeSync and what it does? Check out my other posts here on Utopian and/or SteemIt
Downloads

Android Version

GitHub Account

https://github.com/bflanagin