I have the developer installation complete and have the repository cloned into my eclipse. The file structure is certainly complex and I don’t have a good understanding of it. Would anyone be able to guide me toward where I can find the files that correspond to the home page? I’m looking for something like an html file or another file that contains the html code.
My goal is to make a simple cosmetic change to that file to ensure I can see the change on my local OpenMRS page. Thank you!
Well, that depends on what you mean by “home page”. We have several:
Note that if you edit the page in the OpenMRS source code and want to to show up in a server you’ve deployed using the SDK, you’ll need to run mvn clean install openmrs-sdk:deploy and restart the SDK server to see your changes. For code developed in OpenMRS modules, you can use the SDK’s watch command, though I’m not sure if that works for the openmrs-core repo or not.
@ibacher thank you for this thoughtful reply! I don’t think I took a step to install the Legacy UI, nor the reference application. Though, because I am unfamiliar with them, I can’t say that for sure because I don’t know if they would have installed jointly with any other installation piece. I’ve posted the home page I was referring to below. I see that the url (http://localhost:8081/openmrs/referenceapplication/home.page) mentions “referenceapplication” , but I also see in the picture below that that I don’t have a user interface module installed.
Below is what I see in my eclipse when I follow the path from your third bullet. Is there a step I need to take to access the html? Do you recommend a certain interface?
I’m glad you mentioned the later information as well because I’ve been trying to get a good gauge for what steps are necessary to see changes. The watch command is something I was excited to implement to save time, but based on what you said it seems maybe I should focus on that when I find a module to contribute to long term! To contribute to a module, would I need to clone a new repository from the github into my eclipse?
I’m actually joining OpenMRS with a group of students, and we are ultimately hoping to find a good module for us to focus on trying to make code contributions to, one that maybe has less interdependencies and is easier to get a good grasp on. Do you have any suggestions?
when you look at the interface you have currently, it shows that openmrs platform is installed but no user interface,and i see you need to install the reff app module so as to come up with the home page you want, checkout this https://wiki.openmrs.org/display/docs/Reference+Application+dev+environment+setup
Personally I don’t use Eclipse very much, but I believe if you right-click on the “index.htm” file, you should see an option that’s something like “Open With → Editor” that should allow you to view the HTML. But note that that page only gets displayed when you don’t have UI installed and from your screen shot, it looks like you have the reference app installed on your SDK server, more on that below.
So the page you’re showing in the screenshot here is the RefApp home page, which means we should be fairly easily able to do something to it.
So the first thing we need to do is replace the version of the Reference Application module on your server with one running from local source code. To do that, you want to checkout this GitHub repo to your local machine and then run mvn clean install openmrs-sdk:watch. This should prompt you to select your SDK installed server and then do the setup that’s necessary to reload changes live. However, for this to kick in, you need to actually restart the SDK server, which you can do by killing it in the terminal window (ctrl-c normally) and then simply re-running it with mvn openmrs-sdk:run.
Now, if you open the openmrs-module-referenceapplication source code in your preferred editor and navigate to omod/src/main/webapp/pages/home.gsp, we should be able to modify the page. For these purposes, I’m just going to add something short and ugly to the bottom of the home page. To do this, I added a line at the bottom of the file that looks like this:
<div class="row col-12">Look, Ma! I added some text!</div>
And on refreshing the page in my browser, I can now see the text I’ve added:
Now, lets go for something a little more dramatic. Say, for example, I want to change the color of the header bar to a different color.
In my browser, I can right-click on the header and select “Inspect Element” and then ensuring I’ve selected the header element, I see these CSS properties:
Hovering over the referenceapplication.css file above, I can see that the full URL is: http://localhost:8686/openmrs/ms/uiframework/resource/referenceapplication/styles/referenceapplication.css (My server is running on port 8686; yours will likely say 8081, since that’s the port you’ve configured it to run on). Ignoring most of that URL for the moment, we can see that it’s loading the CSS file from the referenceapplication module and the file is called styles/referenceapplication.css. Going back to the referenceapplication module source code, we can find the corresponding file in omod/src/main/webapp/resources/styles/referenceapplication.css and if I move down to line 766 I can see a block that defines the styles for the header element, including this line:
background-color: #00463f;
Let’s change that to something else, for instance:
background-color: darkred;
And once again refreshing the page, I can see the result reflected:
Hopefully that’s enough to start playing around with. Note that the whole of the reference application UI is a bit convoluted and focusing on the home page is a bit of a simpler experience that focusing on some of the other pages, but that’s maybe a topic for another day.
Let me know if you have any questions!
cc: @rainbow I think I mentioned something about having some task-focused beginning developer documentation. While I’m not sure that what I’ve outlined above meets any real-world needs, maybe this could serve as a starting-point for some of that? At least it seems like a fairly simply way to make some changes you can see.
Thanks! I will look into this.
@ibacher Thank you again for taking the time to help me with this! I have been trying to go through the steps you proposed, but have been unable to successfully build with this command.
Prior to my error, I cloned the referenceapplication module and ran mvn clean install openmrs-sdk:watch. This is a snippet of the first error I got ( I’m just including it for reference):
[ERROR] Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) on project referenceapplication-api: Compilation failure: Compilation failure: [ERROR] Source option 6 is no longer supported. Use 7 or later. [ERROR] Target option 6 is no longer supported. Use 7 or later.
I believe I fixed it by updating my pom.xml file by changing the source and target from 1.6 to 1.7.
My build then failed from a different error (though it got farther along in the build process after my update to the pom.xml file). I’m not sure what the problem is now. My full output is here: WARNING: An illegal reflective access operation has occurredWARNING: Illegal r - Pastebin.com
I appreciate any insight you may have.
