Integration steps - GluedIn
Introduction
The GluedIn SDK simplifies the process of incorporating the Shorts in-app community platform seamlessly into your application. It offers a prebuilt UI SDK that comes equipped with comprehensive built-in business logic, providing developers with extensive customization options for the UI's appearance and functionality. With minimal effort, developers can even control the placement of buttons and achieve a tailor-made user experience.
On this page, we provide a concise guide on integrating a high-quality, low-latency short video community platform into your app while retaining full control over its customizable UI features.
Integration Steps to launch GluedInSDK
Step 1: Console setup and get Keys:
  • Follow onboarding steps on console
  • Create your project in the dashboard and get the API Key and Secret key.
  • Follow the steps on console and copy and use the API and secret key into your application.
Step 2: Integrate Dependency
  • Add/Replace below listed pods code inside your pod file, as shown below.
    • pod 'GluedInSDK', '~> 4.3.2'
    • pod 'Alamofire'(If required, and if you got a console error like – Frameworks/Alamofire.framework/Alamofire Symbol not found: _$s9Alamofire21URLRequestConvertibleP02asB010Foundation0B0VyKFTq)
  • Open terminal and add your unzip project folder (GluedInMarketerSample folder → GluedInMarketerSample →) in terminal directory
  • Execute the “pod install” command. All the necessary dependencies along with GludeIn GludeIn SDK will install in targeted projects.
  • Now go to GluedInQuickLaunchSample folder → GluedInQuickLaunchSample → GluedInQuickLaunchSample.xcworkspace
  • Open GluedInMarketerSample.xcworkspace into XCode as shown below:
Step 3: Entry Point Configuration We have multiple entry point options from where we can launch GluedIn SDK and GluedIn will behave differently will all of these different entry points.
1. Launch Gluedin Dashboard as a Guest user on Button click: call GluedIn Root tab view controller and initiate the navigation flow which is best fit for your application. We show sample code below:
				  
  @IBAction func launchGluedinTabAsGuest(_ sender: Any) {
        GluedIn.shared.initSdk {
            let gluedinTab:UITabBarController = GluedIn.shared.rootTabController() ?? UITabBarController()
            self.navigationController?.pushViewController(gluedinTab, animated: true)
        } failure: { error, code in
            print(error)
        }
    }
	
2. Launch GluedIn as a authenticated user: call to register the user method with multiple parameter and call the root controller once you get the call back from register user method. We show the sample code below:
				  
 @IBAction func registerUserAndlaunchGluedin(_ sender: Any) {
        GluedIn.shared.initSdk {
            GluedIn.shared.quickLaunch(email: "amitch184@gmail.com",
                                       password: "123456789",
                                       firebaseToken: "",
                                       deviceId: "1234",
                                       deviceType: "ios",
                                       fullName: "amit",
                                       autoCreate: true,
                                       termConditionAccepted: true) { [weak self] vw in
                guard let weakSelf = self else { return }
                weakSelf.navigationController?.pushViewController(vw ?? UIViewController(), animated: true)
            } failure: { err,arg  in
                print(err)
                print(arg)
            }
        } failure: { err,arg  in
            print(err)
            print(arg)
        }
    }
3. Launch GluedIn from Deeplink: follow the below steps, Register with firebase and create an app for iOS app (Add Firebase to your Apple project | Firebase for Apple platforms ). Add an associated domain, received from firebase console, under the associated domain in the "singing and capabilities" section. Refer below image as highlighted in red.
Steps 4: Project Configuration
Apply SDK custom color theme as per your app: you can change any theme color combination according to your product color theme. please go to “GluedIn Website Developer Page Structure | Apply theme in the app: “ section at left menu and see the more detail
Change the bottom bar configuration: Please follow “GluedIn Website Developer Page Structure | Bottom Bar Customization: “ link to see how you can customised SDK bottom bar. You can change the bottom bar title name along with Its image.
Multi Language Support in SDK: Please follow “GluedIn Website Developer Page Structure | MultiLanguage Support: “ instruction in left menu and see how you can apply multi language configuration with in your SDK.
Step 5: Feed Format and Callbacks:
We support two types of feed in GluedInSDK, 1) Vertical type and 2) Card Type to enable please follow below points:
  • Go to the App file → Open info.plist file
  • Please find or add “VERTICAL_FEED“ key inside the app info.plist file. This is Bool type of key so By default it will be False.
  • Make it False if wish the feed would launch as the square feed and change it to True if you wise the feed would launch as Vertical.
Call backs method:
Below are few CTA callbacks from the player.
		     
  func didSelectUnlike(videoAsset: FeedModel?) {}
  func didSelectShoppableProduct(feedModel: FeedModel?,
                  shoppableProduct: ShoppableProduct?) {}
  func didSelectProfile(feedModel: FeedModel?,
             profileId: String,
             navigationController: UINavigationController) {}
  func didSelectHashtag(feedModel: FeedModel?,
             hashtagName: String,
             hashtagId: String,
             navigationController: UINavigationController) {}
  func didSelectChallenge(feedModel: FeedModel?,
              challengeName: String,
              challengeId: String,
              navigationController: UINavigationController) {}
  func didSelectShare(feedModel: FeedModel?,
            shareType: ShareType,
            navigationController: UINavigationController?,
            completion: completionHandler?) -> () {}
  func didSelectBack(videoAsset: FeedModel?) {}
  func didScrolledToNextVideo(videoAsset: FeedModel?) {}
  func didScrolledToPreviousVideo(videoAsset: FeedModel?) {}
  func didVideoWatched(videoAsset: FeedModel?, currentDuration: Int64, totalDuration: Int64) {}
  func didMediaReady(videoAsset: FeedModel?) {}
  func onVideoRestarted(videoAsset: FeedModel?) {}
  func didVideoStarted(videoAsset: FeedModel?) {}
  
  func didSelectlike(videoAsset: FeedModel?) {}
  func didSelectComment(videoAsset: FeedModel?) {}
  func didVideoPlayPause(isPlaying: Bool?, videoAsset: FeedModel?) {}
  func didDoubleTap(videoAsset: FeedModel?) {}
  func didPlaybackCompleted(videoAsset: FeedModel?) {}
Step 6: Run the app:
After all these settings run the app and app should look like the below image based on UGC or PGC use case: