Författararkiv: George

Om George

Founder of the Boolean algebra

A mixin for everything and all on retina screens

Problem: You have styles you want for regular screens, and styles you want for retina screens. Mostly images with different sizes, but sometimes font sizes or widths.

I was faced with this recently and got annoyed at the amount of repeating I had to do. First it’s the fuck ugly syntax of the media queries, then it’s the browser compatibility, and then I have to repeat it all over my Sass document for different screen sizes and everything else that can change

Queue trying to build a handy mixin for it all

This is what I came up with:

It’s a mixin that takes three arguments. The first ($maxwidth) handles the actual media query and when the rule should be applied. The second ($attribute) handles what attribute is affected. Here you put font-size, background-image or something like it. And the last one handles the value of the attribute, so what size should the font be, or what background image do you want.

It is quite handy! Just use it whenever you want something styled for a retina screen. Since you can reuse it for all attributes and screen sizes, it shourtens the code you have to write quite a lot.

Using it like this:

Will compile to this:

I used it for my app Counting Down and as far as I know it doesn’t work in LESS

How to stop the ItemUpdated-event from refiring itself in an remote event receiver

tl;dr: If you have trouble with stopping the updated-event from firing, compare what you want to change in the beforeProperties and afterProperties. If they are different, you should go ahead with your update, otherwise not.

This was my scenario: I had created a remote event receiver that was attached to a document library and was supposed to act whenever an item in the list was updated. The initialization of the event receiver looks like this:

And all was fine in the world. The event receiver was nicely attached and got busy when I uploaded a document. But then it started acting out and making trouble. I was trying to change permissions on an item and this was the part of my code that was creating the problems:

Inside my SPRemoteEventType.ItemUpdated I did an Update and making it trigger itself. Recursive SharePoint with no end in site.. If you’re dealing with a event receiver with access to server side code, this is not a problem.

Writing that makes your world pink and sparkly again. But this is the barren end empty world of the remote event receiver and no such this is available.

How I solved it

Googleing this helped me not one bit and my first solution was something I would like to hide at the bottom of some server (I don’t want to talk about it, let’s just say it had something to do with counting the seconds since the last update).

At your disposal on SPRemoteEventProperties you have afterProperties and beforeProperties, found by doing this:

And those were the key to the problem: how to act on the firing only when the user changes something and not when it updates itself? By comparing the values in the beforeProperties with the afterProperties I could see if they contained a difference. If it doesn’t, the updating event should not happen again.

In my case I was changing the value of a custom property named CMIsSecret, so if that property was the same in beforeProperties as in afterProperties (the values before and after the save) I should go on with the update, otherwise not. This was the method I created:

It checks if the property exists at all (it doesn’t if it is an ItemAdded-event and the property is custom made) and if it differs. It returns true if the property should be updated and the final usage looked like this:

Where ”ChangePermissionSettings” changes and updates the item.

Hope it helps!

Basic REST request to SharePoint using Postman

I wanted to share this tutorial on how to consume SharePoint’s REST service using the HTTP client Postman. I have to do this on a daily basis but keep forgetting the details and have to Google it, but Google is not that helpful and I get results that are unnecessarily complex.

I’m using a development environment and am logged in as a user with permission to read the data I’m requesting, which is a requirement. It takes to steps, first we have to prove that Postman is authenticated and then we can request the data.

Getting authenticated

Type in

into the input field and make sure it’s a POST-request. Now we need to add a header, to tell SharePoint what kind of data we want back, so click on the ”Headers” button at the top right corner. At the left side on the new lines that appear, enter Accept. At the right side enter application/json; odata=verbose. It should now look something like this:

rest-1

Then click send and you get the results back. Copy the FormDigestValue, which is a really long string ending with a date and time. Mine looked like this:

Getting data

Change the URL to, for example,

and it should still be a POST-request. The accept-header should look the same, but now you need to add the FormDigestValue as another header. To the left, enter X-RequestDigest and to the right enter the value you copied before. Then all you have to do is click send, and the data appears. The finished result:

rest-2

How to select all elements except a pseudo element using CSS and LESS

This may not be the easiest way to achieve this results, but I wanted to share it because it was genuinly awesome.

I wanted to put a bottom margin on all elements, except the last one, and I wanted to do it using nested LESS-syntax. Sure, I could just write two rules, one that put the bottom margin on all elements, and one that removed it on the last child. Like this:

But where’s the fun in that? No learning = no fun.

I couldn’t wrap my head around it, so I turned to StackOverflow and got exactly the kind of answer I wanted. User BoltClock explained and here’s what I learned:

What I wanted to do was to select all elements that were children of .content, but not the last one, so I had to select all children with the child selector > , then single out the last one with :last-child and put it in the :not-selector. Like this:

Which in its turn compiled to:

In the end I had to abandon it because there was an IE8 requirement in place. IE8 causes so much sadness.