Builder button animations look dope as hell.

.flaskenv

@@ -0,0 +1 @@
+FLASK_APP=flask_app.py

app/forms.py

@@ -28,3 +28,21 @@ def validate_email(self, email):
         user = User.query.filter_by(email=email.data).first()
         if user is not None:
             raise ValidationError('Please use a different email address.')
+
+
+class BuilderForm(FlaskForm):
+    """ Form 1 """
+    heroname = StringField('Name', validators=[DataRequired()])
+    heroclass = StringField('Class', validators=[DataRequired()])
+    herorace = StringField('Race', validators=[DataRequired()])
+    heroalignment = StringField('Alignment', validators=[DataRequired()])
+
+    """ Form 2 """
+    heroeyes = StringField('Eyes', validators=[DataRequired()])
+    herohair = StringField('Hair', validators=[DataRequired()])
+    heroclothing = StringField('Clothing', validators=[DataRequired()])
+    herobody = StringField('Body', validators=[DataRequired()])
+    heroskin = StringField('Skin', validators=[DataRequired()])
+    herosymbol = StringField('Symbol', validators=[DataRequired()])
+
+    submit = SubmitField('Create Character')

app/models.py

@@ -48,12 +48,12 @@ def __repr__(self):
 class Hero_Looks(db.Model):
     id = db.Column(db.Integer, primary_key=True)
     hero_id = db.Column(db.Integer, db.ForeignKey('hero.id'))
-    eyes = db.Column(db.String(4096))
-    hair = db.Column(db.String(4096))
-    clothing = db.Column(db.String(4096))
-    body = db.Column(db.String(4096))
-    skin = db.Column(db.String(4096))
-    symbol = db.Column(db.String(4096))
+    eyes = db.Column(db.String(100))
+    hair = db.Column(db.String(100))
+    clothing = db.Column(db.String(100))
+    body = db.Column(db.String(100))
+    skin = db.Column(db.String(100))
+    symbol = db.Column(db.String(100))
 
     def __repr__(self):
         return '<id {}, hero_id {}, eyes {}, hair {}, clothing {}, body {}, skin {}, symbol {}.'.format(self.id, self.hero_id, self.eyes, self.hair, self.clothing, self.body, self.skin, self.symbol)

app/routes.py

@@ -1,6 +1,6 @@
 from flask import render_template, flash, redirect, url_for, request
 from app import app, db
-from app.forms import LoginForm, RegistrationForm
+from app.forms import LoginForm, RegistrationForm, BuilderForm
 from app.models import Comment, User, Hero
 from flask_login import current_user, login_user, logout_user, login_required
 from werkzeug.urls import url_parse
@@ -66,4 +66,57 @@ def register():
 @app.route('/builder', methods=['GET', 'POST'])
 @login_required
 def builder():
-    return render_template('builder.html', title='Build a Character')
+    form = BuilderForm()
+    if form.validate_on_submit():
+        hero = Hero(
+            owner_id=current_user.id, 
+            hero_name=request.form["heroname"],
+            hero_class=request.form["heroclass"],
+            hero_race=request.form["herorace"],
+            hero_alignment=request.form["heroalignment"]
+            #,hero_eyes=request.form["heroeyes"],
+            #hero_hair=request.form["herohair"],
+            #hero_clothing=request.form["heroclothing"],
+            #hero_body=request.form["herobody"],
+            #hero_skin=request.form["heroskin"],
+            #hero_symbol=request.form["herosymbol"]
+        )        
+"""         heroLooks = Hero_Looks(
+            hero_id = hero.id,
+            hero_eyes=request.form["heroeyes"],
+            hero_hair=request.form["herohair"],
+            hero_clothing=request.form["heroclothing"],
+            hero_body=request.form["herobody"],
+            hero_skin=request.form["heroskin"],
+            hero_symbol=request.form["herosymbol"]
+        ) """
+        db.session.add(hero)
+        db.session.commit()
+        flash('Greetings ' + hero.hero_name + ', welcome to Dungeon World!')
+        return redirect(url_for('index'))
+    return render_template('builder.html', title='Build a Character', form=form)
+
+
+@app.route('/slidingforms', methods=['GET', 'POST'])
+@login_required
+def slidingforms():
+    form = BuilderForm()
+    if form.validate_on_submit():
+        hero = Hero(
+            owner_id=current_user.id, 
+            hero_name=request.form["heroname"], 
+            hero_class=request.form["heroclass"], 
+            hero_race=request.form["herorace"], 
+            hero_alignment=request.form["heroalignment"],
+            hero_eyes=request.form["heroeyes"],
+            hero_hair=request.form["herohair"],
+            hero_clothing=request.form["heroclothing"],
+            hero_body=request.form["herobody"],
+            hero_skin=request.form["heroskin"],
+            hero_symbol=request.form["herosymbol"]
+        )
+        db.session.add(hero)
+        db.session.commit()
+        flash('Greetings ' + hero.hero_name + ', welcome to Dungeon World!')
+        return redirect(url_for('index'))
+    return render_template('slidingforms.html', title='Build a Character', form=form)

app/static/css/style.css

@@ -173,4 +173,20 @@ a,
         height: 100vh;
         padding: 0;
     }
+  }
+
+  .builder-form {
+    position: relative;
+    text-align: center;
+  }
+
+  .builder-form > div {
+    position: absolute;
+    left: 0;
+    top: 0;
+  }
+
+  .form-actions {
+      padding-right: 0px;
+      padding-left: 0px;
   }