init

lib/app.dart

@@ -0,0 +1,57 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:logger/logger.dart';
+import 'package:openmediacentermobile/login_screen.dart';
+import 'package:openmediacentermobile/token.dart';
+
+import 'video_feed.dart';
+
+class App extends StatefulWidget {
+  App({Key? key}) : super(key: key) {}
+
+  @override
+  State<StatefulWidget> createState() {
+    return AppState();
+  }
+}
+
+class AppState extends State<App> {
+  String? loggedin = null;
+
+  onLogin() {
+    setState(() {
+      loggedin = "ddd";
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    if (loggedin == null) {
+      return const CircularProgressIndicator();
+    } else if (loggedin == "") {
+      return MaterialApp(
+          home: Scaffold(
+              appBar: AppBar(
+                title: const Text("Login"),
+              ),
+              body: LoginScreen(onLogin: onLogin)));
+    } else {
+      return MaterialApp(
+          home: Scaffold(
+              appBar: AppBar(
+                title: const Text("Openmediacenter"),
+              ),
+              body: VideoFeed()));
+    }
+  }
+
+  AppState() {
+    final token = Token.getInstance();
+    token.getToken().then((value) {
+      Logger().i("The token value is $value");
+      setState(() {
+        loggedin = value;
+      });
+    });
+  }
+}

lib/login_screen.dart

@@ -0,0 +1,18 @@
+import 'package:flutter/material.dart';
+
+class LoginScreen extends StatefulWidget {
+  const LoginScreen({Key? key, this.onLogin}) : super(key: key);
+
+  final onLogin;
+
+  @override
+  _LoginScreenState createState() => _LoginScreenState();
+}
+
+class _LoginScreenState extends State<LoginScreen> {
+  @override
+  Widget build(BuildContext context) {
+    return ElevatedButton(
+        onPressed: this.widget.onLogin, child: Text("klick meee"));
+  }
+}

lib/main.dart

@@ -0,0 +1,9 @@
+import 'package:flutter/material.dart';
+import 'package:logger/logger.dart';
+import 'package:openmediacentermobile/app.dart';
+
+// main app entry point
+void main() {
+  Logger().i("App init!");
+  runApp(App());
+}

lib/preview_tile.dart

@@ -0,0 +1,26 @@
+import 'dart:convert';
+
+import 'package:flutter/material.dart';
+
+class VideoPreview {
+  String thumbnail;
+  String title;
+  int id;
+
+  VideoPreview(this.thumbnail, this.title, this.id);
+}
+
+class PreviewTile extends StatelessWidget {
+  const PreviewTile({Key? key, required this.dta}) : super(key: key);
+
+  final VideoPreview dta;
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      child: Column(
+        children: [Text(dta.title), Image.memory(base64Decode(dta.thumbnail))],
+      ),
+    );
+  }
+}

lib/token.dart

@@ -0,0 +1,42 @@
+import 'dart:async';
+
+import 'package:flutter/widgets.dart';
+import 'package:flutter_secure_storage/flutter_secure_storage.dart';
+import 'package:logger/logger.dart';
+
+class Token {
+  static final Token _token = Token._();
+  final _storage = const FlutterSecureStorage();
+  final _l = Logger();
+
+  String _tokenval = "";
+
+  static Token getInstance() {
+    return _token;
+  }
+
+  Future<String?> _readToken() async {
+    _l.d("reading token store");
+    WidgetsFlutterBinding.ensureInitialized();
+    return _storage.read(key: 'jwt');
+  }
+
+  Future<String> getToken() async {
+    var completer = Completer<String>();
+
+    if (_tokenval == "") {
+      final token = await _readToken();
+      completer.complete(token);
+    } else {
+      completer.complete(_tokenval);
+    }
+    return completer.future;
+  }
+
+  void setToken(String token) {
+    _tokenval = token;
+    _storage.write(key: 'jwt', value: token);
+  }
+
+  Token._();
+}

lib/video_feed.dart

@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
+
+import 'preview_tile.dart';
+
+class VideoFeed extends StatelessWidget {
+  VideoFeed({Key? key}) : super(key: key);
+
+  static const String testprev =
+      "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 truncated
+
+  final List<VideoPreview> _vids =
+      List.generate(6000, (index) => VideoPreview(testprev, "title4", index));
+
+  @override
+  Widget build(BuildContext context) {
+    return GridView.builder(
+        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+            crossAxisCount: 2,
+            childAspectRatio: MediaQuery.of(context).size.width /
+                MediaQuery.of(context).size.height,
+            crossAxisSpacing: 10),
+        itemCount: _vids.length,
+        itemBuilder: (context, index) {
+          print("item $index built!");
+          return PreviewTile(dta: _vids[index]);
+        });
+  }
+}