a good afternoon,
I tried to soften the following flow in my dashboard. Dashboard slideshow gallery
I only see that it changes with my photo that are in the folder, only I get no picture at all with dashboard. what's wrong? and how can i fix this.
here at the flow:
[{"id":"59c23b01.d78674","type":"ui_button","z":"65644409.d5fedc","name":">","group":"d2e998ef.e44f08","order":5,"width":1,"height":1,"passthru":true,"label":"","tooltip":"","color":"","bgcolor":"","icon":"fa-chevron-right","payload":"next","payloadType":"str","topic":"","x":550,"y":580,"wires":[["12b30e1d.7e5542"]]},{"id":"c24613ec.5dfd1","type":"ui_button","z":"65644409.d5fedc","name":"<","group":"d2e998ef.e44f08","order":4,"width":1,"height":1,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"fa-chevron-left","payload":"previous","payloadType":"str","topic":"","x":550,"y":610,"wires":[["12b30e1d.7e5542"]]},{"id":"fef5b40f.538648","type":"ui_button","z":"65644409.d5fedc","name":"<<","group":"d2e998ef.e44f08","order":3,"width":1,"height":1,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"grey","icon":"fast_rewind","payload":"first","payloadType":"str","topic":"","x":550,"y":490,"wires":[["12b30e1d.7e5542"]]},{"id":"a1645ac9.756e38","type":"ui_button","z":"65644409.d5fedc","name":">>","group":"d2e998ef.e44f08","order":6,"width":1,"height":1,"passthru":true,"label":"","tooltip":"","color":"","bgcolor":"grey","icon":"fast_forward","payload":"last","payloadType":"str","topic":"","x":550,"y":520,"wires":[["12b30e1d.7e5542"]]},{"id":"1913948d.eb97bb","type":"ui_button","z":"65644409.d5fedc","name":"play","group":"d2e998ef.e44f08","order":8,"width":1,"height":1,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"play_arrow","payload":"play","payloadType":"str","topic":"","x":550,"y":430,"wires":[["12b30e1d.7e5542","e26a4b9c.dcb3d8"]]},{"id":"8dce426b.e5d1e","type":"ui_button","z":"65644409.d5fedc","name":"pause","group":"d2e998ef.e44f08","order":9,"width":1,"height":1,"passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"pause","payload":"pause","payloadType":"str","topic":"","x":550,"y":460,"wires":[["12b30e1d.7e5542","e26a4b9c.dcb3d8"]]},{"id":"d42cdbf4.b3c288","type":"function","z":"65644409.d5fedc","name":"action case","func":"let action = msg.payload; //what to navigate ?\nlet numSlides = msg.numSlides; //total pictures in the \"files\" array\nlet slideIndex = flow.get(\"slideIndex\") || 0; //index position picture\nlet gateSlide = flow.get(\"gateSlide\")||0; // play or pause\n\n switch (action) {\n case \"play\":\n flow.set (\"gateSlide\", true);\n break;\n case \"pause\":\n flow.set (\"gateSlide\", false);\n break;\n case \"first\": \n slideIndex = 0;//go to first\n break; \n case \"last\":\n slideIndex = numSlides-1;//got to last\n break;\n case \"del\"://**********DELETE PICTURE **********\n msg.fileName = flow.get(\"slides\")[slideIndex]; //Tx: name picture\n node.send([null,{ // 2nd output : \n fileName:msg.fileName, path:msg.path, numSlides:msg.numSlides,slideIndex:slideIndex\n }]); \n return msg\n case \"next\":\n slideIndex++;\n if(gateSlide === true){\n if (slideIndex > numSlides - 1) slideIndex = 0; //repeat if played\n } else {\n if (slideIndex > numSlides - 1) slideIndex = numSlides-1; //stay at last if next\n }\n break;\n case \"previous\": \n slideIndex--;\n if (slideIndex < 0) slideIndex = 0; //stay on first\n break;\n default:\n break;\n }\nmsg.affSlideIndex = slideIndex+1; //Tx N° picture\nflow.set(\"slideIndex\", slideIndex); //save position for next time\nmsg.slideIndex=slideIndex; //Tx position picture\n\n//get name picture from slideIndex position in the \"slides\" array\nmsg.fileName = flow.get(\"slides\")[msg.slideIndex]; //Tx: picture name\n\n//alternative message if Folder is empty\nif (numSlides === 0) {\n msg.fileName = \"Empty Folder ! \";\n msg.affSlideIndex = 0; //Tx N° picture\n}\nnode.status({\"text\" : msg.fileName}); //under the node\n\n\nreturn msg;\n\n\n\n\n","outputs":2,"noerr":0,"initialize":"","finalize":"","libs":[],"x":870,"y":500,"wires":[["ec22ec57.728cf"],["7c2276ac.1c37b8"]]},{"id":"17020f90.5b295","type":"fs-ops-dir","z":"65644409.d5fedc","name":"","path":"path","pathType":"msg","filter":"*","filterType":"str","dir":"files","dirType":"msg","x":780,"y":380,"wires":[["a0a2796f.2cfa88"]]},{"id":"a0a2796f.2cfa88","type":"change","z":"65644409.d5fedc","name":"set array in flow.slides","rules":[{"t":"set","p":"slides","pt":"flow","to":"files","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":950,"y":380,"wires":[["51a3f66.6f0ab08"]]},{"id":"51a3f66.6f0ab08","type":"function","z":"65644409.d5fedc","name":"Set numSlides","func":"let totalPic = flow.get(\"slides\").length; //get sise of array\nnode.status({text:totalPic}); // display under node\nmsg.numSlides = totalPic;//Tx: numSlides = total pictures in the files array\nreturn msg;\n\n/* Tx en sortie : \n\n*/","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":1140,"y":380,"wires":[["d42cdbf4.b3c288"]]},{"id":"9a65fa80.217758","type":"inject","z":"65644409.d5fedc","name":"Go","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":"1","topic":"","payload":"Initialize pictures","payloadType":"str","x":410,"y":380,"wires":[["61e8a9fd.cc5e48"]]},{"id":"61e8a9fd.cc5e48","type":"function","z":"65644409.d5fedc","name":"set path","func":"//let path=flow.get('picturePath');\npath = \"/home/pi/Desktop/fotos /nood\";\n//flow.set ('picturePath',path); //save picturePath : le chemin du dossier des pictures\nmsg.path = path;\nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":650,"y":380,"wires":[["17020f90.5b295"]]},{"id":"2e89e1aa.db15fe","type":"link in","z":"65644409.d5fedc","name":"getPath","links":["12b30e1d.7e5542","1a896f6d.7a1971"],"x":565,"y":380,"wires":[["61e8a9fd.cc5e48"]]},{"id":"12b30e1d.7e5542","type":"link out","z":"65644409.d5fedc","name":"getPath","links":["2e89e1aa.db15fe"],"x":665,"y":500,"wires":[]},{"id":"7c2276ac.1c37b8","type":"fs-ops-delete","z":"65644409.d5fedc","name":"del","path":"path","pathType":"msg","filename":"fileName","filenameType":"msg","x":1050,"y":580,"wires":[["ec49c26d.02bc4"]]},{"id":"1a896f6d.7a1971","type":"link out","z":"65644409.d5fedc","name":"getPath","links":["2e89e1aa.db15fe"],"x":1255,"y":510,"wires":[]},{"id":"ec49c26d.02bc4","type":"function","z":"65644409.d5fedc","name":"Stay at last","func":"let slideIndex = msg.slideIndex;\nlet numSlides = msg.numSlides;\n if (slideIndex==numSlides-1) {\n msg.payload=\"previous\"\n } \n else { msg.payload=\"refresh\" } \nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":1210,"y":640,"wires":[["1a896f6d.7a1971"]]},{"id":"fcf45582.e33608","type":"switch","z":"65644409.d5fedc","name":"flow gate filter Switch","property":"gateSlide","propertyType":"flow","rules":[{"t":"eq","v":"1","vt":"num"}],"checkall":"true","repair":false,"outputs":1,"x":950,"y":650,"wires":[["59c23b01.d78674"]]},{"id":"d89eb0b1.757f1","type":"trigger","z":"65644409.d5fedc","name":"2s","op1":"","op2":"","op1type":"pay","op2type":"pay","duration":"-2","extend":false,"units":"s","reset":"","bytopic":"all","outputs":1,"x":680,"y":650,"wires":[["40f3dfb2.c4b66"]]},{"id":"416ff6ca.c893f8","type":"inject","z":"65644409.d5fedc","name":"","repeat":"","crontab":"","once":true,"onceDelay":"1","topic":"","payload":"Sequencer","payloadType":"str","x":550,"y":650,"wires":[["d89eb0b1.757f1"]]},{"id":"40f3dfb2.c4b66","type":"function","z":"65644409.d5fedc","name":"Gate","func":"let read = flow.get(\"gateSlide\");\nlet status = read ? \"Opened\" : \"Closed\";\nlet color = read ? \"green\" : \"red\";\nnode.status({fill:color,shape:\"ring\",text:status});\nreturn msg;","outputs":1,"noerr":0,"x":790,"y":650,"wires":[["fcf45582.e33608"]]},{"id":"e26a4b9c.dcb3d8","type":"ui_text","z":"65644409.d5fedc","group":"d2e998ef.e44f08","order":10,"width":2,"height":1,"name":"play/pause","label":"{{msg.payload}}","format":"","layout":"row-left","x":700,"y":430,"wires":[]},{"id":"56886666.3eaec8","type":"image","z":"65644409.d5fedc","name":"","width":160,"data":"flow","dataType":"msg","thumbnail":false,"active":true,"pass":false,"outputs":0,"x":1680,"y":560,"wires":[]},{"id":"ec22ec57.728cf","type":"ui_template","z":"65644409.d5fedc","group":"d2e998ef.e44f08","name":"img","order":1,"width":10,"height":8,"format":"<!DOCTYPE html>\n<html>\n<head>\n<style>\ndiv.parent {\n position: relative;\n height: 480px ;\n}\ndiv.absolute {\n position: absolute;\n width: 100%;\n bottom: 0px;\n} \n\n</style>\n</head>\n<body>\n <div class=\"parent\">\n <div class=\"absolute\" >\n <img src=\"/camAlerte/{{msg.fileName}}\" alt=\"Camera Picture\" style=\"width:100%\"><br>\n {{msg.fileName}} {{msg.affSlideIndex}}/{{msg.numSlides}} \n </div>\n </div>\n</body>\n</html>\n<!--EXPLICATION : https://www.w3schools.com/cssref/tryit.asp?filename=trycss_position_bottom -->\n\n<!-- ////// SIMPLE VERSION //////////\n<style> \nimg {\n width: 100%;\n height: auto;\n border:1px solid green;\n}\n</style>\n<body>\n<div >\n<img src= \"/camAlerte/{{msg.fileName}}\" alt=\"Camera Picture\" ><br>\n</div>\n</body>\n\n\n\n\n-->\n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1390,"y":480,"wires":[["56886666.3eaec8"]]},{"id":"d2e998ef.e44f08","type":"ui_group","name":"Slideshow","tab":"b123e6c8.d3e948","order":1,"disp":true,"width":"10","collapse":false},{"id":"b123e6c8.d3e948","type":"ui_tab","name":"Slide","icon":"dashboard","order":1,"disabled":false,"hidden":false}]
and the picture of dashboard:
