/**************************************/ /* SUITE BAR DISPLAY FOR ADMIN OPT-IN */ /**************************************/ /* Setting the flag on the admin page */ $(window).load(function($){ if(localStorage.getItem(‘suiteBar’) === ‘true’){ jQuery(‘.message’).html(‘SharePoint Suite Bar Status: ON’); } else { jQuery(‘.message’).html(‘SharePoint Suite Bar Status: OFF’); } jQuery(‘.suite-bar-opt-in’).click(function(){ localStorage.setItem(‘suiteBar’,’true’); jQuery(‘.message’).html(‘SharePoint Suite Bar Status: ON’); }); jQuery(‘.suite-bar-opt-out’).click(function(){ localStorage.setItem(‘suiteBar’,’false’); jQuery(‘.message’).html(‘SharePoint Suite Bar Status: OFF’); }); }); if(localStorage.getItem(‘suiteBar’) […]
jQuery(‘#s4-bodyContainer’).html(jQuery(‘#s4-bodyContainer’).html().replace(/\u200B|\u200C|\u200D|\uFEFF| \;/g,”)); jQuery(‘#s4-bodyContainer’).find(‘br’).last().remove();
// IE Detection (for alternative since icon font is being blocked) if((navigator.appVersion.indexOf(‘MSIE’)!== -1)||(navigator.appVersion.indexOf(‘Windows’)!== -1)){ rm.isIE = true; $(‘html’).addClass(‘ie’); }
You can use commas in the console.log() to add spaces You can set multiple variables (comma delimited) in the first argument of a ‘for’ loop myArray.forEach(function(entry){ console.log(entry.prop1, entry.prop2); }); // entry is the current object Note: ‘For’ loops are faster Some important JavaScript array methods… .filter() = Return a subset of an array based on the conditions […]
var numbers = [1, 4, 9]; var roots = numbers.map(Math.sqrt); // roots is now [1, 2, 3], numbers is still [1, 4, 9]
JavaScript jQuery promises… Widgets.peopleHeader = { name: ‘People Header’, log: true, promise: new $.Deferred() … $.when(Widgets.peopleHeader.promise).done(function () { …
View only: In React, event handlers modify the “state”, and whenever the state is modified, React automatically calls render() again to update the UI You can nest components render: function() { return ( <p className=”secondary”> <PrimaryComponentName /> Resources Comprehensive Beginner’s Guide to ReactJS ReactJS Tutorial React.js Introduction For People Who Know Just Enough jQuery To […]
var testData = queryResponse.PrimaryQueryResult.RelevantResults.Table.Rows[0]; if (testData !== undefined) { return testData.Cells; } In this example, testData holds the result of the query so we can use it in a conditional and then return it without having to run the query again and again.
Node.js Install npm globally if you don’t already have it (check versions with node -v and npm -v) Run npm init command to initialize the package.json file to provide information about the project and help manage the dependencies… example… { “name”: “my_project”, “version”: “0.0.0”, “devDependencies”: { “gulp”: “~3.8.8” }, “dependencies”: { “jquery”: “~2.1.3”, “react”: “~0.13.1” } } devDependencies: These are […]
Chrome extension is just some HTML, CSS and JavaScript that allows you to add some functionality to Chrome through some of the JavaScript APIs Chrome exposes. An extension is basically just a web page that is hosted within Chrome and can access some additional APIs Browser Action extension is a basic Chrome extension manifest.json … […]
Using the minus or division math operator will coerce a string into a number … “123”-0 = 123 Never “==” to true or false, always “===”, because “==” will match falsy things like 0 == allows coercion (checks value) – implicit === disallows coercion (checks value and type) – explicit
Check if Karma is installed globally npm list -g –depth=0 The Master/Detail View paradigm is the most common real-world application for MV* frameworks The organization of your code should show intent and be self-documenting… node_modules src (project files / root … includes index.html and favicon.ico) app individual app JS files for controllers, templates, etc. main (main […]
JavaScript has syntax AND grammar Expressions and statements Statements are 1:1 and end with a semicolon (e.g. a = b * 2;) ‘2’ is a numerical expression ‘b’ is an identifier expression ‘b * 2’ is a mathematical expression ‘a = b * 2’ is a statement expression JavaScript uses operator precedence, but added unnecessary parenthesis […]
A powerful API to store and sync data in realtime. Steps Install <script src=’https://cdn.firebase.com/js/client/2.2.1/firebase.js’></script> Reference (URL for your Firebase data) var myDataRef = new Firebase(‘https://xze3eg07ah9.firebaseio-demo.com/’); Write data with .set() method on a Firebase reference (write an object too) – myDataRef.set({name: name, text: text}); … In this example, when the object {name: name, text: text} is set, […]
SharePoint has a nasty habit of fooling JavaScript into thinking the DOM is loaded when there are actually still elements popping in afterwards. Here’s a dirty script for testing the existence of a given element when you’re in a pinch… var wnt_spTimer, wnt_spElement; wnt_spTimer = window.setInterval(function(){ wnt_spElement = $(‘div[data-widget=”tools”] .heading-main h2’).length; if(wnt_spElement === 0){ console.log(‘******** […]
Google provides the ability to script spreadsheets via JavaScript and their library’s methods. Tools > Script editor… function DOUBLE(input) { return input * 2; // EXAMPLE … =DOUBLE(A2) }
See the Pen Super Simple requestAnimationFrame Thing by Taylor Johnson (@webninjataylor) on CodePen.
You can create custom jQuery events with jQuery’s .on() method and then trigger your custom event with jQuery’s .trigger() method.
Event delegation is monitoring events on descendants via a common parent. This reduces overhead and allows for descendants not yet created to inherit the functionality. In addition, the term Event Bubbling is when an event is fired on an element and it “bubbles” up the DOM to the nearest ancestor with a handler for that […]