flutter_conscent_plugin 0.1.1

This is a step by step guide for managing Conscent Plugin and its related subclasses. This guide helps the users with step by step procedures to integrate Conscent features in their app..

Conscent Plugin

This is a step by step guide for managing Conscent Plugin and its related subclasses. This guide helps the users with step by step procedures to integrate Conscent features in their app.

Purpose of this guide

This is a step by step guide to include Conscent plugin in your app. This plugin is developed in Flutter and supports both Android and iOS devices.

1. Default Paywall:

Default paywall can contain up to 3 CTAs with the flexibilty to display any of the CTAa at a time over the paywall. Is has three options to offer:
(a) Pass: - (b) Micropayment: - (c) Subscription:-

All the enabling and disabling of the CTAs can be done through the Client Dashboard.

2. Embedded Paywall:

this is a direct access to subscription over the given pawall and the reduces the steps to purchase a subscription as compared to the default paywall. In this paywall all the subscription appear up front with there respective tiers making the subscription selection a process to be a easier.

Getting started of Paywall

In your sample project class, pass client_id and Environment Mode to be used in your app as below sample project (a) contentID:- This will be your article or content id for which detail needs to be checked. (b) Client ID:- Pass your client_id received from Conscent.

Requirements

The following requirements must be set up before installing Conscentplugin Flutter SDK.

• Flutter version 2.10.0 and above
• Dart SDK version 2.16.2 and above
• Android Gradle Plugin 4.0.0
• Gradle 6.1.1+
• AndroidX
• Java 8+ and Kotlin
• iOS 12+
• Swift 5+

Installation

To use Conscentplugin SDK in your Flutter app, follow these steps:

Add Conscentplugin as a dependency in your pubspec.yamlfile.

dependencies:

• flutter_conscent_plugin: ^0.0.1 Install dependency.
• flutter pub get

Configuring SDK

Prerequisites Before configuring the Conscentplugin Flutter SDK for syncing In-App Purchases, follow these steps.

• iOS: Integrate the Apple App Store account with your Conscentplugin site.
• Android: Integrate Google Play Store account with your Conscentplugin site.
• iOS: On theSync Overview pageof theweb app, click View Keys and use the value of generated

Android: On the Sync Overview page of the web app, click Set up notifications and use the generated App ID value as the SDK Key.
On the Conscentplugin site, navigate to Configure Conscentplugin > API Keys to create a new Publishable API Key or use an existing Publishable API Key.
Note: During the publishable API key creation you must allow read-only access to plans/items otherwise this key will not work in the following snippet. Read more.

Initialize the Conscentplugin Flutter SDK with your Conscentplugin site, Publishable API Key, and SDK Keys by including the following snippets in your app delegate during app startup.

import 'package:flutter_conscent_plugin/flutter_conscent_plugin.dart';
try {
  await Conscentplugin.configure("SITE_NAME", "API-KEY", "iOS SDK Key", "Android SDK Key");
} on PlatformException catch (error) {
  log('PlatformException : ${error.message}');
}

Integrating In-App Purchases This section describes how to use the SDK to integrate In-App Purchase information. For details on In-App Purchase, read more.

Retrieve the IAP Product objects with Product IDs using the following function.

try {
  List<Product> products = await Conscentplugin.retrieveProducts({productList: "[Product ID's from Google or Apple]"});
} catch (error) {
  print(error);
}

Usage of Paywall:-

Particular Content to show a paywall in a particular paid Content.Conscent CallBack Reference: You can pass a callbackReference which will get called after success or failure in processing. If you pass a callbackReference, after successfull processing, the success reference will be called and for failed event, failure event will be called. You can implement ConscentCallBack in your activity and then pass it as a reference.

Dependencies of paywall :-

1. webView:- A Flutter plugin that provides a WebView widget. On iOS the WebView widget is backed by a WKWebView. On Android the WebView widget is backed by a WebView.A Flutter plugin that provides a WebView widget.

• On iOS the WebView widget is backed by a WKWebView.
• On Android the WebView widget is backed by a WebView.

Android iOS Support SDK 19+ or 20+ 9.0+

Add webview_flutter as a dependency in your pubspec.yaml file.

You can now display a WebView by: Instantiating a WebViewController.

• More info at: https://pub.dev/packages/webview_flutter

to /example folder.

    Widget build(BuildContext context) {
 
    return Scaffold(
      appBar: AppBar(
        title: const Text('Conscent'),
      ),
     WebView(
              initialUrl:
                  'https://conscent.netlify.app/overlay?clientId=${ConscentInitializer.mClientId}&clientContentId=${ConscentInitializer.mContentId}&loginChallenge=$loginId',
              javascriptMode: JavascriptMode.unrestricted,
              onProgress: (int progress) async {
                javascriptChannels:
                <JavascriptChannel>{_javascriptChannel()};
                print('WebView is loading (progress : $progress%)');
              }
              onWebViewCreated: (controller) {
                print('---onWebViewCreated----${controller.currentUrl()}');
             )}

2. shared_preferences: - To use this plugin, add shared_preferences as a dependency in your pubspec.yaml file.

• Wraps platform-specific persistent storage for simple data (NSUserDefaults on iOS and macOS, SharedPreferences on Android, etc.).

• Data may be persisted to disk asynchronously, and there is no guarantee that writes will be persisted to disk after returning, so this plugin must not be used for storing critical data.

• Supported data types are int, double, bool, String and List

• More info at: https://pub.dev/packages/shared_preferences

Examples Here are small examples that show you how to use the API.

to /example folder.

Future<String?>? getClientId() async {
    final prefs = await SharedPreferences.getInstance();
    return prefs.getString(CLIENT_ID);
  }

  Future<Future<bool>> setClientId(String clientId) async {
    final prefs = await SharedPreferences.getInstance();
    return prefs.setString(CLIENT_ID, clientId);
  }

3. uuid:- If all you want is a unique ID, you should probably call uuid1() or uuid4(). Note that uuid1() may compromise privacy since it creates a UUID containing the computer’s network address. uuid4() creates a random UUID.

Generate RFC4122 version 1, version 4, or version 5 UUIDs

• Runs in web, server, and flutter
• Cryptographically strong random number generation on all platforms
• Defaults to non-crypto generator, see UuidUtil for cryptoRNG
• More info at: https://pub.dev/packages/uuid

to /example folder.

 var uuid = '${DateTime.now().millisecondsSinceEpoch.toString()}${Uuid()}';

4. http :- A composable, Future-based library for making HTTP requests.This package contains a set of high-level functions and classes that make it easy to consume HTTP resources. It's multi-platform, and supports mobile, desktop, and the browser.

• A composable, Future-based library for making HTTP requests.

• This package contains a set of high-level functions and classes that make it easy to consume HTTP resources.

• It's multi-platform, and supports mobile, desktop, and the browser.

• More info at: https://pub.dev/packages/http

Future<GetUserDetail> getPst() async {
    var client = http.Client();
    var uri = Uri.parse(
        '$http://google.com');
    var response = await client.get(uri);
    if (response.statusCode == 200) {
      var json = response.body;
      return getUserDetailFromJson(json);
    } else {
      throw Exception('Failed to create album.');
    }
  }
  

Get

• GetX is an extra-light and powerful solution for Flutter. It combines high-performance state management, intelligent dependency injection, and route management quickly and practically.
• GetX has 3 basic principles. This means that these are the priority for all resources in the library: PRODUCTIVITY, PERFORMANCE AND ORGANIZATION.
• More info at: https://pub.dev/packages/get

flutter_pulltorefresh

• a widget provided to the flutter scroll component drop-down refresh and pull up load.support android and ios. If you are Chinese,click here(中文文档)
• More info at: https://pub.dev/packages/pull_to_refresh

Liquid Pull To Refresh

• A beautiful and custom refresh indicator for flutter highly inspired from Ramotion Pull Down to Refresh. Try out our live example app.
• More info at: https://pub.dev/packages/liquid_pull_to_refresh

device_info

• Get current device information from within the Flutter application.
• More info at: https://pub.dev/packages/device_info

fk_user_agent

• Retrieve Android/iOS device user agents in Flutter.
• More info at: https://pub.dev/packages/fk_user_agent

intl

• Provides internationalization and localization facilities, including message translation, plurals and genders, date/number formatting and parsing, and bidirectional text.
• More info at: https://pub.dev/packages/intl

FutureBuilder<ContentAccessModel?>(
                future: getLoginChallengeId(),
                builder: (context, snapshot) {
                  var responseDttta = snapshot.data;
                  print(responseDttta?.signature);
                  if (snapshot.hasData) {
                    return Center(
                      child: Column(
                        children: [
                          responseDttta?.signature == null
                              ? Padding(
                                  padding: EdgeInsets.all(20.0),
                                  child: Text(
                                    'Early use Scientists are still debating when people started wearing clothes. ',
                                    maxLines: showContent ? null : 4,
                                  ),
                                )
                              : SizedBox.shrink(),
                          showContent
                              ? Container()
                              : Expanded(
                                  flex: 2,
                                  // child: MyApppp((response)
                                  child: responseDttta?.signature != null
                                      ? Center(
                                          child: Text(
                                              'Early use Scientists are still debating when people started wearing clothes'.
                                        )
                                      : MyApppp((response) {
                                         
                                          if (responseDttta != null &&
                                              responseDttta.signature != null) {
                                            showContent = true;
                                          } else {
                                            showContent = false;
                                          }
                                          print(showContent);
                                          setState(() {});

                                          (context as Element).reassemble();
                                        })),
                        ],
                      ),
                    );
                  } else if (snapshot.hasError) {
                    return Text('error');
                  } else {
                    return SizedBox.shrink();
                  }
                }),

Additional information :-

In webview to Login the Conscent Paywall and put the otp in field and purchase the content after payment and the lock content will opened in the page. There is a particular content to be a paid you need to purchase that content. You can able to see partially content free after that you need to purchase the complete content to read.

 child: Container(
                       height: result[i]["tiers"].length > 4 ? 400 : 220,
                       // height:320,
                       child: Center(
                         child: GridView.builder(
                             itemCount: result.isNotEmpty
                                 ? result[i]["tiers"].length
                                 : 0,
                             gridDelegate:
                                 const SliverGridDelegateWithFixedCrossAxisCount(
                                     crossAxisCount: 2,
                                     mainAxisSpacing: 8,
                                     crossAxisSpacing: 8,
                                     childAspectRatio: 1.6),
                             itemBuilder: (context, index) {
                               print(
                                   '-----basePrice---${result[i]['tiers'][index]}');
                               var basePrice =
                                   result[i]["tiers"][index]["basePrice"];
                               String percent = '';

                               if (basePrice != 0) {
                                 percent = (100 -
                                             ((result[i]["tiers"][index]
                                                         ["price"] /
                                                     basePrice) *
                                                 100))
                                         .toStringAsFixed(0) +
                                     "% off";
                               }

Visibility Method:

the visible property controls whether the child is included in the subtree or not; when it is not visible, the replacement child (typically a zero-sized box) is included instead.A variety of flags can be used to tweak exactly how the child is hidden. (Changing the flags dynamically is discouraged, as it can cause the child subtree to be rebuilt, with any state in the subtree being discarded. Typically, only the visible flag is changed dynamically.)

   Visibility(
                  visible: !visible,
                  child: const Padding(
                    padding: EdgeInsets.all(80.0),
                    child: Text('No data from API'),
                  )),
              Visibility(
                visible: dataMain == null
                    ? false
                    : dataMain["validPass"] == null
                        ? false
                        : true,
                child: ListTile(
                  title: Text(dataMain != null && dataMain["validPass"] == null
                      ? 'Data NotFrom Valid Pass'
                      : 'Data From Valid Pass'),
                  tileColor: Colors.amber,
                  subtitle: Text(
                    dataMain == null
                        ? ""
                        : "${dataMain["validPass"] == null ? 'No hrs' : dataMain["validPass"]['duration'] ?? 'No data'} - hrs unlimited access to premium content",
                  ),
                ),
              ),