What is Unobtrusive JavaScript ?

Unobtrusive is best practice of writing the JavaScript or JQuery in the decouple or separation format means -

When we write the JavaScript or JQuery - we usually followed the practice of writing the Presentation and behavior in one line only - which is not best practice e.g.




Unobtrusive means decouple or separation of presentation and behavior of object which help in cleaning and maintaining  the code and move out the entire behavior section in separate JS file. e.g.


What is Less.js ?

Less is amazing little tool and followed by reusable and dynamic approach.
Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.

Less.js has feature like :-
1.  Variables
2.  Operations
3. Mixims

We can download Less.js  from : http://lesscss.org/#download-options and Add as reference


Declare Variables:-


Deaclare Operation:-

It just like any programming language
@boxHeight:200px
@boxWidht: @boxHeight*2

Declare Mixins:-

Mixins allow you to embed all the properties of a class into another class by simply including the class name as one of its properties.

.RoundBorders {
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}
Make it argument able:-
.RoundBorders (@radius) {
  border-radius: @radius;
  -moz-border-radius: @radius;
  -webkit-border-radius: @radius;
}
header {
  .RoundBorders(4px);
}

.button {
  .RoundBorders(6px);
}

What is CDN Fallback ?


CDN stands for Content Delivery Network.

The benefit of loading libraries like jQuery and Bootstrap from a CDN is that If Server is located multiple geographical location. It read or load the files from the nearest server, which ultimately speed up the page response time. example:-






There are 2 popular CDN exists in the market  
1. Google  
2. Microsoft 

Google CDN:- https://developers.google.com/speed/libraries/


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

Microsoft CDN:- http://www.asp.net/ajax/cdn
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.js"></script>
Fallback means :- If CDN server fails then WHAT ?

In that scenario, It should read from your local server i.e.

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js"></script>
<script>
if (typeof jQuery == 'undefined') {
    document.write(unescape("%3Cscript src='/js/jquery-2.0.0.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>

Or (Another Way) :: Both are same

<script src="//ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-2.0.0.min.js">\x3C/script>')</script>






What is JavaScript , JQuery and DOM ?

In very Short and Simplified manner:-

JavaScript is Language.

JQuery is Library or Framework or Reusable which is built on top of JavaScript.

Basically JQuery works with 3-S i.e. Start ($), Selector (“.” or “#”) and Shot (Action i.e. Click or Val etc.)


 DOM  (Document Object Model ) - It is representation of HTML document  or piece of Web Page or HTML Content exist in the Web page having tags like <Div>, <P>, <Span>, <UI>, <LI> etc..
DOM is like standard object which consist HTML elements properties, HTML elements methods, HTML elements events
DOM - In-Memory representation of HTML
High Level structure of DOM:






   

SharePoint 2013: How to add people search result in to different verticals

Everything Verticals does not show the people result.
Reason System have different result source for different verticals or Navigation.We can define or add multiple result source data under one verticals.
- Everything (Vertical) have default Result Source: i.e. Local SharePoint Results
- People (Vertical)  have default Result source: i.e. Local People Results

Using Query Rule we can add People result into Everything

Steps are as follows:-

Step1:-

Search Center -> Site settings -> Site Collection Administration -> Search Query Rules:

Step2:
 Select Local SharePoint Results (System) in the Context drop-down:



Step3:-
Once that is selected, click on New Query Rule:


 Step4:-
On the Add Query Rule page, add a rule name, remove the condition, and then click on the Add Result Block link:





On the Add Result Block page change the Title to state "People Results". In the Select this Source, select Local People Results (System) and select the amount of items. The default is 2 and that's probably not enough (just like beer or martinis). 3 or 5 seem like good numbers.



Under the Settings section, as shown above, select the "More" link option and enter "peopleresults.aspx?k={subjectTerms}". Select People Item from the Item Display Template. Click OK.



Back on the Add Query Rule page, click Save.

Run your search again (it may take a moment for the changes to appear):





Happy Coding !!