// First import the library to your class file.
import JonContextMenu

// Create an array of type "JonItem" for the items you desire to show.
// "JonItem" constructor takes an id to identify the object, a String to be the title of the item and 
// an UIImage to be the icon of the item.
let items = [JonItem(id: 1, title: "Google"   , icon: UIImage(named:"google")),
             JonItem(id: 2, title: "Twitter"  , icon: UIImage(named:"twitter")),
             JonItem(id: 3, title: "Facebook" , icon: UIImage(named:"facebook")),
             JonItem(id: 4, title: "Instagram", icon: UIImage(named:"instagram"))]

JonItem(id: 1, title: "Google", icon: UIImage(named:"google", data: <<SOMEOBJECT>>)

// Then, create an instance of JonContextMenu setting your array to it.
let contextMenu = JonContextMenu().setItems(options).build()

// Finally, add the "contextMenu" to the view you wish.
<<YOURVIEW>>.addGestureRecognizer(contextMenu)

// Implement the JonContextMenuDelegate to your ViewController 
class ViewController:JonContextMenuDelegate{

    func menuOpened(){
      // Called when the JonContextMenu opens
    }
    func menuClosed(){
      // Called when the JonContextMenu closes
    }
    func menuItemWasSelected(item:JonItem){
      // Called when the user selects one of the items
    }
    func menuItemWasActivated(item:JonItem){
      // Called when the user interacts with one of the items
    }
    func menuItemWasDeactivated(item:JonItem){
      // Called when the user stops interacting with one of the items
    }
}

// Then, when creating an instance of JonContextMenu, set the delegate.
let contextMenu = JonContextMenu()
                  .setItems(options)
                  .setDelegate(self)
                  .build()

JonContextMenu()

// The number of items to be displayed, it can be up to 8 items.
.setItems(options)

// The delegate to notify when an item is selected.
.setDelegate(self)

// The background colour of the view. The default colour is white and the default alpha is 0.9
.setBackgroundColorTo(.white, withAlpha: 0.5)

// The idle colour of the items(when there is no interaction). The default colour is white
.setItemsDefaultColorTo(.black)

// The idle colour of the items' icon(when there is no interaction).  There is no deafault colour. 
// If you don't set it, the icon will have no tint colour and will display the original image's colour
.setIconsDefaultColorTo(.white)

// The active colour of the items(when there is interaction). The default colour is darkRed
.setItemsActiveColorTo(.white)

// The active colour of the items' icon(when there is interaction). There is no deafault colour. 
// If you don't set it, the icon will have no tint colour and will display the original image's colour
.setIconsActiveColorTo(.black)

// The colour of the title of the items. The default colour is darkGray
.setItemsTitleColorTo(.black)

// The size of the title of the items. The default size is 72
.setItemsTitleSizeTo(50)

// The colour of touch point circle. The default colour is darkGray
.setTouchPointColorTo(.black)