Did you know that the mongoDB shell is a full-featured JavaScript interpreter, capable of running arbitrary JavaScript programs? To illustrate this, let’s perform some basic math:

> x = 200
 200
 > x / 5;
 40

We can also leverage all of the standard JavaScript libraries:

> Math.sin(Math.PI / 2);
 1
 > new Date("2010/1/1");
 "Fri Jan 01 2010 00:00:00 GMT-0500 (EST)"
 > "Hello, World!".replace("World", "MongoDB"); Hello, MongoDB!

We can even define and call JavaScript functions. In previous posts we explained how to kill slow queries, there we explained how to define a function in MongoDB and store that function inside of MongoDB.


#mongodb #mongo #shell #javascript #js

Send Google Forms to Slack

# read more about slack web hooks here: https://api.slack.com/incoming-webhooks

 var POST_URL = "https://hooks.slack.com/services/YOUR_TOKEN";

 function onSubmit(e) {
   var response = e.response.getItemResponses();

   var toType = function(obj) {
     return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase()
   }

   // "Form Respondent: " + e.response.getRespondentEmail()

   var email = response[0].getResponse();
   var field2 = response[1].getResponse();
   var field3 = response[2].getResponse();
   var field4 = response[3].getResponse();

   var d = "*SUBMITTED FORM*\n>>>Email: " + email + "\n";

   d += "other fields: \n" + field2 + field3 + field4;

   var payload =
       { "payload": '{"text": "' + d + '"}' }

    var options =
    {
      "method" : "post",
      "payload" : payload
    };

    UrlFetchApp.fetch(POST_URL, options);
 };

You need to add javascript code above to Script Editor section of google form. When you are in form editing mode click the three dot in top corner and click on Script Editor. When your're done click on save and give a name to your project script. Now on the script editor page click on edit -> All your triggers and bind your script to form onSubmit event.

Read more about webhooks for slack here:
- here: https://api.slack.com/incoming-webhooks

That's all! Now will have all your submitted forms in Slack. Voila!

#google #slack #forms #google_forms #webhook #hook #javascript

How to upload a text content as a file in $.Ajax()?

FormData class is used to create a multipart/form-data inside of JS code. A sample code speaks thousand words:

var formData = new FormData();
 var blob = new Blob([YOUR_CONTENT_HERE], { type: "text/html"});
 formData.append("file", blob);

We have created a binary data from the text which is in the format of text/html, then I have appended the data as an input file with the name of file (which will be captured on server-side).

The Ajax part is utterly simple:

$.ajax({
     type: 'POST',
     url: 'https://www.example.com/storage',
     data: formData,
     processData: false,
     contentType: false
 }).done(function(data) {});

NOTE: DO NOT OMIT processData, contentType parameters.

#javascript #jQuery #ajax #FormData #Blob #upload

How do you sort the below object based on the value in Javascript?

{
     "en": "English (English)",
     "fa": "French",
     "ar": "العربیه",
     "zh": "中文 (Chinese)"
 }

Well first you need to make an array of arrays:

var sortable_langs = [];
 $.each(languages, function(index, language) {
     sortable_langs.push([index, language]);
 });

 sortable_langs.sort(function(a, b) {
     if(a[1] < b[1]) { return -1; }
     if(a[1] > b[1]) { return 1; }
     return 0;
 });

NOTE: a[1] and b[1] refers to the language value like: English (English). They are compared with each other. If a[1] is bigger than b[1] then it will be moved to the first to the top.

#javascript #sort #alphabetically

How to get only numbers in textbox using jQuery?

// Restricts input for each element in the set of matched elements to the given inputFilter.
 (function($) {
     $.fn.inputFilter = function(inputFilter) {
     return this.on("input keydown keyup mousedown mouseup select contextmenu drop", function() {
         if (inputFilter(this.value)) {
         this.oldValue = this.value;
         this.oldSelectionStart = this.selectionStart;
         this.oldSelectionEnd = this.selectionEnd;
         } else if (this.hasOwnProperty("oldValue")) {
         this.value = this.oldValue;
         this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
         }
     });
     };
 }(jQuery));

 // restrict input to receive just numbers
 $("#my_input_num").inputFilter(function(value) {
     return /^\d*$/.test(value);
 });

#javascript #jquery #input #number

How to convert ByteArray to PDF and then upload it via jQuery?

var docData = [ yourByteArray ];
 var blob = new Blob([new Uint8Array(docData)], { type: 'application/pdf' });

 // Now create form to upload the file
 var formData = new FormData();
 formData.append("file", blob);

 // Let's now upload the file
 $.ajax({
         type: 'POST',
         url: 'https://www.YOUR-UPLOAD-FILE-ENDPOINT.com/storage',
         beforeSend: request => set_ajax_headers(request),
         data: formData,
         processData: false,
         contentType: false
     }).done(function(data) {
         console.log('File is uploaded!');
     });

NOTE: function set_ajax_headers is a function that sets headers on the given request.

#javascript #ByteArray #PDF #Uint8Array #Blob #jQuery

How 3rd Party Logins work like Facebook, Google, etc?

In order to understand this concept you need to read a little bit about OAuth 2.0 flow. The flow that frontiers use in order to get access token is called Implicit Flow in this scenario in one go you get an access token and you don't need to send your client secret as everything in web is plain and end users can inspect it.

For example for Google authentication, you use the below link with resopnse_type of token NOT code (code is a 2-step authentication flow):

- https://accounts.google.com/o/oauth2/v2/auth?client_id=YOUR_CLIENT_ID&redirect_uri=https://example.com/callback. html&response_type=token&scope=openid+profile+email&prompt=select_account

But there are lot more going on in the background. How a modal is opened? Or when modal get the token how it sends access token to the main window (parent window)? How do you close the opened modal after successful authorization?

These are all critical questions that any frontier programmer needs to know.

One the simplest forms of opening a popup is:

window.popUpObj = window.open(url, '_blank')

We store the popup object in window.popUpObj in order to be able to close it in the future. As we just said in google link above we have a parameter called redirect_uri, here you put a link to where you need to get the parameters from your 3rd party. Here we have set it to:

- https://example.com/callback.html

Inside of that HTML you get the parameters. Google sends data in a hash section of the URL so in callback.html we get the hash like below and then send it to the parent window using window.opener:

<script>
     window.opener.loginCallback(window.location.hash);
 </script>

Here get the hash part using window.location.hash and pass it to parent window function loginCallback. This function is defined in your main js file like below:

window.loginCallback = function(args) {
     console.log('Login callback has been called, token: ', args);
     window.popUpObj.close();
 }

We get the hash part as args and then close the child window using window.popUpObj.close(). This is the object we have recently stored to refer later.

#javascript #google #3rd_party_login #login #facebook #oauth #oauth2 #implicit_flow

A more detailed example of a sample modal is like:

window.popUpObj = window.open(url, '_blank', 'toolbar=0,status=0,resizable=0,location=0,menuBar=0,scrollbars=yes, width=' + w + ',     height=' + h + ', top=' + top + ', left=' + left);

#javascript #modal #popup

CodeMirror is a versatile text editor implemented in JavaScript for the browser. It is specialized for editing code, and comes with a number of language modes and addons that implement more advanced editing functionality.


- https://codemirror.net/

We ourselves have used it for json prettifier in our internal tools.

#js #javascript

One of the methods to document your API is APIDOC. It uses annotation in variety of languages like Python, PHP, JS, etc. At the below code block you can see an example in Python:

"""
@api {get} /user/:id Request User information
@apiName GetUser
@apiGroup User

@apiParam {Number} id Users unique ID.

@apiSuccess {String} firstname Firstname of the User.
@apiSuccess {String} lastname  Lastname of the User.
"""

To read more about the APIDOC itself and the installation process head over to link below:

- http://apidocjs.com/

#javascript #js #python #apidoc #apidocjs #api #documentation #rest #annotation

https://github.com/typicode/json-server

#javascript #json #fake_server