Posts

Showing posts with the label jStorage

jQuery style switcher

It's often the case that you want to provide more than one CSS stylesheet for your app or website. You can do this by including a style switching function in your app. Here's how to do it in jQuery. The solution uses jStorage to store the user's preference between sessions, but you could use cookies instead. Here is the jQuery: $(document).ready(function () {     var myStyle = $.jStorage.get('myStyle', '');     if (myStyle !== '') {         $("#colors").attr("href", myStyle);     }     $('.styleswitch').on('click', function () {         $("#colors").attr("href", $(this).attr('resource'));         $.jStorage.set('myStyle', $(this).attr('resource'), { TTL: 28800000 });         return false;     }); }); Here is the HTML in the <head> section: <link rel="stylesheet" type="text/css" href="css/colors.css" id="colors"/> And h...

AngularJS style switcher

It's often the case that you want to provide more than one CSS stylesheet for your app or website. You can do this by including a style switching function in your app. Here's how to do it in AngularJS. In the HTML, create a button for each stylesheet that you want to switch between, and pass in the filename of the stylesheet as a variable: <button ng-click="changeStyle('colors.css')" id="pink">Brookes Pink</button><br /> <button ng-click="changeStyle('colors-lime.css')" id="lime">Brookes Lime</button><br /> <button ng-click="changeStyle('colors-muted.css')" id="muted">Muted colours</button><br /> <button ng-click="changeStyle('colors-dark.css')" id="dark">Dark colours</button> You will also need to put the ng-app attribute in the <html> element, and an angular variable in the path to...

Angular with a Moodle webservice

Getting Angular to work with a Moodle webservice I am building an application to get Json data from a Moodle web service, and using AngularJs to display the data in the app. There are multiple functions on the Moodle webservice, so I need multiple controllers in the Angular app. I am using Visual Studio and Cordova to write the app. I have come up with a solution for getting the token from Moodle, storing it using jstorage, and displaying it on the various panes of the single-page mobile app. Step 1. Get web token from where you stored it in jstorage (in myApp.js) moodleUrl = 'https://moodle.yourwebsite.com/webservice/rest/server.php' ; session = $ . jStorage . get ( 'session' , '' ); // syntax: $.jStorage.get(keyname, "default value") moodlewsrestformat = 'json' ; wstoken = session ; concatUrl = moodleUrl + '?moodlewsrestformat=' + moodlewsrestformat + '&wstoken=' + wstoken + '&wsfunction=' ; Step...