Atlas
Atlas copied to clipboard
Custom Homepage : Atlas
Expected behavior
Edit in the "home.html" file in the Atlas-2.14.1/js/pages/home/ directory should be reflected on the webpage.
Actual behavior
The changes to the Home page are not being reflected, while other modifications like in the banner are applied correctly. I suspect it might be related to the translation tool, but I'm not sure.
Steps to reproduce behavior
I download Atlas from the Git repository
edit the home.html file in the Atlas-2.14.1/js/pages/home/ directory to include additional details about my institution.
built the image and modified the dockerfile.yml (in Broadsea 3.1) to consider the new image.
Do you have any suggestions or insights into the right way to do it? Thank you very much for your time.
I think you need to re-compile the application.
When I build the image to put it in my Broadsea container, that recompiles the app in one way or another, as some changes on the banner are reflected but not on the homepage.
Broadsea uses pre-build images, they are not compile the application on the fly.
You may need to build your custom Docker image, as compilation is done here: https://github.com/OHDSI/Atlas/blob/master/Dockerfile#L14
That's what I did, but perhaps not in the best way. Here is my process:
-
Applied some changes in the file 'Atlas-2.14.1/index.html.'
-
Applied some changes in 'Atlas-2.14.1/js/page/home/home.html.'
-
In the root of the 'Atlas-2.14.1' folder, I built my image using the command:
docker build -t myAtlas:latest .
-
Then, in my 'Broadsea_3.1' folder, I modified the 'dockerfile.yml' file to launch the image I just built.
Thanks to this, I can see the modifications I made in the 'index.html' file, but unfortunately, I don't see the changes I made in the 'home.html' file
The flow is correct. Could it be your browser cache?
Not the browser cache, I tried on Chrome and Firefox, and forced a hard reload on both. For me, this comes from the syntax :
<div data-bind="html: ko.i18n('home.description', 'ATLAS is an open source application developed as a part of <a href=\'http://www.ohdsi.org\' target=\'_new\'>OHDSI</a> intended to provide a unified interface to patient level data and analytics.')"></div>
Nothing is written between <div></div>
.
It all gets passed to the ko.i18n()
function that links to something, but I don't know exactly what and how to proceed.
Thank you for your help!
The html binding is controlling what is placed into the div, so you aren't able to put content inside the div while the html data binding is controlling it. You could just add your own div after that one.
Here is my 'home.html' file with some new <div>
elements to test.
And here is the result:
None of the test tags are displayed on the home page. However, the modification of the index file is well taken into account because there is no 'data-bind' in the file.
I don't know how to figure this out..
My understanding is that the app will serve from the bundle....so you can disable that by changing the content in the index.html:
<!-- non-bundled mode -->
<script data-main="js/main" src="js/require.js"></script>
<!-- bundled mode -->
<!-- <script data-main="js/assets/bundle/bundle" src="js/require.js"></script>-->
By default we operate in non-bundled mode, but in your Docker index.html it may reference the bundle.
So try to modify the index.html as above so that it will load the files from the indivvidual templates (like home.html) and it should see your changes.
It was set to non-bundled mode by default, so I changed it to the other one, and it worked.
If I let on Bundled mode, will this have any impact on the tool's capabilities?
I'm surprised that the bundled mode saw the change because non-bunded mode would read directly from the individual files for rendering (which is what I thought you were modifying) while the bundled files requires a 'build step' to combine the individual files into a bundle.
If I let on Bundled mode, will this have any impact on the tool's capabilities?
No, it's the same codebase, just packaged differently to speed up download speed. It does make tracing through code in the dev console harder (because bundled code is compressed down and harder to read) but it will have same functionality.
As a final test: if you go back to non-bundled mode, you can view the 'sources' tab in chrome and see the individual files that are downloaded. You can find the home.html download and see if it has your changes in it, and you can also see the URL path to the file that was fetched which may indicate that you're modifying files in a different location than they are being served from.