All posts by admin

Declared and undeclared variables in functions

November 16, 2018javascriptadmin

ref – https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var

Declared variables are constrained in the execution context in which they are declared.

Undeclared variables are always global

function x() {

y = 1; // Throws a ReferenceError in strict mode

var z = 2;

}

x();

console.log(y); // logs "1"

console.log(z); // Throws a ReferenceError: z is not defined outside x

…even in inner functions

Let’s declare an inner function called ‘inner’. We have an undeclared variable ‘name’.
That name will be declared as a global. It will be accessible by all scopes.

// name is declared globally, thus can be accessed by all scopes

function x() {

console.log('-- x -- ');

y = 1; // Throws a ReferenceError in strict mode

var z = 2;

function inner() {

console.log('-- inner --');

name = 'ricky';

}

inner();

console.log(name); // ricky

}

x();

console.log(y); // logs "1"

console.log(name); // ricky

console.log(z); // Throws a ReferenceError: z is not defined outside x

Chat Room using Node

November 9, 2018javascript, Node JSchatroom, socket-ioadmin

ref – https://socket.io/get-started/chat

setup

Assuming you have node, npm, nodemon/gulp installed.

First, make a directory called DesktopApp. Then start the process of creating a node project.

npm init

Enter your information for the package.json file.

Install Express:

npm install –save express@4.15.2

Server can push messages to clients. Whenever you write a chat message, the idea is that the server will get it and push it to all other connected clients.

Installing mongodb on Ubuntu

November 8, 2018Uncategorizedadmin

ref – https://www.digitalocean.com/community/tutorials/how-to-install-mongodb-on-ubuntu-18-04

Step 1 — Installing MongoDB

Ubuntu’s official package repositories include an up-to-date version of MongoDB, which means we can install the necessary packages using apt.

First, update the packages list to have the most recent version of the repository listings:

sudo apt update
Now install the MongoDB package itself:

sudo apt install -y mongodb
This command installs several packages containing the latest stable version of MongoDB, along with helpful management tools for the MongoDB server. The database server is automatically started after installation.

Next, let’s verify that the server is running and works correctly.

Step 2 — Checking the Service and Database

The installation process started MongoDB automatically, but let’s verify that the service is started and that the database is working.

First, check the service’s status:

sudo systemctl status mongodb

installing nginx

November 8, 2018Uncategorizedadmin

Nginx 1.15.1 Released — Here’s how to Install on Ubuntu 16.04 / 17.10 / 18.04

— Stops the server:
sudo systemctl stop nginx.service

— Start the server:
sudo systemctl start nginx.service

— Restarts the server:
sudo systemctl restart nginx.service

— Reload config changes no stops:
sudo systemctl reload nginx.service

sending off questions and answers data

October 29, 2018Uncategorizedadmin

function postRegisterEventRequest(contactPersonArray, registrantArray, questionArray, requiredParam) {

var referenceEventId = $('#event-registration-ref-num').text();

var participants = JSON.stringify(registrantArray);

var contactPeople = JSON.stringify(contactPersonArray);

var questionsAndAnswers = JSON.stringify(questionArray);

$.ajax({

url: '/bin/hkex/cp/activities/event/register',

method: 'POST',

data: {

referenceEventID: referenceEventId,

participants : participants,

contactPeople: contactPeople,

questionsAndAnswers: questionsAndAnswers,

userId: requiredParam.userId

success: function() {

console.log(questionArray);

console.log(questionsAndAnswers);

//var redirectTarget = 'manage-event-external.html?eventId=' + referenceEventId;

//(win.parent || win).location = redirectTarget;

error: function (err) {

contactPersonArray.splice(-1, 1);

registrantArray.splice(-1, 1);

throw err;

}

});

}

Regular Expressions (js)

October 26, 2018Uncategorizedadmin

new style

1	const re1 = new RegExp('hey')

literal style

1	const req = /hey/;

test

const req = /hey/;

var res = req.test('hadooo hey!');

console.log(res); // true

var res2 = req.test('sho ryu key!');

console.log(res2); // false

var res3 = req.test('ayiii ya hii hiiii');

console.log(res3); // false

replace

let result = "shooo ryu ken ryu Ryu rYu ryU!".replace(/ryu/gi, function(str, offset, s){

console.log(`Found "${str}" at position ${offset} in string "${s}"`);

return str.toLowerCase();

});

console.log('After replacement: ' + result);

Found “ryu” at position 6 in string “shooo ryu ken ryu Ryu rYu ryU!”
Found “ryu” at position 14 in string “shooo ryu ken ryu Ryu rYu ryU!”
Found “Ryu” at position 18 in string “shooo ryu ken ryu Ryu rYu ryU!”
Found “rYu” at position 22 in string “shooo ryu ken ryu Ryu rYu ryU!”
Found “ryU” at position 26 in string “shooo ryu ken ryu Ryu rYu ryU!”

After replacement: shooo ryu ken ryu ryu ryu ryu!

wait for async code in a callback function

October 18, 2018Uncategorizedadmin

Situation

We have a function that does some processing. Then it executes a callback function.

function A(cbConfirmed) {

// 1) process other code...

var reply = cbConfirmed(); // 2) execute provided callback

// 4) reply is 'true'

}

So say we call function A, and provide an anonymous callback function.

A (function() {

// 3) callback definition

return true;

});

Under this case, we will get the true in function A’s definition.
Everything is synchronous so we go step by step.

The Problem

The problem happens when we have asynchronous code in our callback

Given definition A:

function A(cbConfirmed) {

// process other code...

var reply = cbConfirmed(); // execute provided callback

}

In our callback definition, we do something asynchrnous. It returns true after 2 seconds.

A (function() {

setTimeOut(function() {

return true;

}, 2000 );

});

This is a problem because while the execution is happening for the setTimeOut of waiting 2 seconds, our main execution
continues and our reply will be undefined.

function A(cbConfirmed) {

// process other code...

var reply = cbConfirmed(); // execute setTimeOut of waiting 2 seconds

// main execution will continue and 'reply' will be undefined

}

The Solution

The solution is to use Promises. In this particular case, I will use jQuery’s Deferred, which is exactly the same as Promise, except its packaged in jQuery’s API.

1) chain the ‘then’

In order to wait for the async to finish, we call the callback function, and then chain the API call ‘then’ in order to continue with the results. This is assuming we declared a Promise object and returned it in cbConfirmed(). (we’ll get to this in the next step)

When you chain the then call, it will wait for async code to finish, then you simply provide an anonymous callback function inside to get the results.

function A(cbConfirmed) {

cbConfirmed().then(function(result) {

console.log(result);

});

}

2) declare and return the Promise object

A(function() {

var cbPromise = new $.Deferred();

return cbPromise;

});

3) call resolve and use it where the async code has finished

A(function() {

var cbPromise = new $.Deferred();

setTimeOut(function() { // after 2 seconds, we finish

cbPromise.resolve('success! :D');

}, 2000);

return cbPromise;

});

The main execution will wait for the callback to finish. After 2 seconds, the callback returns and gives the result to function A.

function A(cbConfirmed) {

// 1)

cbConfirmed().then(function(result) {

// 6)

console.log(result);

});

}

A(function() {

// 2)

var cbPromise = new $.Deferred();

// 3)

setTimeOut(function() { // after 2 seconds, we finish

// 5)

cbPromise.resolve('success! :D');

}, 2000);

// 4)

return cbPromise;

});

quotes on love and relationship

October 13, 2018Uncategorizedadmin

每一个好的爱情，基于在尊重上。如果没有尊重，这个爱活不下去的。
每天要跟新你的爱。讲个笑话。。。带她出去玩。。。给他推拿。。。
结婚的目的，是教你怎么去做多情的朋友们。
爱情不会要求占有。爱情是给自由的。
你爱一个人，因为只有你能听到他生活上唱的歌。
微笑开始一个爱情。亲吻把爱情增长。拥抱让爱情持久。
爱是什么？当两端有足够的空间时，爱就会让两个人坐在长凳的中间。

Wait for end of resize event (jQuery)

September 20, 2018Uncategorizedadmin

ref – https://stackoverflow.com/questions/5489946/jquery-how-to-wait-for-the-end-of-resize-event-and-only-then-perform-an-ac?noredirect=1

function resizedw(){

// Haven't resized in 100ms!

}

var doit;

window.onresize = function(){

clearTimeout(doit);

doit = setTimeout(resizedw, 100);

};

num of lines v2

September 20, 2018Uncategorizedadmin

todo –

given a that a previous space exists:

usually when we pass the limit with a letter, we shift down to the next line, and keep going with the word after the ‘previous space’.

“abcde fghijk”(‘l’ passed limit)

becomes

“abcde
fghijklmn”

However, there is a case where if the offending letter that went passed the limit has a space for the next value….

for example, given “abc def ghi jkl mno”…

abc def ghi (‘i’ passed limit)

then in this particular situation..

1) we include the offending letter as the previous string
2) break line
3) start next line with space

“abc def ghi”
” jkl mno”

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

$(document).ready(function() {

// test cases

//var TEXT = 'abcdefghijklmnopqrstuvwxyz';

//var TEXT = 'abcdefghijklm abcdefghijklmnopqrstuvwxyz nop';

//var TEXT = 'abc defghijklmnop';

//var TEXT = 'abc defghijklm nop';

//var TEXT = 'abc def ghi jkl mama nop';

//var TEXT = 'def ghi jkl';

//var TEXT = 'lll lll lll lll ll';

//var TEXT = 'lll lll lll lll lll';

//var TEXT = 'a b c d e f g h i j k l m n o p q r s t u v w x y z';

//var TEXT = 'T1_00000001 / 020 - 000 0 0 / haha / lin';

var TEXT = 'T1_00000001 / 020 - 000000 / welcome to your doooom!! / haha 0 001';

// jQuery func

$(window).resize(function() {

$("#para a").text(TEXT);

var para = document.querySelector("#para a");

var font = window.getComputedStyle(para).getPropertyValue('font-family');

font = font.replace(/"/g, ''); // remove all quotes

var fontSize = window.getComputedStyle(para).getPropertyValue('font-size');

fontSize = fontSize.replace(/"/g, ''); // remove all quotes

var styleWidth = $("#para").css("width");

styleWidth = styleWidth.slice(0, styleWidth.length-2);

var temp = new DblLineWithEllipsis(TEXT, $.fn.textWidth, styleWidth, font, fontSize);

var num = temp.calcNumOfLines(font, fontSize);

});

$.fn.textWidth = function(text, font, fontSize) {

if (!$.fn.textWidth.placeholderEl) $.fn.textWidth.placeholderEl

= $('<span>').appendTo(document.body);

var validText = text || this.val() || this.text();

font = font.replace(/"/g, '');

$.fn.textWidth.placeholderEl.text(validText).css({'font-family': font, 'font-size': fontSize});

return $.fn.textWidth.placeholderEl.width();

};

// DblLineWithEllipsis

function DblLineWithEllipsis(newParagraph, calcTextWidthFunc, width, newFont, newFontSize) {

this._paragraph = newParagraph;

this._textWidthFunc = calcTextWidthFunc;

this._font = newFont;

this._fontSize = newFontSize;

this.LIMIT = width

this._paragraphFormat = [];

this._paragraphFormatCur = 0;

this._totalTextWidth = 0;

this._placeHolderInDOM;

}

DblLineWithEllipsis.prototype.getCharWidth = function (str, callback) {

if (str == ' ') {callback(0, true);}

else {callback(this._textWidthFunc(str, this._font, this._fontSize), false);}

}

DblLineWithEllipsis.prototype.textWidthPastLimit = function() {return (this._totalTextWidth >= this.LIMIT);}

DblLineWithEllipsis.prototype.storeString = function(strHolder) {this._paragraphFormat[this._paragraphFormatCur++] = strHolder;}

DblLineWithEllipsis.prototype.charIsSpace = function(ch) {return (ch == ' ');}

DblLineWithEllipsis.prototype.splitHoldStringByLastSpace = function(offendingChar, strHolder) {

var indexOfLastSpace = strHolder.lastIndexOf(' ');

var prev = strHolder.slice(0, indexOfLastSpace+1);

console.log('prev is: ' + prev);

this.storeString(prev);

console.log(this._paragraphFormat);

var next = strHolder.slice(indexOfLastSpace+1, strHolder.length);

console.log('next is: ' + next);

return next;

}

DblLineWithEllipsis.prototype.calculateWidthOfSpace = function(before, after) {

var a = $.fn.textWidth(before, this._font, this._fontSize);

var b = $.fn.textWidth(after, this._font, this._fontSize);

var together = before + ' ' + after;

var c = $.fn.textWidth(together, this._font, this._fontSize);

return (c-b-a);

}

DblLineWithEllipsis.prototype.calcNumOfLines = function() {

console.log('limit: ' + this.LIMIT);

var characterArray = this._paragraph.split('');

var holder = "";

var previousSpaceExists;

var self = this;

for (var i = 0; i < characterArray.length; i++) {

this.getCharWidth(characterArray[i], function(width, isSpace) {

if (isSpace && width==0) {

previousSpaceExists = true;

width = self.calculateWidthOfSpace(self._paragraph[i-1], self._paragraph[i+1]);

}

self._totalTextWidth += width;

console.log("adding " + characterArray[i] + " width of " + width + ", total is: " + self._totalTextWidth);

});

holder += characterArray[i];

if (this.textWidthPastLimit()) {

console.log('past limit with char |' + characterArray[i]+'|');

if (this.charIsSpace(characterArray[i])) {

this.storeString(holder);

holder = '';

this._totalTextWidth = 0;

} else if (previousSpaceExists) {

previousSpaceExists = false;

console.log("|"+holder+"|");

holder = this.splitHoldStringByLastSpace(characterArray[i], holder);

this._totalTextWidth = this._textWidthFunc(holder, this._font, this._fontSize);

console.log('continuing on with width: ' + this._totalTextWidth);

}

this.storeString(holder);

console.log(this._paragraphFormat);

return this._paragraphFormat.length;

}

$("#para a").text(TEXT);

var para = document.querySelector("#para a");

var font = window.getComputedStyle(para).getPropertyValue('font-family');

font = font.replace(/"/g, ''); // remove all quotes

var fontSize = window.getComputedStyle(para).getPropertyValue('font-size');

fontSize = fontSize.replace(/"/g, ''); // remove all quotes

var styleWidth = $("#para").css("width");

styleWidth = styleWidth.slice(0, styleWidth.length-2);

var temp = new DblLineWithEllipsis(TEXT, $.fn.textWidth, styleWidth, font, fontSize);

var num = temp.calcNumOfLines(font, fontSize);

});

html

<!DOCTYPE html>

<head>

<title>Number of lines in a paragraph when squished into an element</title>

<style>

#para {width: 20%;}

</style>

<body>

</div>

</body>

</html>