Persistent copy&paste for jstree nodes - javascript

The default way to set up copy&paste with jstree as described in the documentation is easy enough and works well, but only within the scope of JavaScript variables context of the loaded page.
Specifically, if I select copy and then paste that will work. However, if I select copy, then reload the page, paste will not work since the data about copy is lost now.
How can I make this work? I guess something will need to be stored and retrieved from a cookie. Where do I find that? Also, is there an existing option in the plugin for this use case?

Depending on your audience, I would try to implement a copy/paste through html5 local storage. For some simple text copying and such it should be fairly easy to implement.
Html 5 local storage is just a key:value pair that is stored on the users local web browser memory. Therefore it'll be maintained through a web browser reload. Heck it even should be able to be saved if they accidentally close out of the browser completely!
I think with a little javascript, and if you use a library like JQuery, it shouldn't be too hard to implement. You could even have the added benefit of multiple copies enabled as you could just have multiple key:value pairs.
Take a look at a tutorial I found that I think is pretty good to get an idea of how to start with it:
http://paperkilledrock.com/2010/05/html5-localstorage-part-one/

As far as I understand you can write a new plugin for jstree to get this done.
Take a look here to see how the current CRRM Plugin is implemented.(CRRM plugin is included by default with jstree. Serach for CRRM in the above linked file if you find it difficult to locate the place).
I guess you can take a look how it is implemented and implement the methods in a similar way but with persistence.

Related

How to create a template creator with moveable objects?

Good day,
I am currently working on an automatic system that generates invoices with data that it receives from an API. I am currently doing this with Django (Python) to create some variation. Well, I want to create a system with which you can easily create templates for these invoices. You have seen these kinds of systems before. You can move blocks with items such as a logo or text wherever you want. Well I know that these templates are further stored as HTML. Only nowhere I can find clear information about how I can easily assemble such a system or how such a system works. Below I show a GIF of the system what I want. If anyone has any information on this I will be very happy if you can share that with me :)
Only nowhere I can find clear information about how I can easily assemble such a system
Yes, because making such a system is not an easy feat. You shouldn't do it yourself unless you know what you're doing and you are ready to deal with a lot of edge cases.
That being said, there are libraries that enable you to create such interfaces. One being https://interactjs.io/ (not affiliated with them). Then you need a WYSIWYG/Markdown editor that can be enabled on click as a tooltip. For example, https://www.tiny.cloud/
Then you need to find a way to save and load everything. Depending on the library you use, you might be able to get away saving and loading the HTML. However, it's more likely you'll need to implement a proprietary way of saving data. For example, using JSON or XML.
Best of luck!

Lock out part of the code so nobody except the desired developers can modify it

We have an angular application that contains a controller that we need to keep "private" so nobody except the developers in charge can actually change that code.
The rest of the team should be able to use that part without being able to modify it, but they should be able to modify the rest of the application.
Do you guys know if there is a way to do that?
EDIT: Using VCS is one possible solution, we use GitHub, I need to find a way of checking that the source is not modified. Sorry for the lack of information in the original question.

How to save JavaScript variables and pass them to the next page with jQuery?

So plain and simple, I need a way to save around 50 variables and pass them to the next page to print them out again.
I cannot use a server-side language such as PHP. This must be completely with jQuery/JavaScript.
So to explain the project a little more: I have a large form that will be doing some simple calculations. I need to save all of these variables, including the calculation totals, and create a table on a new page to print them out into so that they are in a nice format. I will then offer two options, to print the table, or to email the table.
There may be a far better alternative than saving the variables and passing them to the next page, although I am just looking for guidance on exactly how to approach this.
I am not asking anyone to write mountains of code for me, just suggestions.
All help and advice is greatly appreciated.
PS. This web app is being created mainly for iOS devices.
Cookies or localStorage are the way to go. Preferably localStorage since it has a much better API and can store more data.
According to caniuse.com it's supported in all major browsers. Additionally, the MDN page I linked above contains code that falls back to cookies if localStorage is not available (but of course that restricts the maximum size to whatever limit cookies in that browser have).
iOS supports localStorage, so, simply do :
localStorage.setitem("yourKey", "yourValue");
and
localStorage.getitem('yourKey');

LocalStorage in Firefox extension

Has Firefox extension personal LocalStorage? And how can I get access to it?
I know about window.content.localStorage, but it the specific localStorage of the current page, not like in Google Chrome, where each extension has personal background page.
You can use the simple-storage module for storing content specifically for your addon that is not bound to a specific page like localStorage, and you also can use the indexed-db module, which is a bit more robust, and we are kind of moving away from simple-storage.
simple-storage would be an ideal solution, but if you're using the Add-on Builder Helper it's not ideal because the storage gets flushed every time you make a change to the code and reload the app. Thus, it's impossible to test that your code works properly without actually building the extension and going to test it in another browser profile, making it hard to tweak the code and make minor changes.
Instead, I used the simple-prefs module, which did actually persist across restarts:
var prefs = require("simple-prefs").prefs;
The downside is everything has to be serialized as a string, so the development overhead is a little bit more complicated, but once you get it setup you can then test your code more easily without having to build the XPI for each minor change, something the Add-on Builder is supposed to help you avoid.

Persist JavaScript values between pages

I am trying to create a quiz on a web-page using HTML and JavaScript. Each question (having 4 options to choose from) is a seperate html file but uses the same JavaScript file to evaluate whether the choice entered is right or wrong.
However, I’m struggling to find a way to keep track of the number of correct answers provided by the users to calculate his/her score.
Is there a method to create static or static-like variables in JavaScript? Solutions involving cookies are also appreciated.
One possible solution is to load the HTML from your question file into a parent page, but have the whole quiz on that one page. That way, you still get the flexibility of having different pages for each question, but to the browser they are all one page. In addition, any variables created or traked in Javascript will persist throughout the entire quiz.
This is fairly easy to do with Jquery's .load function. You have a div in the middle of your page which loads its content from whichever HTML page you would have navigated to.
Do keep in mind that it is trivially easy for me to go into Javascript and change the number of correct answers. In fact, that problem exists for any client side solution. Should this be for more than fun, and accuracy is important, you may want to send results back to your server after each question. That way, no matter how you implement the quiz, results are persisted back on your end.
Have a look at http://www.electrictoolbox.com/jquery-cookies/
This allows you to easily set and read cookies.
You can keep the data in cookie. however an user may change the cookie and produce better result. Using session is a better choice in this scenario. because whatever you store in client side is unsafe.
However It is better to get the questions in json format with xhr and display them in browser and keep the track in memory
If you are developing a HTML5 application you may wish to investigate DOM storage facilities such as localStorage and sessionStorage: https://developer.mozilla.org/en-US/docs/DOM/Storage
Here are some useful resources / info:
http://ejohn.org/blog/dom-storage/
http://viralpatel.net/blogs/introduction-html5-domstorage-api-example/
http://msdn.microsoft.com/en-us/library/cc197062(v=vs.85).aspx
These days I would focus on making this a one-page app rather than relying on page loads. This not only has the advantage of solving your problem, it also means a more responsive, faster experience for the user.
If you must use page transitions, and you're happy to work with modern browsers only, look into localStorage. Far easier to use and more flexible than cookies - it works just like a serialised JavaSCript object.

Categories