45091

how to insert html code generated in javafx fxml project in an existing web page?

Question:

I created a javafx fxml application project named "Login".It is working fine and I successfully made the project to run in browser (Firefox). while creating the project in Netbeans IDE 8.1 for the above project, it's html file was automatically created under the name "Login.html".

Login.html

<pre class="snippet-code-html lang-html prettyprint-override"><html><head> <SCRIPT src="./web-files/dtjava.js"></SCRIPT> <script> function launchApplication(jnlpfile) { dtjava.launch( { url : 'Login.jnlp', jnlp_content : 'PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxqbmxwIHNwZWM9IjEuMCIgeG1sbnM6amZ4PSJodHRwOi8vamF2YWZ4LmNvbSIgaHJlZj0iTG9naW4uam5scCI+DQogIDxpbmZvcm1hdGlvbj4NCiAgICA8dGl0bGU+TG9naW48L3RpdGxlPg0KICAgIDx2ZW5kb3I+c2FjaGk8L3ZlbmRvcj4NCiAgICA8ZGVzY3JpcHRpb24+bnVsbDwvZGVzY3JpcHRpb24+DQogICAgPG9mZmxpbmUtYWxsb3dlZC8+DQogIDwvaW5mb3JtYXRpb24+DQogIDxyZXNvdXJjZXM+DQogICAgPGoyc2UgdmVyc2lvbj0iMS42KyIgaHJlZj0iaHR0cDovL2phdmEuc3VuLmNvbS9wcm9kdWN0cy9hdXRvZGwvajJzZSIvPg0KICAgIDxqYXIgaHJlZj0iTG9naW4uamFyIiBzaXplPSIxNjA3OCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5LmphciIgc2l6ZT0iMjc2NzQ1NSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2NzLmphciIgc2l6ZT0iOTQ0MDMiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9kZV9ERS5qYXIiIHNpemU9IjEwNjUyOCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2VzLmphciIgc2l6ZT0iMTAwNjQzIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfZnIuamFyIiBzaXplPSIxMDY2NTMiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9odS5qYXIiIHNpemU9Ijk1MTA3IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfaXQuamFyIiBzaXplPSIxMDA0OTEiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9qYV9KUC5qYXIiIHNpemU9IjExNzEyNiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2tvX0tSLmphciIgc2l6ZT0iMTExNTQ1IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfcGwuamFyIiBzaXplPSI5MzA4NCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX3B0X0JSLmphciIgc2l6ZT0iOTAzNDAiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9ydS5qYXIiIHNpemU9IjEyMDk1MiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX3poX0NOLmphciIgc2l6ZT0iMTAzNDY4IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfemhfVFcuamFyIiBzaXplPSIxMDUwNTMiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieWNsaWVudC5qYXIiIHNpemU9IjU3NzU5OSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5bmV0LmphciIgc2l6ZT0iMjQ5ODc0IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlydW4uamFyIiBzaXplPSI4MTgxIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnl0b29scy5qYXIiIHNpemU9IjIxMjk5MiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGpmb2VuaXguamFyIiBzaXplPSIyMjE5Njg3IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogIDwvcmVzb3VyY2VzPg0KPHNlY3VyaXR5Pg0KICA8YWxsLXBlcm1pc3Npb25zLz4NCjwvc2VjdXJpdHk+DQogIDxhcHBsZXQtZGVzYyAgd2lkdGg9IjgwMCIgaGVpZ2h0PSI2MDAiIG1haW4tY2xhc3M9ImNvbS5qYXZhZngubWFpbi5Ob0phdmFGWEZhbGxiYWNrIiAgbmFtZT0iTG9naW4iID4NCiAgICA8cGFyYW0gbmFtZT0icmVxdWlyZWRGWFZlcnNpb24iIHZhbHVlPSI4LjArIi8+DQogIDwvYXBwbGV0LWRlc2M+DQogIDxqZng6amF2YWZ4LWRlc2MgIHdpZHRoPSI4MDAiIGhlaWdodD0iNjAwIiBtYWluLWNsYXNzPSJsb2dpbi5Mb2dpbiIgIG5hbWU9IkxvZ2luIiAvPg0KICA8dXBkYXRlIGNoZWNrPSJhbHdheXMiLz4NCjwvam5scD4NCg==' }, { javafx : '8.0+' }, {} ); return false; } </script> <script> function javafxEmbedlogin() { dtjava.embed( { id : 'login', url : 'Login.jnlp', placeholder : 'javafx-app-placeholder', width : '800', height : '600', jnlp_content : 'PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxqbmxwIHNwZWM9IjEuMCIgeG1sbnM6amZ4PSJodHRwOi8vamF2YWZ4LmNvbSIgaHJlZj0iTG9naW4uam5scCI+DQogIDxpbmZvcm1hdGlvbj4NCiAgICA8dGl0bGU+TG9naW48L3RpdGxlPg0KICAgIDx2ZW5kb3I+c2FjaGk8L3ZlbmRvcj4NCiAgICA8ZGVzY3JpcHRpb24+bnVsbDwvZGVzY3JpcHRpb24+DQogICAgPG9mZmxpbmUtYWxsb3dlZC8+DQogIDwvaW5mb3JtYXRpb24+DQogIDxyZXNvdXJjZXM+DQogICAgPGoyc2UgdmVyc2lvbj0iMS42KyIgaHJlZj0iaHR0cDovL2phdmEuc3VuLmNvbS9wcm9kdWN0cy9hdXRvZGwvajJzZSIvPg0KICAgIDxqYXIgaHJlZj0iTG9naW4uamFyIiBzaXplPSIxNjA3OCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5LmphciIgc2l6ZT0iMjc2NzQ1NSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2NzLmphciIgc2l6ZT0iOTQ0MDMiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9kZV9ERS5qYXIiIHNpemU9IjEwNjUyOCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2VzLmphciIgc2l6ZT0iMTAwNjQzIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfZnIuamFyIiBzaXplPSIxMDY2NTMiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9odS5qYXIiIHNpemU9Ijk1MTA3IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfaXQuamFyIiBzaXplPSIxMDA0OTEiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9qYV9KUC5qYXIiIHNpemU9IjExNzEyNiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2tvX0tSLmphciIgc2l6ZT0iMTExNTQ1IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfcGwuamFyIiBzaXplPSI5MzA4NCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX3B0X0JSLmphciIgc2l6ZT0iOTAzNDAiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9ydS5qYXIiIHNpemU9IjEyMDk1MiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX3poX0NOLmphciIgc2l6ZT0iMTAzNDY4IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfemhfVFcuamFyIiBzaXplPSIxMDUwNTMiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieWNsaWVudC5qYXIiIHNpemU9IjU3NzU5OSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5bmV0LmphciIgc2l6ZT0iMjQ5ODc0IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlydW4uamFyIiBzaXplPSI4MTgxIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnl0b29scy5qYXIiIHNpemU9IjIxMjk5MiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGpmb2VuaXguamFyIiBzaXplPSIyMjE5Njg3IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogIDwvcmVzb3VyY2VzPg0KPHNlY3VyaXR5Pg0KICA8YWxsLXBlcm1pc3Npb25zLz4NCjwvc2VjdXJpdHk+DQogIDxhcHBsZXQtZGVzYyAgd2lkdGg9IjgwMCIgaGVpZ2h0PSI2MDAiIG1haW4tY2xhc3M9ImNvbS5qYXZhZngubWFpbi5Ob0phdmFGWEZhbGxiYWNrIiAgbmFtZT0iTG9naW4iID4NCiAgICA8cGFyYW0gbmFtZT0icmVxdWlyZWRGWFZlcnNpb24iIHZhbHVlPSI4LjArIi8+DQogIDwvYXBwbGV0LWRlc2M+DQogIDxqZng6amF2YWZ4LWRlc2MgIHdpZHRoPSI4MDAiIGhlaWdodD0iNjAwIiBtYWluLWNsYXNzPSJsb2dpbi5Mb2dpbiIgIG5hbWU9IkxvZ2luIiAvPg0KICA8dXBkYXRlIGNoZWNrPSJhbHdheXMiLz4NCjwvam5scD4NCg==' }, { javafx : '8.0+' }, {} ); } <!-- Embed FX application into web page once page is loaded --> dtjava.addOnloadCallback(javafxEmbedlogin); </script> </head><body> <h2>Test page for <b>Login</b></h2> <b>Webstart:</b> <a href='Login.jnlp' onclick="return launchApplication('Login.jnlp');">click to launch this app as webstart</a><br><hr><br> <!-- Applet will be inserted here --> <div id='javafx-app-placeholder'></div> </body></html>

I tried very hard to insert the above html code in another html code (from a downloaded website template)but failed. I don't know what i am doing wrong. Please help me.

Answer1:

I found out the answer myself. It is very easy to integrate netbeans generated html file for javafx fxml project with a ready made template. Suppose you want your javafx fxml project's html file to integrate with the html file given below:

<pre class="snippet-code-html lang-html prettyprint-override"><html> <head> <title> sachin vashistha</title> <h2> i am sachin vashistha</h2> </head> <body> <h2>i am in body</h2> </body> </html>

Now take Login.html file (given in question). In this function named "launchApplication()" is used for web start. If you want to embed your code in ready made html file then we need these two things from Login.html : 1) part of the script having function javafxEmbedlogin() 2) body part of Login.html

Here is the integrated ready made html file:

<pre class="snippet-code-html lang-html prettyprint-override"><html> <head> <title> sachin vashistha</title> <h2> i am sachin vashistha</h2> <SCRIPT src="./web-files/dtjava.js"></SCRIPT> <script> function javafxEmbedlogin() { dtjava.embed( { id : 'login', url : 'Login.jnlp', placeholder : 'javafx-app-placeholder', width : '400', height : '600', jnlp_content : 'PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxqbmxwIHNwZWM9IjEuMCIgeG1sbnM6amZ4PSJodHRwOi8vamF2YWZ4LmNvbSIgaHJlZj0iTG9naW4uam5scCI+DQogIDxpbmZvcm1hdGlvbj4NCiAgICA8dGl0bGU+TG9naW48L3RpdGxlPg0KICAgIDx2ZW5kb3I+c2FjaGk8L3ZlbmRvcj4NCiAgICA8ZGVzY3JpcHRpb24+bnVsbDwvZGVzY3JpcHRpb24+DQogICAgPG9mZmxpbmUtYWxsb3dlZC8+DQogIDwvaW5mb3JtYXRpb24+DQogIDxyZXNvdXJjZXM+DQogICAgPGoyc2UgdmVyc2lvbj0iMS42KyIgaHJlZj0iaHR0cDovL2phdmEuc3VuLmNvbS9wcm9kdWN0cy9hdXRvZGwvajJzZSIvPg0KICAgIDxqYXIgaHJlZj0iTG9naW4uamFyIiBzaXplPSIxNjI2MCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5LmphciIgc2l6ZT0iMjc2NzQ1NCIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2NzLmphciIgc2l6ZT0iOTQ0MDUiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9kZV9ERS5qYXIiIHNpemU9IjEwNjUyOSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2VzLmphciIgc2l6ZT0iMTAwNjQxIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfZnIuamFyIiBzaXplPSIxMDY2NTIiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9odS5qYXIiIHNpemU9Ijk1MTA1IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfaXQuamFyIiBzaXplPSIxMDA0OTEiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9qYV9KUC5qYXIiIHNpemU9IjExNzEyNyIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX2tvX0tSLmphciIgc2l6ZT0iMTExNTQ0IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfcGwuamFyIiBzaXplPSI5MzA4MyIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX3B0X0JSLmphciIgc2l6ZT0iOTAzNDEiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieUxvY2FsZV9ydS5qYXIiIHNpemU9IjEyMDk1MSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5TG9jYWxlX3poX0NOLmphciIgc2l6ZT0iMTAzNDY2IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlMb2NhbGVfemhfVFcuamFyIiBzaXplPSIxMDUwNTEiIGRvd25sb2FkPSJlYWdlciIgLz4NCiAgICA8amFyIGhyZWY9ImxpYlxkZXJieWNsaWVudC5qYXIiIHNpemU9IjU3NzU5OSIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGRlcmJ5bmV0LmphciIgc2l6ZT0iMjQ5ODczIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnlydW4uamFyIiBzaXplPSI4MTgxIiBkb3dubG9hZD0iZWFnZXIiIC8+DQogICAgPGphciBocmVmPSJsaWJcZGVyYnl0b29scy5qYXIiIHNpemU9IjIxMjk5MiIgZG93bmxvYWQ9ImVhZ2VyIiAvPg0KICAgIDxqYXIgaHJlZj0ibGliXGpmb2VuaXguamFyIiBzaXplPSIyMjE5Njg1IiBkb3dubG9hZD0iZWFnZXIiIC8+DQogIDwvcmVzb3VyY2VzPg0KPHNlY3VyaXR5Pg0KICA8YWxsLXBlcm1pc3Npb25zLz4NCjwvc2VjdXJpdHk+DQogIDxhcHBsZXQtZGVzYyAgd2lkdGg9IjQwMCIgaGVpZ2h0PSI2MDAiIG1haW4tY2xhc3M9ImNvbS5qYXZhZngubWFpbi5Ob0phdmFGWEZhbGxiYWNrIiAgbmFtZT0iTG9naW4iID4NCiAgICA8cGFyYW0gbmFtZT0icmVxdWlyZWRGWFZlcnNpb24iIHZhbHVlPSI4LjArIi8+DQogIDwvYXBwbGV0LWRlc2M+DQogIDxqZng6amF2YWZ4LWRlc2MgIHdpZHRoPSI0MDAiIGhlaWdodD0iNjAwIiBtYWluLWNsYXNzPSJsb2dpbi5Mb2dpbiIgIG5hbWU9IkxvZ2luIiAvPg0KICA8dXBkYXRlIGNoZWNrPSJhbHdheXMiLz4NCjwvam5scD4NCg==' }, { javafx : '8.0+' }, {} ); } <!-- Embed FX application into web page once page is loaded --> dtjava.addOnloadCallback(javafxEmbedlogin); </script> </head> <body> <b>Webstart:</b> <a href='Login.jnlp' onclick="return launchApplication('Login.jnlp');">click to launch this app as webstart</a><br><hr><br> <!-- Applet will be inserted here --> <div id='javafx-app-placeholder'></div> </body> </html>

Recommend