How To: Add a new setting #28
-
|
Hi! I had mentioned in #23 that I was planning to implement a feature:
I need some help to get started. The first step would be to add a new setting and make it both visible and changeable via the web app. All I know so far is that the I'd like to add a boolean setting to E.g. Do new settings need to be What is next? E.g. how do I add a slider to the web app? How do I add captions in different languages, etc.? Thank you for your support. |
Beta Was this translation helpful? Give feedback.
Replies: 4 comments 8 replies
-
|
The code is designed in a way that it's quite simple to add a new feature to the app. You basically don't need to touch the app code at all, since the UI is dynamically generated automatically. To implement a new setting, you need to do the following (if I remember correctly):
This should be all that is needed. If you have any questions, feel free to ask. I hope that I didn't forget anything. |
Beta Was this translation helpful? Give feedback.
-
|
Thanks, Clemens! That was a good starting point. As my setting affects the
Then building the software again does not seem to be enough: And restarting the application did not make the setting appear in the web app. Do you also need to run If so, I'd need some further help here, please: Edit: with the contents of the log file being... |
Beta Was this translation helpful? Give feedback.
-
|
Yes, you are right. We have to rebuild the app in order to include the new setting. The code is generated during building, not during runtime. Sorry, I forgot. I have tried this in the last hours and am finally able to build the app again. 🎉 It turns out, that the package.json file had some dependencies missing as well as a wrong one..? I'm not sure how this even worked before. So, hopefully, you should be able to build the app as follows: ➜ ~ npm -v
8.4.1
➜ ~ node -v
v17.5.0
sudo npm i -g @ionic/cli
➜ web git:(tutorial/add_new_setting) npm installThis may complain about deprecated dependencies, but will hopefully install everything you need. |
Beta Was this translation helpful? Give feedback.
-
|
Info Uninstalling node sudo apt remove nodejs
sudo apt purge nodejs
sudo apt autoremove Interestingly, npm and node still worked, so I ran the following commands (taken from here: https://stackoverflow.com/questions/32426601/how-can-i-completely-uninstall-nodejs-npm-and-node-in-ubuntu): sudo rm -rf /usr/local/bin/npm
sudo rm -rf /usr/local/share/man/man1/node*
sudo rm -rf /usr/local/lib/dtrace/node.d
rm -rf ~/.npm
rm -rf ~/.node-gyp
sudo rm -rf /opt/local/bin/node
sudo rm -rf /opt/local/include/node
sudo rm -rf /opt/local/lib/node_modules
sudo rm -rf /usr/local/lib/node*
sudo rm -rf /usr/local/include/node*
sudo rm -rf /usr/local/bin/node*Now trying to run npm or node does not work (command not found). Reinstalling Node I ran the following commands: Then I needed to open a new terminal, since the nvm command did not work directly. In the new terminal, it worked: So at this point, npm and node worked fine for me. Now I did the following: Hope, that this helps you. |
Beta Was this translation helpful? Give feedback.
-
|
Clemens, thank you very much for your patience and your help. I really appreciate it! This is the first time I really get in touch with node/npm. The last time I've done something with JavaScript was, when you only ran it in your web browser. Your step-by-step guidance was pretty helpful! Some remarks (might be interesting for others reading this discussion, not you and me):
Unfortunately, the setting still does not show on the web app. But I'll keep playing around with that. |
Beta Was this translation helpful? Give feedback.
-
|
Is this probably related to having "multiple apps"? The file |
Beta Was this translation helpful? Give feedback.
-
|
I'm glad to hear that the guide helped! As soon as the app is rebuilt (using build.sh, it also generates the JS files for the protobuf api), the new setting will be included. Basically it is like this:
Therefore my theory is: Could it be that you have rebuilt the app, but not the self-o-mat software? In this case, the self-o-mat software would still serve the old outdated version of the app. Try cleaning and rebuilding the app. You could also push your current repository somewhere, then I could take a look if you like. |
Beta Was this translation helpful? Give feedback.
-
|
Yes, thank you. I think needing to rebuilding the self-o-mat (C++) software in addition was one thing. |
Beta Was this translation helpful? Give feedback.
-
|
I have created a new branch and implemented the minimal changes needed for a new setting. Note that the app in this branch was not rebuilt, so you can use it to test your setup. The important changes are: 0726aa0 |
Beta Was this translation helpful? Give feedback.
Yes, you are right. We have to rebuild the app in order to include the new setting. The code is generated during building, not during runtime. Sorry, I forgot.
I have tried this in the last hours and am finally able to build the app again. 🎉
It turns out, that the package.json file had some dependencies missing as well as a wrong one..? I'm not sure how this even worked before.
So, hopefully, you should be able to build the app as follows:
0. I have the following versions of node and npm installed: