Restore webapps progress without JavaScript - javascript

So I have this web app http://goo.gl/qxqhfm and I would like to save the progress (all client side) and restore it next time user opens it, but restore should run without JavaScript, that is users without JavaScript support should be able to load their content.
The app is a bit buggy, e.g. you cant write on orange note before you move it and you cant move the purple one before you enter image url, I'm working on it.
Edit:App is tested only on Chrome
Edit:Is it even posible, to do it wihout JS, and if is, then what language do I use and how is it usualy done?

While that is possible, it will be very difficult.
Using the server-side language of your choice, and honestly, any of them could do it, you would simply load the data that was saved and embed it on the page.
If you want to render it, as if the JavaScript ran, you might want to look at node.js which is a server-side JavaScript engine and see if you can generate the needed HTML. PHP also has some kind of HTML tools to generate markup, but I know very little about it.
All in all, I really doubt it is worth the effort. Who is running without JavaScript in today's world?

Related

How to bypass JavaScript detection when using requests in Python?

So there is a problem with JavaScript and requests (in Python) and that is, it does not use JavaScript when requesting a webpage.
The website I'm working with (https://access.paylocity.com/) requires JavaScript and without it, it changes the content of the page to just a text at the top saying, "Please enable JavaScript to view the page content."
(I could be wrong here but) I think one solution is the use of Selenium, but that would replace requests which I'm fine with as long as there are no other ways of fixing/bypassing this JavaScript detection.
(For those wondering, this python project of mine is supposed to automatically fetch the events on the Paylocity calendar, then port those events to another calendar that I frequently use everyday. It's also just intended for myself.)
Edit: Here is the code I have if that will help https://pastecode.io/s/GXTUO1BgtR (I didn't know where to paste my code, so I decided on that website. If I should change it, please comment or say something about it.)
Since the website you're working with is dynamically loading the JS as far I can tell, I think you have no other choice as to making use of Selenium. I had a project on my own a couple weeks ago and run into a similar problem which I could also solve using Selenium. But, I'm no expert, I'm just giving away my thoughts on this.

Integrating an HTML GUI and Python with heavy computation

I'm just now tapping into real GUI-heavy stuff and I'm looking to integrate a GUI for a Python 3 application/("game"?). I need this to be cross-platform, responsive, and able to communicate with other users and a server.
I've looked at desktop application creation but I think that the best thing would be a web application. Now, here are the obstacles:
I need the web app to be able to use all my Python 3 code as its black box; it needs to be able to send a function call to the running python code.
More often than not, everything on the page is changed if a single value is changed.
If another user changes a value, it would affect multiple other users instantaneously.
I can't have the page constantly refresh.
The HTML "GUI" needs to have some degree of separation from the Python code. (I can't have Python sending snippets of HTML, only data is allowed.)
I realize that this is a lot to address, so my question then is:
How would one go about making a web app that has specific (most) data values update consistently without having to refresh the entire page?
My proposed solution would have some sort of simplistic javascript constantly checking to see if anything has been posted for the users closely interacting with each other (players in the same server, if you will). Each value in the HTML would have a linked javascript function which is linked to a value or function in the backend python code.
"Player" changes value on webpage -> JavaScript function call -> Python black box on "Server" -> JavaScript checking loop sees that there has been a change via simple Python variable on "Server" -> JavaScript gets all values via calls to functions in python code -> Update HTML for all "Players"
Finally, please note, I have no idea how to carry out my proposed solution, and I very much welcome a different, better approach. Thanks in advance.
So, for anyone who is trying to do the same thing as me, the answer is something called "websockets".
I initially tried Kivy, but found that it was too cumbersome and just hard to get good styling in. Using HTML, CSS, and JavaScript, you can make pretty fancy looking stuff, and Kivy just isn't robust enough to make something attractive without having to write tons of excess code. Since what I'm trying to make is basically a styled data readout/hud, the HTML combination takes the cake.
What I'm currently using for the websockets is a module called "Tornado" which allows you to update any data on the client side without them reloading the page. I'm sending this data as a single JSON to update the whole page.
In conclusion, I decided on HTML/CSS/JavaScript for the GUI and Python/Tornado for fast server-side computation.

Use multiple html pages or show/hide divs with javascript

First of all, I have a background in C (++), Java, MATLAB and Python, mainly used for scientific and electronic applications (Math operation on data, reading data from sensors, microcontrollers).
But i'm relatively new to both HTML (CSS) and Javascript.
For both I've read some books. In HTML books, multiple pages are done by links (<a></a>).
In javascript (which feels a lot more natural to me than HTML), I've seen some examples where there is only 1 html page, full of divs, who are shown and hiden each time a certain page needs to be shown.
This is done with the Jquery command $('#div1').hide() and $('#div2').show();
Now my question is, what is the best practice? When is it better to have multiple HTML pages, and when is it better to have just hide/show divs with Javascript?
Thanks
Not Every one Can Use Javascript. Not Every Computer Or Browser Has The Basics Of Java Installed. But Every Computer Can Read HTML every Browswer Can Read HTML.
To identify If a visitor is using java.
How to check whether Java plugins are installed or not in a browser using Code .?
Java is mostly installed now days with the browser some basic functions. But older navigator or IE browsers dont always have it installed by default.
More Info Here also
How can I detect the Java runtime installed on a client from an ASP .NET website?
The easiest is using <ul><li> css navigation themes. Check this site out for more info.
https://medialoot.com/blog/how-to-create-a-responsive-navigation-menu-using-only-css/
When you have multiple html pages and user clicks on links, then on each click a new web page has to be fetched from server and then rendered.
Whereas when you do it in java script the same web page will be altered, so there are no additional requests to the server. And this will be much faster than loading a new web page.
But remember the initial loading time is second approach is longer but its negligible.
Let me point out that there is no "best practice" to the question that you are asking. It is entirely up to the team if they want to push all the content in one page or keep them separately.
If in case you have a content that requires decent amount of images to be loaded, or contents that you are sure will rarely be seen, you might want to keep them in separate pages so as to make the page load faster.
If you have heavy contents which requires a lot of interaction with javascript/jQuery then you certainly might want to keep them in separate pages so that later when you want to debug/add to the code it can be easily done.
The vice versa of the above holds true as well.
If in case you just have small content, or simple text content then you can easily do it in a single page.
Maybe you should use a tab component ? bootstrap wraps one very nicely:
http://getbootstrap.com/javascript/
Maybe thats the best approach, also take a look at angular.js routes in specific, it should do what ever you are looking for.

Hide source code

I have basic knowledge of html css. I don't want my content to be stolen by people. I want to display content only on my web-page and not on source code. So how can I achieve that?
I cant find a reason to protect your html code. You can go anywhere you want and download the html and css code if you want to, but there is not a good reason to do that.
If you write code in HTML, CSS or JavaScript there is no way you can "protect" your code. They are client side languages, this means your code is executed by that client (anybody).
Client side code is always execute on the client machine. I don't think you need to take care of this because all your logic at server side is not visible to client.
If you want to hide client code there is no way of doing that, but you can use minification just to make unreadable to the end user. But there are tool available in market which can undo the minification also
No you can't.
Because the web browser needs to download the HTML, JavaScript and CSS files to view the web page, there's no way to perfectly hide this. (None of the major browsers even try to do this, and even if they did, it would be easy to work around.)
Instead, what you can do is obfuscate the code. This doesn't hide the code (so it can still be copied) but it makes it harder to understand. This doesn't make it impossible, though, and someone who tries hard enough will eventually manage to do it.

How to make a local copy of a html page be run as if it was the online version?

I'm a bit new to programming and I've been having a problem trying to open an html document as if it was opened through the page itself. I'm thinking I need to create a proxy for my browser whenever it opens the file, but I'm not certain.
The reason I need this is because when the file is stored locally it conflicts with how it runs and leaves somethings.
EDIT: Solved, my site uses AJAX, making it impossible for what I want.
Storing websites that you did not author for later offline use can be challenging. This may or may not work depending on the scripts being used. Your best bet is to check the file for absolute paths, and change them to relative if possible.
i.e: <img src="http://google.com/img/test.jpg"> to <img src="img/test.jpg">
The same goes for all javascript and CSS.
This is assuming there isn't any 2 way communication with javascript after the page loads. If it uses any AJAX or polling you are basically screwed.
Any reason you need this offline? Is it just data, or data plus UI interaction?
If only data, you may be able to save it in another format for later viewing.
If you need the graphical interaction, or you need it to update once online again you may be out of luck.

Categories

Resources