Need help with OMV framework

    • OMV 4.x
    • Resolved
    • Need help with OMV framework

      Hi all !

      I'm trying to tweak the omv graphs and dev a plugin for that after.
      I want to show multiple CPU graphs on the same page, side by side.

      At the moment, I'm stuck with a stupid thing and I cannot find the way it works in IOMV Framework.

      I just created a /var/www/openmediavault/js/omv/workspace/panel/RrdGraph2.js (almost the same as RrdGraph.js but with the HTML code to have 2 CPU core) with that code.

      Source Code

      1. /**
      2. * This file is part of OpenMediaVault.
      3. *
      4. * @license http://www.gnu.org/licenses/gpl.html GPL Version 3
      5. * @author Volker Theile <volker.theile@openmediavault.org>
      6. * @copyright Copyright (c) 2009-2018 Volker Theile
      7. *
      8. * OpenMediaVault is free software: you can redistribute it and/or modify
      9. * it under the terms of the GNU General Public License as published by
      10. * the Free Software Foundation, either version 3 of the License, or
      11. * any later version.
      12. *
      13. * OpenMediaVault is distributed in the hope that it will be useful,
      14. * but WITHOUT ANY WARRANTY; without even the implied warranty of
      15. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
      16. * GNU General Public License for more details.
      17. *
      18. * You should have received a copy of the GNU General Public License
      19. * along with OpenMediaVault. If not, see <http://www.gnu.org/licenses/>.
      20. */
      21. // require("js/omv/workspace/panel/Panel.js")
      22. // require("js/omv/Rpc.js")
      23. // require("js/omv/window/MessageBox.js")
      24. /**
      25. * @ingroup webgui
      26. * @class OMV.workspace.panel.RrdGraph2
      27. * @derived OMV.workspace.panel.Panel
      28. * Panel that is displaying RRD graphs.
      29. * @param rrdGraphName1 (required) The name of the RRD graph file. Such a
      30. * file looks like xxxxx-(hour|day|week|month|year).png.
      31. * @param rrdGraphName2 (required) The name of the RRD graph file. Such a
      32. * file looks like xxxxx-(hour|day|week|month|year).png.
      33. */
      34. Ext.define("OMV.workspace.panel.RrdGraph2", {
      35. extend: "OMV.workspace.panel.Panel",
      36. requires: [
      37. "OMV.Rpc",
      38. "OMV.window.MessageBox"
      39. ],
      40. uses: [
      41. "Ext.XTemplate"
      42. ],
      43. hideTopToolbar: false,
      44. autoLoadData: false,
      45. initComponent: function() {
      46. var me = this;
      47. var tpl = me.getTemplate();
      48. Ext.apply(me, {
      49. html: tpl.apply({
      50. name1: me.rrdGraphName1,
      51. name2: me.rrdGraphName2,
      52. time: Ext.Date.now()
      53. })
      54. });
      55. me.callParent(arguments);
      56. },
      57. getTemplate: function() {
      58. return Ext.create("Ext.XTemplate",
      59. '<div class="x-panel-rrdgraph">',
      60. ' <img src="rrd.php?name={name1}-hour.png&time={time}" alt="RRD graph - by hour"/>&nbsp;<img src="rrd.php?name={name2}-hour.png&time={time}" alt="RRD graph - by hour"/><br/>',
      61. ' <img src="rrd.php?name={name1}-day.png&time={time}" alt="RRD graph - by day"/>&nbsp;<img src="rrd.php?name={name2}-day.png&time={time}" alt="RRD graph - by day"/><br/>',
      62. ' <img src="rrd.php?name={name1}-week.png&time={time}" alt="RRD graph - by week"/>&nbsp;<img src="rrd.php?name={name2}-week.png&time={time}" alt="RRD graph - by week"/><br/>',
      63. ' <img src="rrd.php?name={name1}-month.png&time={time}" alt="RRD graph - by month"/>&nbsp;<img src="rrd.php?name={name2}-month.png&time={time}" alt="RRD graph - by month"/><br/>',
      64. ' <img src="rrd.php?name={name1}-year.png&time={time}" alt="RRD graph - by year"/>&nbsp;<img src="rrd.php?name={name2}-year.png&time={time}" alt="RRD graph - by year"/>',
      65. '</div>');
      66. },
      67. doLoad: function() {
      68. var me = this;
      69. OMV.RpcObserver.request({
      70. msg: _("Generating graphs ..."),
      71. rpcDelay: 1000,
      72. rpcData: {
      73. service: "Rrd",
      74. method: "generate"
      75. },
      76. scope: me,
      77. finish: function() {
      78. var tpl = this.getTemplate();
      79. this.update(tpl.apply({
      80. name1: this.rrdGraphName1,
      81. name2: this.rrdGraphName2,
      82. time: Ext.Date.now()
      83. }));
      84. }
      85. });
      86. }
      87. });
      Display All

      I'd like to have 2 string var passed to it, with "cpu-0" and "cpu-1" for both core of my CPU.

      So I tried to call it with a modified /var/www/openmediavault/js/omv/module/admin/diagnostic/system/Cpu.js

      Source Code

      1. /**
      2. * This file is part of OpenMediaVault.
      3. *
      4. * @license http://www.gnu.org/licenses/gpl.html GPL Version 3
      5. * @author Volker Theile <volker.theile@openmediavault.org>
      6. * @copyright Copyright (c) 2009-2018 Volker Theile
      7. *
      8. * OpenMediaVault is free software: you can redistribute it and/or modify
      9. * it under the terms of the GNU General Public License as published by
      10. * the Free Software Foundation, either version 3 of the License, or
      11. * any later version.
      12. *
      13. * OpenMediaVault is distributed in the hope that it will be useful,
      14. * but WITHOUT ANY WARRANTY; without even the implied warranty of
      15. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
      16. * GNU General Public License for more details.
      17. *
      18. * You should have received a copy of the GNU General Public License
      19. * along with OpenMediaVault. If not, see <http://www.gnu.org/licenses/>.
      20. */
      21. // require("js/omv/workspace/panel/RrdGraph2.js")
      22. /**
      23. * @class OMV.module.admin.diagnostic.system.plugin.Cpu
      24. * @derived OMV.workspace.panel.RrdGraph2
      25. */
      26. Ext.define("OMV.module.admin.diagnostic.system.plugin.Cpu", {
      27. extend: "OMV.workspace.panel.RrdGraph2",
      28. alias: "omv.plugin.diagnostic.system.cpu",
      29. title: _("CPU usage"),
      30. rrdGraphName1: "cpu-0",
      31. rrdGraphName2: "cpu-1"
      32. });
      Display All

      That doesn't work. I must missed something but I cannot find what...
      Any help is welcome.

      Thanks
      Lian Li PC-V354 with Be Quiet fans | Gigabyte GA-G33M-DS2R | Intel E8400@3,6Ghz | 6GB DDR2 RAM
      1x500MB SSD for System/Backup/Downloads | 7x2To HDD RAID 6 for Datas/Snapshots
      Powered by OMV v4.1.18 / Kernel 4.19

      The post was edited 2 times, last by sbocquet ().

    • Need help with OMV framework

      Sharing the URL to your GIT branch would help to easily test it.
      Absolutely no support through PM!

      I must not fear.
      Fear is the mind-killer.
      Fear is the little-death that brings total obliteration.
      I will face my fear.
      I will permit it to pass over me and through me.
      And when it has gone past I will turn the inner eye to see its path.
      Where the fear has gone there will be nothing.
      Only I will remain.

      Litany against fear by Bene Gesserit
    • Thanks Volker for your help,

      Unfortunatly at the moment, it's just on my test server as I haven't begin to correctly dev the plugin.
      I'm just trying to make it work at the moment, and wanted to know if I was doing it the right way or not, since I haven't gone deeper in the Template thing.

      Do you see any 'big' mistake ?

      Cheers,
      Lian Li PC-V354 with Be Quiet fans | Gigabyte GA-G33M-DS2R | Intel E8400@3,6Ghz | 6GB DDR2 RAM
      1x500MB SSD for System/Backup/Downloads | 7x2To HDD RAID 6 for Datas/Snapshots
      Powered by OMV v4.1.18 / Kernel 4.19
    • So nobody knows how I can have this RrdGraph2 Template with 2 string variable, and why it seems to never be called ? :(
      Lian Li PC-V354 with Be Quiet fans | Gigabyte GA-G33M-DS2R | Intel E8400@3,6Ghz | 6GB DDR2 RAM
      1x500MB SSD for System/Backup/Downloads | 7x2To HDD RAID 6 for Datas/Snapshots
      Powered by OMV v4.1.18 / Kernel 4.19
    • Are there any Javascript errors? Can you debug the existing and your new code using the browsers dev tools?
      Absolutely no support through PM!

      I must not fear.
      Fear is the mind-killer.
      Fear is the little-death that brings total obliteration.
      I will face my fear.
      I will permit it to pass over me and through me.
      And when it has gone past I will turn the inner eye to see its path.
      Where the fear has gone there will be nothing.
      Only I will remain.

      Litany against fear by Bene Gesserit
    • Check the file permissions of your JS file. Set OMV_DEBUG_EXTJS to YES.
      Absolutely no support through PM!

      I must not fear.
      Fear is the mind-killer.
      Fear is the little-death that brings total obliteration.
      I will face my fear.
      I will permit it to pass over me and through me.
      And when it has gone past I will turn the inner eye to see its path.
      Where the fear has gone there will be nothing.
      Only I will remain.

      Litany against fear by Bene Gesserit
    • Hi,

      I have modified /var/www/openmediavault/js/omv/module/admin/diagnostic/system/plugin/Cpu.js like this to point to my new Rrdgraph2.js

      Source Code

      1. /**
      2. * @class OMV.module.admin.diagnostic.system.plugin.Cpu
      3. * @derived OMV.workspace.panel.RrdGraph
      4. */
      5. Ext.define("OMV.module.admin.diagnostic.system.plugin.Cpu", {
      6. extend: "OMV.workspace.panel.RrdGraph2",
      7. alias: "omv.plugin.diagnostic.system.cpu",
      8. title: _("CPU usage & Temp."),
      9. rrdGraphName1: "cpu-0",
      10. rrdGraphName1: "cpu-1"
      11. });
      Display All

      Rights are correctly set for both files.

      I can't see any error in the debug tool of my browser, but the CPU panel vanishes from the WebUI...



      The only thing I have in "openmediavault-webgui_error.log" is :


      Source Code

      1. 2018/04/29 20:21:11 [error] 1754#1754: *5450 open() "/var/www/openmediavault/scss/_core.scss" failed (2: No such file or directory), client: 192.168.0.11, server: openmediavault-we
      2. bgui, request: "GET /scss/_core.scss HTTP/1.1", host: "home-server.famille-bocquet.fr", referrer: "diagnostics://3/"
      3. 2018/04/29 20:21:11 [error] 1754#1754: *5453 open() "/var/www/openmediavault/scss/_path.scss" failed (2: No such file or directory), client: 192.168.0.11, server: openmediavault-we
      4. bgui, request: "GET /scss/_path.scss HTTP/1.1", host: "home-server.famille-bocquet.fr", referrer: "diagnostics://3/"
      5. 2018/04/29 20:21:11 [error] 1754#1754: *5447 open() "/var/www/openmediavault/scss/_icons.scss" failed (2: No such file or directory), client: 192.168.0.11, server: openmediavault-w
      6. ebgui, request: "GET /scss/_icons.scss HTTP/1.1", host: "home-server.famille-bocquet.fr", referrer: "diagnostics://3/"
      7. 2018/04/29 20:21:11 [error] 1754#1754: *5455 open() "/var/www/openmediavault/scss/_extras.scss" failed (2: No such file or directory), client: 192.168.0.11, server: openmediavault-
      8. webgui, request: "GET /scss/_extras.scss HTTP/1.1", host: "home-server.famille-bocquet.fr", referrer: "diagnostics://3/"
      9. 2018/04/29 20:21:11 [error] 1754#1754: *5457 open() "/var/www/openmediavault/scss/_animated.scss" failed (2: No such file or directory), client: 192.168.0.11, server: openmediavaul
      10. t-webgui, request: "GET /scss/_animated.scss HTTP/1.1", host: "home-server.famille-bocquet.fr", referrer: "diagnostics://3/"

      Is there any other log file I should check with OMV_DEBUG_EXTJS set to YES ?

      Both files src are in the first post.
      Thanks,
      Lian Li PC-V354 with Be Quiet fans | Gigabyte GA-G33M-DS2R | Intel E8400@3,6Ghz | 6GB DDR2 RAM
      1x500MB SSD for System/Backup/Downloads | 7x2To HDD RAID 6 for Datas/Snapshots
      Powered by OMV v4.1.18 / Kernel 4.19
    • OMV does not use the Ext loader, thus you need to make sure that

      // require("js/omv/workspace/panel/RrdGraph2.js")

      is below the comment header in /var/www/openmediavault/js/omv/module/admin/diagnostic/system/plugin/Cpu.js.
      Absolutely no support through PM!

      I must not fear.
      Fear is the mind-killer.
      Fear is the little-death that brings total obliteration.
      I will face my fear.
      I will permit it to pass over me and through me.
      And when it has gone past I will turn the inner eye to see its path.
      Where the fear has gone there will be nothing.
      Only I will remain.

      Litany against fear by Bene Gesserit
    • F... this work at least !



      I was thinking that this code was some unused comments :( .
      Sorry, I'm a noob with JS and ExtJS...

      Thanks a lot Volker.
      Lian Li PC-V354 with Be Quiet fans | Gigabyte GA-G33M-DS2R | Intel E8400@3,6Ghz | 6GB DDR2 RAM
      1x500MB SSD for System/Backup/Downloads | 7x2To HDD RAID 6 for Datas/Snapshots
      Powered by OMV v4.1.18 / Kernel 4.19

      The post was edited 2 times, last by sbocquet ().

    • Volker (or any other),

      Each time I update to the latest version of OMV 4, I have to put back my .js modified files (no problem for me), but I also go back to where I was in post 9: no CPU tab.
      Sometime, and I don't know how (!), I can fix it and get it work.

      Is there some kind of JS "cache" to be clean/reset after each update?

      Thx for the help,
      Lian Li PC-V354 with Be Quiet fans | Gigabyte GA-G33M-DS2R | Intel E8400@3,6Ghz | 6GB DDR2 RAM
      1x500MB SSD for System/Backup/Downloads | 7x2To HDD RAID 6 for Datas/Snapshots
      Powered by OMV v4.1.18 / Kernel 4.19
    • Use omv-firstaid and select 'Clear web control panel cache'.
      Absolutely no support through PM!

      I must not fear.
      Fear is the mind-killer.
      Fear is the little-death that brings total obliteration.
      I will face my fear.
      I will permit it to pass over me and through me.
      And when it has gone past I will turn the inner eye to see its path.
      Where the fear has gone there will be nothing.
      Only I will remain.

      Litany against fear by Bene Gesserit