;(function(burl) {
var url = 'https://cdn.rawgit.com/anpylar/anpylar/1.1.3/anpylar.js'
var s = document.createElement('script')
s.type = 'text/javascript'
s.async = true
s.src = url
var h = document.getElementsByTagName('head')[0]
h.appendChild(s)
})();
#!/usr/bin/env python
# -*- coding: utf-8; py-indent-offset:4 -*-
###############################################################################
from .app_module import AppModule
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .admin_module import AdminModule
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class AdminComponent(Component):
htmlsheet = '''
<h3>ADMIN</h3>
<nav>
<a routerLink="" routerLinkActive="active">Dashboard</a>
<a routerLink="disasters" routerLinkActive="active">Manage Disasters</a>
<a routerLink="pyroes" routerLinkActive="active">Manage Pyroes</a>
</nav>
<router-outlet></router-outlet>
'''
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class AdminDashboardComponent(Component):
htmlsheet = '''
<p>Dashboard</p>
Session Id:<txt [session_id_]>{}</txt>
'''
bindings = {
'session_id': ''
}
def loading(self):
self.session_id = self.params.get('session_id', '')
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Module
from ..auth_guard_service import AuthGuard
from .admin_component import AdminComponent
from .admin_dashboard_component import AdminDashboardComponent
from .manage_disasters_component import ManageDisastersComponent
from .manage_pyroes_component import ManagePyroesComponent
class AdminModule(Module):
routes = [{
'path': '',
'component': AdminComponent,
'can_activate': AuthGuard,
'children': [{
'path': '',
'children': [
{'path': 'disasters', 'component': ManageDisastersComponent},
{'path': 'pyroes', 'component': ManagePyroesComponent},
{'path': '', 'component': AdminDashboardComponent}
]
}]
}]
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class ManageDisastersComponent(Component):
htmlsheet = '''
<p>Manage your Disasters here</p>
</p>
'''
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class ManagePyroesComponent(Component):
htmlsheet = '''
<p>Manage your Pyroes here</p>
'''
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class AppComponent(Component):
htmlsheet = '''
<h1 class="title">AnPyLar Tourer</h1>
<nav>
<a routerLink="/disaster-center" routerLinkActive="active">Disaster Center</a>
<a routerLink="/superpyroes" routerLinkActive="active">Pyroes</a>
<a routerLink="/admin" routerLinkActive="active">Admin</a>
<a routerLink="/login" routerLinkActive="active">Login</a>
<a routerLink="/compose" routerLinkActive="active">Contact</a>
</nav>
<router-outlet></router-outlet>
<router-outlet name="popup"></router-outlet>
'''
stylepath = None
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Module
from .app_component import AppComponent
from .compose_message import ComposeMessageComponent
from .page_not_found_component import PageNotFoundComponent
from .admin import AdminModule
from .disaster_center import DisasterCenterModule
from .pyroes import PyroesModule
from .login import LoginModule
from .auth_service import AuthService
from .dialog_service import DialogService
class AppModule(Module):
modules = LoginModule, PyroesModule
components = AppComponent
bindings = {}
services = {
'auth_service': AuthService,
'dialog_service': DialogService,
}
routes = [
{'path': 'compose', 'component': ComposeMessageComponent,
'outlet': 'popup'},
{'path': 'disaster-center', 'load_children': [DisasterCenterModule]},
{'path': 'admin', 'load_children': [AdminModule]},
{'path': '', 'redirect_to': '/superpyroes', 'path_match': 'full'},
{'path': '*', 'component': PageNotFoundComponent},
]
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import AuthGuard
class AuthGuard(AuthGuard):
def can_activate(self, route):
return self.check_login(route.path)
def can_activate_child(self, route):
return self.can_activate(route)
def check_login(self, path):
if self.auth_service.is_logged:
return True
self.auth_service.redir_path = path
self.router.route_to('/login', session_id=1234567890)
return False
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Observable, Model
class AuthService(Model):
bindings = {
'is_logged': False,
'redir_path': '',
}
def login(self):
return Observable.of(True) \
.delay(1000) \
.do_action(lambda x: setattr(self, 'is_logged', x))
def logout(self):
self.is_logged = False
def not_logged(self):
return self.is_logged_.map(lambda x: not x)
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .compose_message_component import ComposeMessageComponent
<h3>Contact Disaster Center</h3>
<div name="details">
{details}
</div>
<div>
<div>
<label>Message: </label>
</div>
<div>
<textarea rows="10" cols="35"></textarea>
</div>
</div>
<p name="buttons">
<button name="send">Send</button>
<button name="cancel">Cancel</button>
</p>
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class ComposeMessageComponent(Component):
bindings = {
'details': '',
'msg': '',
}
def unloading(self):
# return to default state when unloading for next load
self.details = ''
self.msg = ''
def render(self, node):
d = node.select('div[name="details"]') # will get first
d._display(bool(self.details_))
d._fmt(details=self.details_)
t = node.select('textarea')._fmtvalue(self.msg_)
p = node.select('p[name="buttons"]')
p._display(self.details_ == '')
bsend = node.select('button[name="send"]')
bsend._bindx.click(self.send)
bcancel = node.select('button[name="cancel"]')
bcancel._bindx.click(self.close_popup)
def send(self):
self.details = 'Sending Message ...'
# the message would be available in self.msg
Observable.of(True) \
.delay(2000) \
.subscribe(self.close_popup)
def close_popup(self, close=True):
self.close_outlet()
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from browser import window
from anpylar import Observable
class DialogService:
def confirm(self, message='Is it OK?'):
confirmation = window.confirm(message)
return Observable.of(confirmation)
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .disaster_center_module import DisasterCenterModule
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class DisasterCenterComponent(Component):
htmlsheet = '''
<h2>Disaster Center</h2>
<router-outlet></router-outlet>
'''
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class DisasterCenterHomeComponent(Component):
htmlsheet = '''
<p>Welcome to the Disaster Center</p>
'''
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Module
from .disaster_center_component import DisasterCenterComponent
from .disaster_list_component import DisasterListComponent
from .disaster_detail_component import DisasterDetailComponent
from .disaster_center_home_component import DisasterCenterHomeComponent
from .disaster_service import DisasterService
class DisasterCenterModule(Module):
services = {
'disaster_service': DisasterService,
}
routes = [{
'path': '',
'component': DisasterCenterComponent,
'children': [
{
'path': '',
'component': DisasterListComponent,
'children': [
{
'path': '',
'component': DisasterDetailComponent,
'params': {'did': int}, # transformation function
},
{
'path': '',
'component': DisasterCenterHomeComponent,
}
]
}
]
}]
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class DisasterDetailComponent(Component):
# selector = 'app-root'
htmlsheet = '''
<div *_display=edit_did_>
<h3 [edit_name_]>"{}"</h3>
<div>
<label>Id: </label><txt [edit_did_]>{}</txt></div>
<div>
<label>Name: </label>
<input *_fmtvalue=edit_name_ placeholder="name"/>
</div>
<p>
<button (click)=save>Save</button>
<button (click)="router.route_to('')">Cancel</button>
</p>
</div>
'''
stylesheet = ''''
input {
width: 20em
}
'''
bindings = {
'edit_name': '',
'edit_did': 0,
}
def loading(self):
self.disaster_service.get_disaster(self.route.params['did']) \
.subscribe(self.set_disaster)
def unloading(self):
self.set_disaster()
def set_disaster(self, disaster=None):
if disaster:
self.edit_name = disaster.name
self.edit_did = disaster.did
else:
self.edit_name = ''
self.edit_did = 0
def save(self):
# selected is in our parent component
self.selected.name = self.edit_name
self.router.route_to('.')
def can_deactivate(self):
if not self.edit_did or self.selected.name == self.edit_name:
return True
# dialog_service is in the main module
return self.dialog_service.confirm('Discard changes?')
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component, html
from .disaster_service import Disaster
class DisasterListComponent(Component):
htmlsheet = '''
<ul class="items"></ul>
<router-outlet></router-outlet>
'''
bindings = {
'selected': Disaster(),
'disasters': [],
}
def __init__(self):
self.disaster_service.get_disasters().subscribe(self.disasters_)
def li_disasters(self, disasters):
for disaster in disasters:
with html.li() as li:
li._class.selected(self.selected_.did_ == disaster.did)
with html.a(routerlink=('', {'did': disaster.did})):
html.span(disaster.did, Class='badge')
html.txt()._fmt(disaster.name_)
li._bindx.click(lambda d=disaster: self.selected_(d))
def render(self, node):
with node.select('ul') as ul:
ul._render(self.li_disasters, self.disasters_)
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Observable, Model
class Disaster(Model):
bindings = {
'did': 0,
'name': '',
}
DISASTERS = [
Disaster(**{'did': 1, 'name': 'The Python Menace'}),
Disaster(**{'did': 2, 'name': 'Revenge of the Pyth'}),
Disaster(**{'did': 3, 'name': 'The Empyre pykes back'}),
Disaster(**{'did': 4, 'name': 'No more Pyzzas for the films!'}),
]
class DisasterService:
next_disaster_id = 100
def __init__(self):
self.disasters_ = Observable.of(DISASTERS)
def get_disasters(self):
return self.disasters_
def get_disaster(self, did):
return self.get_disasters() \
.map(lambda disasters: [c for c in disasters if c.did == did]) \
.filter(lambda disasters: len(disasters)) \
.map(lambda disasters: disasters[0])
def add_disaster(self, name):
disaster = Disaster(did=self.next_disaster_id, name=name)
self.next_disaster_id += 1
DISASTERS.append(disaster)
self.disasters_ = o = Observable.of(DISASTERS)
return o
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .login_module import LoginModule
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class LoginComponent(Component):
htmlsheet = '''
<h2>LOGIN</h2>
<p [msg_]>{}</p>
<p>
<button
*_display="auth_service.is_logged_ == 0"
(click)=login>Login
</button>
<button
*_display="auth_service.is_logged_"
(click)=logout>Logout
</button>
</p>
'''
bindings = {
'msg': '',
}
def loading(self):
self.set_message()
def set_message(self):
self.msg = 'Logged ' + ('in' if self.auth_service.is_logged else 'out')
def login(self):
def to_login(x):
self.set_message()
if self.auth_service.is_logged:
sid = self.params.get('session_id', 0)
self.router.route_to(self.auth_service.redir_path,
session_id=sid)
self.auth_service.redir_path = ''
self.auth_service.login().subscribe(to_login)
def logout(self):
self.auth_service.logout()
self.set_message()
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .login_component import LoginComponent
class LoginModule(Module):
routes = [
{'path': 'login', 'component': LoginComponent}
]
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component
class PageNotFoundComponent(Component):
htmlsheet = '''
<h2>Page not found</h2>
'''
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .pyroes_module import PyroesModule
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .pyro_detail_component import PyroDetailComponent
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component, html
from ..pyro_service import Pyro
class PyroDetailComponent(Component):
htmlsheet = '''
<h2>PyRoeS</h2>
<!-- <div *_display=pyro_.pyd_> -->
<div>
<h3 {name}=pyro_.name_>"{name}"</h3>
<div>
<label>Pyd: </label><txt {pyd}=pyro_.pyd_>{pyd}</txt>
</div>
<div>
<label>Name: </label>
<input *_fmtvalue=pyro_.name_ placeholder="name"/>
</div>
<p>
<button (click)="router.route_to('/pyroes')">Back</button>
<!-- <button (click)="goto_pyroes()">Back</button> -->
</p>
</div>
'''
stylepath = None
bindings = {
'pyro': Pyro(),
}
def loading(self):
self.pyro_service.get_pyro(self.route.params['pyd']) \
.subscribe(self.pyro_)
def unloading(self):
self.pyro = Pyro()
def render(self, node):
pass
def goto_pyroes(self):
self.router.route_to('/pyroes') # route without params
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Observable, Model
class Pyro(Model):
bindings = {
'pyd': 0,
'name': '',
}
_PYROES = [
{'pyd': 11, 'name': 'Pyro Nakamura'},
{'pyd': 12, 'name': 'Mopynder Shuresh'},
{'pyd': 13, 'name': 'Pyter Pytrelli'},
{'pyd': 14, 'name': 'Angela Pytrelli'},
{'pyd': 15, 'name': 'Claire Pynnet'},
{'pyd': 16, 'name': 'Noah Pynnet'},
{'pyd': 17, 'name': 'Pysaac Mendez'},
{'pyd': 18, 'name': 'Pyki Sanders'},
{'pyd': 19, 'name': 'The Pytian'},
{'pyd': 20, 'name': 'Pylar'},
]
PYROES = [Pyro(**p) for p in _PYROES]
class PyroService:
def get_pyroes(self):
return Observable.of(PYROES)
def get_pyro(self, pyd):
self.pyd = pyd
return self.get_pyroes() \
.map(self.filter_pyroes)
def filter_pyroes(self, pyroes):
return [p for p in pyroes if p.pyd == self.pyd][0]
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Module
from .pyroes import PyroesComponent
from .pyro_detail import PyroDetailComponent
from .pyro_service import PyroService, Pyro
class PyroesModule(Module):
services = {
'pyro_service': PyroService,
}
routes = [
{'path': 'pyroes', 'redirect_to': '/superpyroes'},
{'path': 'superpyroes', 'component': PyroesComponent},
{
'path': 'pyro',
'redirect_to': '/superpyro'},
{
'path': 'superpyro',
'params': {'pyd': int},
'component': PyroDetailComponent,
}
]
def __init__(self):
pass
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from .pyroes_component import PyroesComponent
###############################################################################
# Copyright 2018 The AnPyLar Team. All Rights Reserved.
# Use of this source code is governed by an MIT-style license that
# can be found in the LICENSE file at http://anpylar.com/mit-license
###############################################################################
from anpylar import Component, html
class PyroesComponent(Component):
htmlsheet = '''
<h2>Pyroes</h2>
<ul class="items"></ul>
<button routerLink="/save-the-world">Save the World</button>
'''
stylepath = None
bindings = {
'pyd': 0,
'pyroes': [],
}
def loading(self):
self.pyro_service.get_pyroes() \
.subscribe(self.pyroes_)
def unloading(self):
self.pyroes = []
def li_pyroes(self, pyroes):
for pyro in pyroes:
with html.li() as li:
# li._class.selected(self.selected_.pyd_ == pyro.pyd)
li._class.selected(self.pyd == pyro.pyd)
li._bindx.click(self.pyd_, pyro)
with html.a(routerlink=('/pyro', {'pyd': pyro.pyd})):
html.span(pyro.pyd, Class='badge')
html.txt(' {name}')._fmt(name=pyro.name_)
def render(self, node):
with node.select('ul') as ul:
ul._render(self.li_pyroes, self.pyroes_)
/* items class */
.items {
margin: 0 0 2em 0;
list-style-type: none;
padding: 0;
width: 24em;
}
.items li {
cursor: pointer;
position: relative;
left: 0;
background-color: #EEE;
margin: .5em;
padding: .3em 0;
height: 1.6em;
border-radius: 4px;
}
.items li a {
display: block;
text-decoration: none;
}
.items li:hover {
color: #607D8B;
background-color: #DDD;
left: .1em;
}
.items li.selected {
background-color: #CFD8DC;
color: white;
}
.items li.selected:hover {
background-color: #BBD8DC;
}
.items .text {
position: relative;
top: -3px;
}
.items .badge {
display: inline-block;
font-size: small;
color: white;
padding: 0.8em 0.7em 0 0.7em;
background-color: #607D8B;
line-height: 1em;
position: relative;
left: -1px;
top: -4px;
height: 1.8em;
margin-right: .8em;
border-radius: 4px 0 0 4px;
}
/*
Copyright 2017 Google Inc. All Rights Reserved.
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://angular.io/license
*/
<!DOCTYPE html>
<html>
<head>
<title>Pyroes Tourer</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="assets/app.css">
<link rel="stylesheet" href="styles.css">
<script src="anpylar_overlay.js"></script>
<script src="anpylar.js" async></script>
</head>
<body></body>
</html>
<!--
Copyright 2018 The AnPyLar Team
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://anpylar.com/mit-license
-->
{
"packages": [
"app"
],
"app_name": "",
"version": "",
"author": "",
"author_email": "",
"license": "",
"url": ""
}
/* Master Styles */
h1 {
color: #369;
font-family: Arial, Helvetica, sans-serif;
font-size: 250%;
}
h2, h3 {
color: #444;
font-family: Arial, Helvetica, sans-serif;
font-weight: lighter;
}
body {
margin: 2em;
}
body, input[text], button {
color: #888;
font-family: Cambria, Georgia;
}
a {
cursor: pointer;
cursor: hand;
}
button {
font-family: Arial;
background-color: #eee;
border: none;
padding: 5px 10px;
border-radius: 4px;
cursor: pointer;
cursor: hand;
}
button:hover {
background-color: #cfd8dc;
}
button:disabled {
background-color: #eee;
color: #aaa;
cursor: auto;
}
/* Navigation link styles */
nav a {
padding: 5px 10px;
text-decoration: none;
margin-right: 10px;
margin-top: 10px;
display: inline-block;
background-color: #eee;
border-radius: 4px;
}
nav a:visited, a:link {
color: #607D8B;
}
nav a:hover {
color: #039be5;
background-color: #CFD8DC;
}
nav a.active {
color: #039be5;
}
/* everywhere else */
* {
font-family: Arial, Helvetica, sans-serif;
}
/*
Copyright 2017 Google Inc. All Rights Reserved.
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://angular.io/license
*/
;(function(){
function add_overlay() {
var elem = document.createElement('div');
elem.id = 'anpylar-loading-overlay'
elem.style.cssText = 'position: fixed; width: 100%; height: 100%;' + 'min-height: 100%;' +
'left: 0;top: 0;background: rgba(224,224,224,0.33); z-index: 100000;'
document.body.appendChild(elem);
var elem4 = document.createElement('div');
elem4.innerHTML = '<h1 style="text-align:center;position:relative;top:46%;transform:translateY(-46%);">Loading ...</h1>'
elem4.style.cssText = 'position: fixed; width: 100%; height: 100%;' +
'left: 0;top: 0; z-index: 10002;'
elem.appendChild(elem4)
var keyframes = '\
#anpylar-loading-wheel {\
position: fixed;\
top: 50%;\
left: 50%;\
width: 150px;\
height: 150px;\
margin: -75px 0 0 -75px;\
border: 16px solid #f3f3f3;\
border-radius: 50%;\
border-top: 16px solid #3498db;\
width: 120px;\
height: 120px;\
animation: spin 2s linear infinite;\
z-index: 10001;\
}\
\
@keyframes spin {\
0% { transform: rotate(0deg); }\
100% { transform: rotate(360deg); }\
}';
var elem2 = document.createElement('style');
elem2.style.type = 'text/css'
elem2.id = 'anpylar-loading-overlay-style'
elem2.innerHTML = keyframes
document.head.appendChild(elem2)
var elem3 = document.createElement('div')
elem3.id = 'anpylar-loading-wheel'
elem.appendChild(elem3)
}
window.addEventListener('DOMContentLoaded', add_overlay, true)
})();