PLUG iOS Guide

Quick Start

Download latest version

https://github.com/naver/cafe-sdk-ios/releases/download/4.4.7/iOS-4.4.7.zipgithub.com

In order to use PLUG SDK, the development environment should be set up as follows from XCode.

1. Add the -ObjC option to Other Linker Flags in Build Settings.

2. Add the library that is included in the sample project to the project.

   • SDWebImage

   • FLAnimatedImage

   • Login with Naver ID

3. Add the following library to the Link Binary With Libraries in Build Phases. Set the status of the library to be added to required.

   • AVKit.framework

   • AVFoundation.framework

   • MobileCoreServices.framework

   • SystemConfiguration.framework

   • MediaPlayer.framework

   • AVFoundation.framework

   • CoreMedia.framework

   • AssetsLibrary.framework

   • Security.framework

   • ImageIO.framework

   • QuartzCore.framework

   • WebKit.framework

   • SafariServices.framework

   • ReplayKit.framework(set the status of the library to optional)

4. Add user authority option for Info.plist.

   • NSCameraUsageDescription

   • NSPhotoLibraryUsageDescription

3. Initialization

Initialize PLUG SDK according to the language that is being supported, as explained below.

3.1 PLUG SDK initialization (only supports Korean - Naver cafe)

When initializing PLUG SDK that only supports Korean, set the initialization settings like indicated below.

• Client ID and Client Secret received when registering an application on the login developer center using a Naver ID

• Cafe ID received by opening a Naver cafe

• URL scheme entered when registering an application on the login developer center using a Naver ID

• Parent view controller where the plugin will be applied

• Channel code (set to Korean when only Korean channels are being used)

    [[NCSDKManager getSharedInstance] setNaverLoginClientId:@"197CymaStozo7X5r2qR5"
                                     naverLoginClientSecret:@"evCgKH1kJL"
                                                     cafeId:28290504];
                                                     
    [[NCSDKLoginManager getSharedInstance] setNaverLoginURLScheme:@"gLinkSample"];
    
    [[NCSDKManager getSharedInstance] setParentViewController:self];
    
    [[NCSDKManager getSharedInstance] setChannelCode:KOREAN];

3.2 PLUG SDK initialization (only supports a foreign language)

When initializing PLUG SDK that only supports foreign languages, set the initialization setting like indicated below.

• consumerKey: Consumer key received by opening the community

• consumerSecretKey: Consumer secret key received by opening the community

• cummunityNo: Community No. received by opening the community

• loungeNo: Lounge No. received by opening the lounge

• Parent view controller where the plugin will be applied

    [[NCSDKManager getSharedInstance] setGlobalConsumerKey:@"PLUGTESTKEY"
                                      globalConsumerSecret:@"PLUGTESTSECRET" 
                                      globalCommunityNo:1
                                      globalLoungeNo:58];
                                              
    [[NCSDKManager getSharedInstance] setParentViewController:self];

4. Start PLUG SDK

Run PLUG SDK after initialization is complete.

4.1 presentMainViewController: Method

presentMainViewController: Method is used to start PLUG SDK. The following is an example of using the presentMainViewController: method.

[[NCSDKManager getSharedInstance] presentMainViewController];

NCSDKManager class NCSDKManager class is used to control PLUG SDK. Refer to “details for main functions,” in PLUG SDK's detailed guide, for details regarding the functions that can be controlled using NCSDKManager class.

4.2 Horizontal mode, vertical mode

PLUG SDK supports both horizontal and vertical modes. The following is an example of running PLUG SDK in horizontal mode.

[[NCSDKManager getSharedInstance] setOrientationIsLandscape:YES];

Use the Naver application when logging in with a Naver ID

Set for additional information, like indicated below, when using a Naver ID to log into the Naver application.

1.Register the URL scheme that you have entered when registering the application for Naver ID login on the project. 2. Set as indicated below to allow the Naver application login when initializing the plugin.

#import <NaverCafeSDK/NCSDKLoginManager.h>
[[NCSDKLoginManager getSharedInstance] setIsNaverAppOauthEnable:YES];

3. When logging in with a Naver ID is complete, set the App delegate as indicated below so that login information can be saved on the PLUG.

#import <NaverCafeSDK/NCSDKLoginManager.h>
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation { //로그인 정보를 네이버 아이디로 로그인 객체에 설정한다.
    return [[NCSDKLoginManager getSharedInstance] finishNaverLoginWithURL:url];
}

4. Add the setting below to the Info.plist file so that the Naver application can be opened.

<key>LSApplicationQueriesSchemes</key>
<array>
    <string>naversearchapp</string>
    <string>naversearchthirdlogin</string>
</array>

Default channel language settings

Settings for the default channel, which is the community for each language on the PLUG, is applied with the language that is set on the device. If you wish to change the settings on a default channel to a certain language, use the setChannelCode: method.

The following is an example for setting the default channel to Korean.

   /**
     * ChannelCode : text string in NCSDKLanguage.h
     */
    [[NCSDKManager getSharedInstance] setChannelCode:KOREAN];
}

Initialization of a PLUG that supports the global community and a domestic Naver cafe

If it supports both the global community and a domestic Naver cafe, initialization should be set on the PLUG that supports the global community and a domestic Naver cafe.

Files and Folders

Folder and file name	Description
guide/	Folder where the PLUG SDK guide is located
lib/	Folder where the iOS PLUG SDK library file is located
sample/external-lib	Folder where the external library file is located
sample/navercafesdk-sample-ios	Folder where the Xcode sample project is located
LICENSE	License file
README.md	Readme file

Dependent Libraries

• In order to use PLUG SDK, the library should be added to the project to be built. The library is included in the sample project. Naver ID login (4.0.7 version)

• AFNetworking(3.1.0 version)

  • Both the AFNetworking 2.x and 3.x versions can be used. PLUG SDK test has been carried out on AFNetworking 3.1.0 version.SDWebImage(3.8.2 version)

• FLAnimatedImage-(1.0.12 version)

• ApiGateway-1.5.0

Start / Close PLUG

Start or close the PLUG while a certain tab is selected.

presentMainViewController: Method

Run the PLUG.

(void)presentMainViewController;

The following is an example of using the presentMainViewController: method.

/*
 Run the PLUG
 */
[[NCSDKManager getSharedInstance] presentMainViewController];

presentMainViewControllerWithTabIndex: Method

Start the PLUG while a certain tab is selected.

(void)presentMainViewControllerWithTabIndex:(NSUInteger)tabIndex;

The following is an example of using the presentMainViewControllerWithTabIndex: method.

typedef NS_ENUM(NSUInteger, GLTabType) {
    kGLTabTypeHome = 0,
    kGLTabTypeNotice = 1,
    kGLTabTypeEvent = 2,
    kGLTabTypeMenuList = 3,
    kGLTabTypeProfile = 4,
};
/*
 Run using Naver cafe main TabIndex
 */

[[NCSDKManager getSharedInstance] presentMainViewControllerWithTabIndex:kGLTabTypeNotice];

[[NCSDKManager getSharedInstance] presentMainViewControllerWithTabIndex:kGLTabTypeEvent];

[[NCSDKManager getSharedInstance] presentMainViewControllerWithTabIndex:kGLTabTypeMenuList];

[[NCSDKManager getSharedInstance] presentMainViewControllerWithTabIndex:kGLTabTypeProfile];

presentMainViewControllerWithArticleId: Method

Start the PLUG while a certain post is shown in the bulletin board tab.

(void)presentMainViewControllerWithArticleId:(NSUInteger)articleId;

The following is an example of using the presentMainViewControllerWithArticleId: method.

/*
 Move to Naver cafe posts
 */
[[NCSDKManager getSharedInstance] presentMainViewControllerWithArticleId:36];

presentArticlePostViewControllerWithType: Method

Start the PLUG by writing a post on a bulletin board screen with an image or video file attached.

(void)presentArticlePostViewControllerWithType:(GLArticlePostType)type filePath:(NSString *)filePath;

The following is an example of using the presentArticlePostViewControllerWithType: method.

typedef NS_ENUM(NSUInteger, GLArticlePostType) {
    kGLArticlePostTypeImage = 1,
    kGLArticlePostTypeVideo = 2,
};
...
// Attach image
[[NCSDKManager getSharedInstance] presentArticlePostViewControllerWithType:kGLArticlePostTypeImage filePath:@""];
// Attach video
[[NCSDKManager getSharedInstance] presentArticlePostViewControllerWithType: kGLArticlePostTypeVideo filePath:@""];

dismissMainViewController: Method

Close the PLUG.

(void)dismissMainViewController;

The following is an example of using the dismissMainViewController: method.

/*
Close PLUG
 */
[[NCSDKManager getSharedInstance] dismissMainViewController];

Horizontal mode, vertical mode

The PLUG supports both horizontal and vertical modes.

The following is an example of using the horizontal mode on the PLUG.

// The default value is Yes
// Horizontal mode
[[NCSDKManager getSharedInstance] setOrientationIsLandscape:YES];

The following is an example of using the vertical mode on the PLUG.

// Vertical mode
[[NCSDKManager getSharedInstance] setOrientationIsLandscape:NO];

Adjust transparency

If you adjust transparency using the adjustment slider on the upper left side of the PLUG screen, you can use the game and the cafe at the same time.

transparency	Description
Alpha value 100%	deliver touch events to the PLUG
Alpha value 100% below	deliver touch events to the game

You can enable the transparency adjustment slider using the disableTransparentSlider: method.

(void)disableTransparentSlider:(BOOL)disable;

If you set YES as the disable parameter value, you can use the transparency adjustment slider (default value: YES).

The following is an example of using the transparency adjustment slider.

/*
 You can set whether or not to use the transparency adjustment slider.
 */
// Use the transparency function
[[NCSDKManager getSharedInstance] disableTransparentSlider:YES];

The following is an example of not using the transparency adjustment slider.

// Remove the transparency function
[[NCSDKManager getSharedInstance] disableTransparentSlider:NO];

Widget

A widget is an element that is automatically displayed on the screen when the fold button is pressed on the PLUG. You can use the PLUG anywhere in the game by using a widget.

Widget display

You can set the showWidgetWhenUnloadSDK properties for displaying the widget when the fold button is pressed on the PLUG.

@property (nonatomic, assign) BOOL showWidgetWhenUnloadSDK;

If you set the showWidgetWhenUnloadSDK property value as YES, the widget will be displayed when the PLUG window is folded (default value: YES).

The following is an example of displaying the widget.

  /**
   * You can decide whether or not to display the widget when the PLUG window is folded.
   */
[NCSDKManager getSharedInstance].showWidgetWhenUnloadSDK = YES;

Run widget

In order to run the widget, use the startWidget: method.

(void)startWidget;

The following is an example of running the widget.

  /**
   *  Run the widget.
   */
[[NCSDKManager getSharedInstance] startWidget];

Close widget

To close the widget: use the stopWidget: method.

(void)stopWidget;

  /**
   * Close the widget.
   */
[[NCSDKManager getSharedInstance] stopWidget];

Default position settings for the widget

When the widget is first run, it is displayed on the center-left part of the screen. If you wish to set the default position setting when the widget is first run, use the setWidgetStartPosition: method and andY: method.

However, when the widget is run again after the user has moved the widget, the widget will be displayed in the position where the user last moved it.

- (void)setWidgetStartPosition:(BOOL)isLeft andY:(NSInteger)y;

The following is an example for setting the widget's default position to 20% from top, on the right side of the screen.

  /**
   * isLeft: If the value is YES, it is displayed on the left. If the value is NO, it is displayed on the right.
   * y: You can designate the vertical position using %.
   */
[[NCSDKManager getSharedInstance] setWidgetStartPosition:NO andY:20];

Screen capture

You can capture the game screen by pressing the screen capture button on the widget.

Screen capture button

The screen capture function is applied using the ncSDKWidgetPostArticleWithImage method.

(void)ncSDKWidgetPostArticleWithImage;

The following is an example of registering a delegate to call for the ncSDKWidgetPostArticleWithImage method when users press the screen capture button on the widget.

...
[[NCSDKManager getSharedInstance] setNcSDKDelegate:self];
...
- (void)ncSDKWidgetPostArticleWithImage {
    NSLog(@"screen capture request");
}

Screen capture settings

You can set the useWidgetScreenShot properties to enable the screen capture function.

@property (nonatomic, assign) BOOL useWidgetScreenShot;

If you set the useWidgetScreenShot properties value as YES, the screen capture button will be displayed on the widget (default value: YES).

  /**
   * You can decide whether or not to use the screen capture function.

   */
[NCSDKManager getSharedInstance].useWidgetScreenShot = YES;

Video recording

If you press the video recording button on the widget, you can record the game screen.

Video recording settings

You can set the useWidgetVideoRecord properties to enable the video recording function.

@property (nonatomic, assign) BOOL useWidgetVideoRecord;

If you set the use parameter value as YES, the video recording button will be displayed on the widget (default value: NO).

  /**
   * You can decide whether or not to use the video recording function.
   */
[NCSDKManager getSharedInstance].useWidgetVideoRecord = YES;

End recording processing

Tasks that should be processed when video recording has ended are carried out with the ncSDKWidgetSuccessVideoRecord method.

(void)ncSDKWidgetSuccessVideoRecord;

The following is an example of registering a delegate to call the ncSDKWidgetSuccessVideoRecord method when users press the video recording button to end video recording.

...
[[NCSDKManager getSharedInstance] setNcSDKDelegate:self];
...
- (void)ncSDKWidgetSuccessVideoRecord {
    NSLog(@"video recording ended");
}

Video recording

If you press the video recording button, you can record the game screen while playing the game.

• Video recording functionality is supported on iOS 9.0 or above.

Use the video recording function on the widget

If you press the video recording button on the widget, you can record the game screen while playing the game.

You can set the useWidgetVideoRecord properties to enable the video recording function.

@property (nonatomic, assign) BOOL useWidgetVideoRecord;

If you set the use parameter value as YES, the video recording button will be displayed on the widget (default value: NO).

The video recording button is not displayed on widgets on devices using iOS 9.0 or below, even if you set the useWidgetVideoRecord properties value as YES.

The following is an example of using the video recording function.

  /**
   *  You can decide whether or not to use the video recording function.

   */
[NCSDKManager getSharedInstance].useWidgetVideoRecord = YES;

Recording ended delegate

Tasks that should be processed when video recording has ended are carried out with the ncSDKWidgetSuccessVideoRecord method.

(void)ncSDKWidgetSuccessVideoRecord;

The following is an example of registering a delegate to call the ncSDKWidgetSuccessVideoRecord method when users press the video recording button to end video recording.

...
[[NCSDKManager getSharedInstance] setNcSDKDelegate:self];
...
- (void)ncSDKWidgetSuccessVideoRecord {
    NSLog(@"video recording complete");
}

Use the video recording function on the game

You can run the video recording button from the game developer to record the game screen.

• The code for starting / ending video recording is included in the NCSDKRecordManager.h file.

Start / Stop video recording

Use the startRecord method to start video recording.

/*
 Use the startRecord method to start video recording.
 */
[[NCSDKRecordManager getSharedInstance] startRecord];

Use the stopRecord method to end video recording.

/*
Stop video recording.
 */

[[NCSDKRecordManager getSharedInstance] stopRecord];

Video recording delegate

The callback delegate that processes events that have occurred while using the game developer's video recording button is described below.

#pragma mark – NCSDKRecordManagerDelegate

// Start video recording
- (void)ncSDKRecordStart {
   NSLog(@"start recording.");
}

// An error occurred while video recording
- (void)ncSDKRecordError:(NSString *)errorMsg {
   NSLog(@"ERROR : %@",errorMsg);
}

// Stop video recording
- (void)ncSDKRecordFinish {
   NSLog(@"Video recording ended");
}

// Close the preview window for a recorded video
- (void)ncSDKRecordFinishWithPreview {
   NSLog(@"PreviewController is close.");
}

App scheme processing

When you press the banner image that is displayed on the home screen of the game PLUG, you can go to the App scheme to run game functions.

You can register the banner image for moving to the App scheme from the cafe management menu.

When a pressing banner image that goes to the App scheme, run the openURL: method on the App delegate to process the App scheme like indicated below.

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation {
// Process the App scheme that is registered on the management menu with the App delegate.
//ex : gLinkSample://test
    if ([[url scheme] isEqualToString:@"gLinkSample"]) {
        if ([[url host] isEqualToString:@"test"]) {
            //todo
        }
    }
}

The following is an example of using a listener to process the App scheme.

#pragma mark - NCSDKManagerDeleagte

- (void)ncSDKAppSchemeBanner:(NSString *)appScheme {
     NSLog(@"App Scheme : %@", appScheme);
}

Callback delegate

Set a callback delegate to process events that have occurred in the PLUG.

Register a callback delegate

Register a view controller that registers the callback delegate in the NCSDKManager class.

@interface ViewController () <NCSDKManagerDelegate>
...
[[NCSDKManager getSharedInstance] setNcSDKDelegate:self];
...

Use a callback delegate

The method that is called using a callback delegate when an event has occurred in the PLUG is indicated below.

#pragma mark – NCSDKManagerDelegate
// Run the PLUG
- (void)ncSDKViewDidLoad {
    NSLog(@"플러그 실행");
}
// Close PLUG
- (void)ncSDKViewDidUnLoad {
    NSLog(@"플러그 종료");
}
// Join cafe
- (void)ncSDKJoinedCafeMember {
    NSLog(@"카페 가입 완료");
}
// Register post
- (void)ncSDKPostedArticleAtMenu:(NSInteger)menuId
                attachImageCount:(NSInteger)imageCount
                attachVideoCount:(NSInteger)videoCount {
    NSLog(@"글쓰기 완료, 게시판 아이디[%@]", @(menuId));
}
// Register comment
- (void)ncSDKPostedCommentAtArticle:(NSInteger)articleId {
    NSLog(@"댓글 쓰기 완료, 게시글 아이디[%@]", @(articleId));
}
// Screenshot
- (void)ncSDKRequestScreenShot {
    NSLog(@"스크린숏");    
}
// Voting ended
- (void)ncSDKDidVoteAtArticle:(NSInteger)articleId {
    NSLog(@"투표 완료, 게시글 아이디[%@]", @(articleId));
}

// Touch the widget screen capture button
- (void)ncSDKWidgetPostArticleWithImage {
    NSLog(@"위젯 화면 캡처");
}
// Recording ended
- (void)ncSDKWidgetSuccessVideoRecord {
    NSLog(@"위젯 동영상 녹화 완료");
}

Game ID linkage

By linking the user’s game ID and cafe ID, they can be managed. You can check for the list of linked game ID and cafe IDs from cafe management menu.

In order to link a game ID and cafe ID, the syncGameUserId() method should be used.

(void)syncGameUserId:(NSString *)gameUserId;

The following is an example of linking the game ID and cafe ID.

/*
 Link the game ID and cafe ID.
 */
[[NCSDKManager getSharedInstance] syncGameUserId:@"usergameid"];

Change theme color

You can change the theme color of the PLUG.

In order to change the theme color, use the setThemeColor: method and TabBackgroundColor: method.

/** 
* The default value for the themeColorCSSString parameter is ‘#00c73c.’
 * The default value for backgroundCSSString parameter is ‘#44484e.’
 * It is recommended that you use the default value for the backgroundCSSString parameter.
**/

- (void)setThemeColor:(NSString *)themeColorCSSString;
- (void)setThemeColor:(NSString *)themeColorCSSString andTabBackgroundColor:(NSString *)backgroundCSSString;

• themeColorCSSString: The default color that is used on the theme (default value: #00c73c)

• backgroundCSSString: the background color for the tab menu (default value: #44484e). It is recommended that you use the default value.

Caution Do not apply alpha values for the CSS color value.

• Correct example: #ff9800

• Incorrect example: #e2ff9800

The following is an example of changing the theme color.

[[NCSDKManager getSharedInstance] setThemeColor:@"#00c73c"];
[[NCSDKManager getSharedInstance] setThemeColor:@"#00c73c" andTabBackgroundColor:@"#44484E"];

Change resource image

The resource image that is included in Naver cafe PLUG library can be changed as indicated below.

1. Change the image in the NaverCafeSDK.bundle package to the desired image.

2. Apply the new package to the Naver cafe PLUG library and build the project.

Caution When changing the image, the new image's size should be identical with the previous image.