Skip to content
Snippets Groups Projects
classification.dart 22.3 KiB
Newer Older
  • Learn to ignore specific revisions
  • Madlen Ort's avatar
    Madlen Ort committed
    import 'package:ambient/firebase.dart';
    import 'package:cloud_firestore/cloud_firestore.dart';
    import 'package:firebase_auth/firebase_auth.dart';
    import 'package:firebase_core/firebase_core.dart';
    import 'package:flutter/material.dart';
    import 'CustomSearchDelegate.dart';
    import '../homepage.dart';
    
    Madlen Ort's avatar
    Madlen Ort committed
    import 'package:google_fonts/google_fonts.dart';
    
    /*
    Klasse & Screen zur Klassifizierung der Farben zu den Genres.
    Es gibt eine graue Default Seite wenn keine Farbe ausgewählt ist.
    Wenn eine Farbe ausgewählt wird, kann man das Genre dazu auswählen.
    
    Die Klassifizierung wird dann in der Datenbank aktualisiert
    
    Madlen Ort's avatar
    Madlen Ort committed
     */
    
    Madlen Ort's avatar
    Madlen Ort committed
    
    class ClassificationPage extends StatefulWidget {
      const ClassificationPage({Key? key}) : super(key: key);
    
      @override
      State<StatefulWidget> createState() => _ClassificationPageState();
          }
    
    class _ClassificationPageState extends State<ClassificationPage> {
    
      final String id = (FirebaseAuth.instance.currentUser?.uid.toString())!+'_genres';
    
    Madlen Ort's avatar
    Madlen Ort committed
      Color _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
    
    Madlen Ort's avatar
    Madlen Ort committed
      String genreValue = '';
    
      bool _redSelected = false;
      bool _orangeSelected = false;
      bool _yellowSelected = false;
      bool _greenSelected = false;
      bool _whiteSelected = false;
      bool _blueSelected = false;
      bool _pinkSelected = false;
      bool _purpleSelected = false;
      bool _brownSelected = false;
      bool _blackSelected = false;
    
      bool _errorText  = false;
    
      @override
      Widget build(BuildContext context) {
        Firebase.initializeApp();
        print("User");
        print(FirebaseAuth.instance.currentUser?.uid.toString());
        return Scaffold(
            resizeToAvoidBottomInset: false,
            body: Container(
    
    Madlen Ort's avatar
    Madlen Ort committed
              color: _ambientBackgroundColor,
    
    Madlen Ort's avatar
    Madlen Ort committed
                child: Column(
                    children: [
    
    Madlen Ort's avatar
    Madlen Ort committed
                      const SizedBox(height: 40,),
                      SizedBox( height: 50, width: 300,
                       child: Text('Ambient!',
                         style:
                         GoogleFonts.cabin(
                             fontSize: 40.0, color: Colors.white.withOpacity(0.85)),),),
                      const SizedBox(height: 20,),
                      SizedBox(
                        height: 80,
                          width: 300,
                          child : Text('Select the genre that fits to the emotion of each color',
                        style:
                        GoogleFonts.cabin(
                            fontSize: 20.0, color: Colors.white.withOpacity(0.85),),),),
    
    
    Madlen Ort's avatar
    Madlen Ort committed
    
    
    Madlen Ort's avatar
    Madlen Ort committed
                       Expanded(
    
    Madlen Ort's avatar
    Madlen Ort committed
                         child:  Container(
                             height: 50,
                             decoration: BoxDecoration(
                               color: Color(0xffffffff),
                               borderRadius: BorderRadius.only(topLeft: Radius.circular(50),topRight: Radius.circular(50)),
                               boxShadow: [
                                 BoxShadow(
                                   color: Colors.grey.withOpacity(0.5),
                                   spreadRadius: 5,
                                   blurRadius: 7,
                                   offset: Offset(0, 3),
                                 ),
                               ],),
    
    Madlen Ort's avatar
    Madlen Ort committed
                          child: ListView(
    
    Madlen Ort's avatar
    Madlen Ort committed
                            children: <Widget>[
                              GestureDetector(
    
                                onTap: () async {
                                  String genre = await changeFirebase().getGenreByHex('FF0000');
                                  print('Get genre by hex ' + genre);
    
    
    Madlen Ort's avatar
    Madlen Ort committed
                                  if(!_redSelected){closeAll(); setState(() => _redSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.red;
                                  if (!_redSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _redSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("Red", Colors.red, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "rock","latin", "blues",
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        'Strong emotions, love, energie') : noSelection("Red")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: (){
                                  if(!_orangeSelected){closeAll(); setState(() => _orangeSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.orange;
                                  if (!_orangeSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _orangeSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("Orange", Colors.orange, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "soul", "jazz", "indie-pop", 'warmth, energie, fall') : noSelection("Orange")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_yellowSelected){closeAll(); setState(() => _yellowSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.yellow;
                                  if (!_yellowSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _yellowSelected ?
                                    selectedColor("Yellow", Colors.yellow, Colors.white,
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "pop", "funk", "country", 'happiness, optimism, warmth') : noSelection("Yellow")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_greenSelected){closeAll(); setState(() => _greenSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.green;
                                  if (!_greenSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _greenSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("Green", Colors.green, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "ambient", "classical", "new-age", 'calmness, growth, nature') : noSelection("Green")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: (){
                                  if(!_whiteSelected){closeAll(); setState(() => _whiteSelected = true); }
                                  else{closeAll();}
    
    Madlen Ort's avatar
    Madlen Ort committed
                                  _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
    
    Madlen Ort's avatar
    Madlen Ort committed
                                  if (!_whiteSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _whiteSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("White", Colors.white, Colors.grey.withOpacity(0.7),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "classical", "ambient", "piano", 'calmness, peace, serenity') : noSelection("White")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_blueSelected){closeAll(); setState(() => _blueSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.blue;
                                  if (!_blueSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _blueSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor( "Blue", Colors.blue, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "blues", "rainy-day", "indie-pop", 'calm, Gelassenheit, sadness') : noSelection("Blue")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_pinkSelected){closeAll(); setState(() => _pinkSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.pinkAccent;
                                  if (!_pinkSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _pinkSelected ?
                                    selectedColor(
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "Pink", Colors.pink, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "pop", "k-pop", "r-n-b", 'romance, charm, nostalgia') : noSelection("Pink")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_purpleSelected){closeAll(); setState(() => _purpleSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.purple;
                                  if (!_purpleSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _purpleSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("Purple", Colors.purple, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "rock", "classical", "hip-hop", 'luxury, spirituality, ambition') : noSelection("Purple")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_brownSelected){closeAll(); setState(() => _brownSelected = true); }
                                  else{closeAll();}
                                  _ambientBackgroundColor = Colors.brown;
                                  if (!_brownSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _brownSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("Brown", Colors.brown, Colors.white.withOpacity(0.9),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "country", "folk", "reggae", 'warmth, security, nostalgia, calm') : noSelection("Brown")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
                              GestureDetector(
                                onTap: () {
                                  if(!_blackSelected){closeAll(); setState(() => _blackSelected = true); }
                                  else{closeAll();}
    
    Madlen Ort's avatar
    Madlen Ort committed
                                  _ambientBackgroundColor = Colors.black87;
    
    Madlen Ort's avatar
    Madlen Ort committed
                                  if (!_blackSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                                child: Container(
                                    child: _blackSelected ?
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    selectedColor("Black", Colors.black87, Colors.white.withOpacity(0.7),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                        "metal", "classical", "rock", 'melancholy, power, noble') : noSelection("Black")
    
    Madlen Ort's avatar
    Madlen Ort committed
                                )
                                ,),
                              const SizedBox(height: 20,),
    
    Madlen Ort's avatar
    Madlen Ort committed
                            Align(
                              alignment: Alignment.center,
                            child: Container(
                              width: 200, height: 40,
    
    Madlen Ort's avatar
    Madlen Ort committed
                                child : StreamBuilder(
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    //Es wird in der Datenbank geprüft, ob zu allen Farben ein Genre ausgewählt wurde
    
    Madlen Ort's avatar
    Madlen Ort committed
                                    stream: FirebaseFirestore.instance.collection('classification').doc(id).snapshots(),
                                    builder: (BuildContext context,
                                        AsyncSnapshot snapshot) {
                                          return ElevatedButton(
    
    Madlen Ort's avatar
    Madlen Ort committed
                                          style:ButtonStyle(
                                              backgroundColor: MaterialStatePropertyAll<Color>(Colors.white.withOpacity(0.9))),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                          child: const Text(
    
    Madlen Ort's avatar
    Madlen Ort committed
                                            "Save", style: TextStyle(color: Colors.indigo, fontWeight: FontWeight.bold),),
    
    Madlen Ort's avatar
    Madlen Ort committed
                                          onPressed: () {
                                            print(changeFirebase().checkIfEverythingSelected(snapshot).toString());
                                            if (changeFirebase().checkIfEverythingSelected(snapshot)) {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) => HomePage()));
                                            }
                                            else{
                                              setState(() {
                                                _errorText = true;
                                              });
                                            }
                                    });
    
    Madlen Ort's avatar
    Madlen Ort committed
                              }))),
    
    Madlen Ort's avatar
    Madlen Ort committed
                            Container(
                                child: _errorText ?
                                const Text('Not everything is selected!',
                                  textAlign: TextAlign.center,
                                  style: TextStyle( fontSize: 20, color: Colors.red),)
                                    : null
                            ),
    
    Madlen Ort's avatar
    Madlen Ort committed
                              const SizedBox(height: 40,)
                            ]),),)]
    
    Madlen Ort's avatar
    Madlen Ort committed
                )
            ));
      }
    
      Text errorText(){
        return const Text(
          'Not Everything is selected',
          style: TextStyle(fontSize: 20, color: Colors.red)
        );
      }
    
    Madlen Ort's avatar
    Madlen Ort committed
    
    
    Madlen Ort's avatar
    Madlen Ort committed
      //wenn die Farbe nicht ausgewählt ist, wird kein Genre-Auswahl dargestellt und die Farben sind grau
    
    Madlen Ort's avatar
    Madlen Ort committed
      Align noSelection(String colorText) {
          return Align(
            alignment: Alignment.center,
            child:Container(
              width: 320,
                decoration: BoxDecoration(
                  color: Colors.transparent,
                  border: Border.all(
                      color: Colors.grey.shade300, width: 1),
                  borderRadius: BorderRadius.circular(10),),
              child: Column(
                children: [
                  SizedBox(height: 50,),
                Row(
    
    Madlen Ort's avatar
    Madlen Ort committed
                  children: [
    
    Madlen Ort's avatar
    Madlen Ort committed
                   const SizedBox(width: 25),
    
    Madlen Ort's avatar
    Madlen Ort committed
                    Text(colorText,
    
    Madlen Ort's avatar
    Madlen Ort committed
                      style: GoogleFonts.cabin(fontSize: 20.0, color: Colors.grey.shade400,)),]),
                 Row(
                     children: [
                       const SizedBox(width: 25),
                       StreamBuilder(
    
    Madlen Ort's avatar
    Madlen Ort committed
                               stream: FirebaseFirestore.instance.collection('classification').doc(id).snapshots(),
                               builder: (BuildContext context, AsyncSnapshot snapshot){
                                 if (snapshot.connectionState == ConnectionState.waiting) {
                                   return const Center(
    
    Madlen Ort's avatar
    Madlen Ort committed
                                     child: CircularProgressIndicator(),);}
                                 return Text(changeFirebase().checkForNull(snapshot.data.data()[colorText]), textAlign: TextAlign.center,
                                   style: GoogleFonts.cabin(fontSize: 40.0, color: Colors.grey.shade400,),);
                               }),]),
                            SizedBox(height: 5,)])));}
    
    Madlen Ort's avatar
    Madlen Ort committed
    
    
    
    Madlen Ort's avatar
    Madlen Ort committed
      //Wenn eine Farbe ausgewählt wird, werden die Farben entsprechend angepasst
      //Und man kann ein Genre zu dieser Farbe auswählen
      Align selectedColor(String colorText, Color color, Color textColor, String rec1, String rec2, String rec3, String infoText) {
    
    Madlen Ort's avatar
    Madlen Ort committed
        return Align(
    
    Madlen Ort's avatar
    Madlen Ort committed
          alignment: Alignment.center,
            child:Container(
             width: 320,
                decoration: BoxDecoration(
                color: color,
                borderRadius: BorderRadius.circular(10),
                    boxShadow: [
                      BoxShadow(
                          color: Colors.grey.withOpacity(0.4),
                          blurRadius: 10.0,
                          spreadRadius: 2.0,
                          offset: const Offset(0.0, 0.0),)]),
                child: Column(
                    children: [
                      Align(
                        alignment: Alignment.topRight,
                        child : IconButton(onPressed:(){
                          _showMyDialog(colorText, infoText);},
                          alignment: Alignment.centerRight,
                          icon: Icon( Icons.info_outline, color: textColor.withOpacity(0.7), size: 35,),),
                      ),
                    SizedBox(height: 0,),
                    Row(
                        children: [
                            const SizedBox(width: 25),
                            Text(colorText,
                            style: GoogleFonts.cabin(fontSize: 20.0, color: textColor,)),]),
                            Row(
                            children: [
                                const SizedBox(width: 25),
                                StreamBuilder(
    
    Madlen Ort's avatar
    Madlen Ort committed
                                stream: FirebaseFirestore.instance.collection('classification').doc(id).snapshots(),
                                builder: (BuildContext context, AsyncSnapshot snapshot) {
                                  if (snapshot.connectionState == ConnectionState.waiting) {
                                    return const Center(
                                      child: CircularProgressIndicator(),
                                    );
                                  }
                                  return
                                    Text(changeFirebase().checkForNull(snapshot.data.data()[colorText]), textAlign: TextAlign.center,
    
    Madlen Ort's avatar
    Madlen Ort committed
                                      style:  GoogleFonts.cabin(fontSize: 40.0, color: textColor),);
    
    Madlen Ort's avatar
    Madlen Ort committed
                                }
    
    Madlen Ort's avatar
    Madlen Ort committed
                                ),]),
    
    
    Madlen Ort's avatar
    Madlen Ort committed
                            const SizedBox(height: 20,),
                            Container(
                              width: 290,
                              child: TextField(
                                decoration: InputDecoration(
                                    prefixIcon: Icon(
                                        Icons.search, color: textColor),
                                    hintText: 'search for genres',
                                    hintStyle: TextStyle(
                                        fontSize: 20, color: textColor)),
                                style: TextStyle(fontSize: 20, color: textColor),
                                onTap: () {
                                  showSearch(
                                    context: context,
                                    delegate: CustomSearchDelegate(colorText),
                                  );
                                  changeFirebase().updateColorGenre(colorText, genreValue);},
                              ),
                            ),
                          const SizedBox(height: 50),
                          Text("Recommendation", style: TextStyle(
                              fontSize: 20, color: textColor)),
                          Column(
                              children: [
                                const SizedBox(height: 20,),
                                Row(
                                    children: [
                                      const SizedBox(width: 40,),
                                      recommendationLabel(colorText, rec1, textColor),
                                    ]
                                ),
                                const SizedBox(height: 20,),
                                Row(
                                    children: [
                                      const SizedBox(width: 40,),
                                      recommendationLabel(colorText, rec2, textColor),
                                    ]
                                ),
                                const SizedBox(height: 20,),
                                Row(
                                    children: [
                                      const SizedBox(width: 40,),
                                      recommendationLabel(colorText, rec3, textColor),
                                    ]
                                ),
                                const SizedBox(height: 50,)
                              ]
    
    Madlen Ort's avatar
    Madlen Ort committed
                          )])));
       }
    
    Madlen Ort's avatar
    Madlen Ort committed
    
      GestureDetector recommendationLabel(String colorText, String rec, Color textColor) {
        return GestureDetector(
    
    Madlen Ort's avatar
    Madlen Ort committed
          onTap: () {
            changeFirebase().updateColorGenre(colorText, rec);
            closeAll();},
    
    Madlen Ort's avatar
    Madlen Ort committed
          child:Container(
            child: Row(
                children: [
                  Container(
                    width: 240,
                    height: 40,
                    decoration: BoxDecoration(
                      color: Colors.white.withOpacity(0.3),
                      borderRadius: BorderRadius.circular(10),
                    ),
                    child: Align(
                        alignment: Alignment.center,
                        child: Text
                          (rec, textAlign: TextAlign.center,
                          style: TextStyle(fontSize: 20, color: textColor)
                    ),
                  )
    
    Madlen Ort's avatar
    Madlen Ort committed
                  )])),
    
    Madlen Ort's avatar
    Madlen Ort committed
        );
      }
    
    
    Madlen Ort's avatar
    Madlen Ort committed
      //Info Dialog zur Erklärung der Farben-Emotionen
    
    Madlen Ort's avatar
    Madlen Ort committed
      Future<void> _showMyDialog(String colorText, String infoText) {
        return showDialog<void>(
          context: context,
          barrierDismissible: false, // user must tap button!
          builder: (BuildContext context) {
            return AlertDialog(
              title: Text (colorText),
              content: SingleChildScrollView(
                child: ListBody(
                  children: <Widget>[
                    Text(infoText),
    
    Madlen Ort's avatar
    Madlen Ort committed
                  ],),
    
    Madlen Ort's avatar
    Madlen Ort committed
              ),
              actions: <Widget>[
                TextButton(
                  child: const Text('Okay'),
                  onPressed: () {
                    Navigator.of(context).pop();
                  },),
              ],);
          },);}
    
        closeAll(){
        _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
          setState(() {
            _redSelected = false;
            _orangeSelected = false;
            _yellowSelected = false;
            _greenSelected = false;
            _whiteSelected = false;
            _blueSelected = false;
            _pinkSelected = false;
            _purpleSelected = false;
            _brownSelected = false;
            _blackSelected = false;
          });
          _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
        }
    
    Madlen Ort's avatar
    Madlen Ort committed
    }