Created
August 3, 2015 07:09
-
-
Save taoy/78e56e05a06168847f30 to your computer and use it in GitHub Desktop.
Python Bottle + WTforms + Polymer
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| %rebase layout title='Register New Slack log Box Backup configuration', parent_url=app.get_url('index') | |
| <h2>Create New Slack Box backup</h2> | |
| <script> | |
| function submitForm(){ | |
| document.getElementById('authform').submit(); | |
| }; | |
| </script> | |
| <!-- python block (bottle + wtforms) will not be appear in html--> | |
| %def render_field(field, desc=None, **kwargs): # simple validation | |
| <paper-input name="{{field.id}}" id="{{field.id}}" label="{{field.label.text}}" value=""></paper-input> | |
| %if field.errors: | |
| %if desc: | |
| {{!desc}} | |
| %end | |
| <ul class=errors> | |
| %for error in field.errors: | |
| <li>{{ error }}</li> | |
| %end | |
| </ul> | |
| %end | |
| %end | |
| %def render_rexfield(field, desc=None, **kwargs): # regex validation | |
| %patternraw = field.validators[0].regex.pattern # wtform regex pattern | |
| %pattern = patternraw[1:-1] # remove ^ and $ to polymer regex pattern | |
| %message = field.validators[0].message | |
| %if field.data is not None: | |
| % fdata = field.data | |
| %else: | |
| % fdata = "" | |
| %end | |
| <paper-input name="{{field.id}}" id="{{field.id}}" label="{{field.label.text}}" | |
| auto-validate pattern="{{pattern}}" error-message="{{message}}" | |
| value="{{fdata}}"></paper-input> | |
| %if field.errors: | |
| %if desc: | |
| {{!desc}} | |
| %end | |
| <ul class=errors> | |
| %for error in field.errors: | |
| <li>{{ error }}</li> | |
| %end | |
| </ul> | |
| %end | |
| %end | |
| <!-- / python block End --> | |
| <form id="authform" method="POST"> | |
| <dl> | |
| <!-- python block: will be substituted to polymer elements--> | |
| %render_field(form.team, desc='4-25 characters required') | |
| %render_rexfield(form.slacktoken, desc='Start with xoxp-') | |
| %render_rexfield(form.boxfolder, desc='Integer numbers id of the folder') | |
| <!-- / python block End --> | |
| </dl> | |
| <div align="center"> | |
| <paper-button onclick="submitForm()" style="background: black; color: white;" raised>Get Authentication on Box!</paper-button> | |
| </div></form> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| from wtforms import (Form, StringField, validators) | |
| class NewTeamProcessor(Form): | |
| team = StringField('Team', [validators.Length(min=4, max=25, | |
| message='4 to 25 characters'), | |
| validators.InputRequired()]) | |
| istoken = '^xoxp-\d{10}-\d{10}-\d{10}-[0-9a-z]{6}$' | |
| isfolder = '^\d{8,11}$' | |
| slacktoken = StringField('Slack Token', [validators.Regexp(istoken, | |
| message='Invalid input.'), | |
| validators.InputRequired()]) | |
| boxfolder = StringField('Box Folder Id', [validators.Regexp(isfolder, | |
| message='Input folder id, usually 8-10 digits'), | |
| validators.InputRequired()]) | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <script src="static/bower_components/webcomponentsjs/webcomponents-lite.min.js">></script> | |
| <link rel="import" href="static/elements/elements.html"> | |
| <link rel="import" href="static/styles/everest.html"> | |
| <title>{{title or 'No title'}}</title> | |
| </head> | |
| <body> | |
| <paper-header-panel> | |
| <paper-toolbar> | |
| <h2 style="color: white;">Slack backup tool</h2> | |
| </papter-toolbar> | |
| </paper-header-panel> | |
| <div style="margin: 5em;"> | |
| %include | |
| %if defined('parent_url'): | |
| <a href="{{parent_url}}"><<< Back</a><br /> | |
| %end | |
| </div> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js">></script> | |
| <link rel="import" href="elements/elements.html"> | |
| <link rel="import" href="es/everest.html"> | |
| <title>Register New Slack log Box Backup configuration</title> | |
| </head> | |
| <body> | |
| <paper-header-panel> | |
| <paper-toolbar> | |
| <h2 style="color: white;">Slack backup tool</h2> | |
| </papter-toolbar> | |
| </paper-header-panel> | |
| <div style="margin: 5em;"> | |
| <h2>Create New Slack Box backup</h2> | |
| <script> | |
| function submitForm(){ | |
| document.getElementById('authform').submit(); | |
| }; | |
| </script> | |
| <!-- python block (bottle + wtforms) will not be appear in html--> | |
| <!-- / python block End --> | |
| <form id="authform" method="POST"> | |
| <dl> | |
| <!-- python block: will be substituted to polymer elements--> | |
| <paper-input name="team" id="team" label="Team" value=""></paper-input> | |
| <paper-input name="slacktoken" id="slacktoken" label="Slack Token" | |
| auto-validate pattern="xoxp-\d{10}-\d{10}-\d{10}-[0-9a-z]{6}" error-message="Invalid input." | |
| value=""></paper-input> | |
| <paper-input name="boxfolder" id="boxfolder" label="Box Folder Id" | |
| auto-validate pattern="\d{8,11}" error-message="Input folder id, usually 8-10 digits" | |
| value=""></paper-input> | |
| <!-- / python block End --> | |
| </dl> | |
| <div align="center"> | |
| <paper-button onclick="submitForm()" style="background: black; color: white;" raised>Get Authentication on Box!</paper-button> | |
| </div></form> | |
| <a href="/"><<< Back</a><br /> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment