diff --git a/static/css/themes/default.css b/static/css/themes/default.css index d951f66..4e906e6 100644 --- a/static/css/themes/default.css +++ b/static/css/themes/default.css @@ -13,3 +13,21 @@ padding-left:2%; padding-right:2%; align-self:center; } .main .pane {border-left:1px solid #CAD5E0; height:100%; padding:8px;} + +.busy-loading { + background: linear-gradient(90deg, #d3d3d3,#f3f3f3, #000000, #d3d3d3); + animation: gradient 15s ease infinite; + height:28; width:100%; +} +@keyframes gradient { + 0% { + background-position: 0% 50%; + } + 50% { + background-position: 100% 50%; + } + 100% { + background-position: 0% 50%; + } +} + diff --git a/static/js/bootup.js b/static/js/bootup.js new file mode 100644 index 0000000..357da63 --- /dev/null +++ b/static/js/bootup.js @@ -0,0 +1,75 @@ +/** + * This file has functions that allow pages to be fetched and rendered on bootup +*/ + +var bootup = {} +// +// We implement this function using an observer design pattern +bootup.CMSObserver = function(_sysId,_domId,_fileURI){ + this._domId = _domId + this._fileURI = _fileURI + this.apply = function (_caller){ + var http = HttpClient.instance() + http.setHeader('uri',_fileURI) + var uri = sessionStorage[_sysId]+'/page' + try{ + var _domElement = jx.dom.get.instance('div') + + _domElement.className = 'busy-loading' + jx.dom.append(_domId, _domElement) + + http.post(uri,function(x){ + // console.log(jx.dom.exists(_domId)) + // var _domElement = jx.dom.get.instance('div') + // _domElement.className = 'busy-and-loading' + // jx.dom.append(_domId, _domElement) + if (x.status == 200){ + // jx.dom.set.value(_domId,x.responseText) + // var _domElement = jx.dom.get.instance('div') + // _domElement.innerHTML = x.responseText + + + setTimeout(function(){ + _domElement.innerHTML = x.responseText + _domElement.className = null + },1500) + + + } + + _caller.notify() + }) + + }catch(error){ + _caller.notify() + } + } + +} +// +// Finalize the process of rendering the content on the fly +bootup.finalize = function(_id){ + this.apply = function(_caller){ + menu.runScript('#'+_id) + } +} + +bootup.init = function(sys_id,_layout){ + if (_layout){ + jx.utils.keys(_layout.on.load).forEach(function(_domId){ + + var observers = + jx.utils.patterns.visitor(_layout.on.load[_domId], function(_uri){ + return new bootup.CMSObserver(sys_id,_domId,_uri) + }) + observers.push(new bootup.finalize(_domId)) + // + // At this point we can execute the observer design pattern + // + // console.log(observers) + jx.utils.patterns.observer(observers,'apply') + + }) + } + +} \ No newline at end of file diff --git a/templates/index.html b/templates/index.html index 8eb7465..e28b382 100644 --- a/templates/index.html +++ b/templates/index.html @@ -38,6 +38,7 @@ Vanderbilt University Medical Center +