Kevin Chen

Line Endings (CR/LR/CRLR)

2020-03-07T10:48:00+00:00

If you are developing softwares on cross-platform projects (e.g. Windows/Linux/MacOS), you will find that the line endings is sometimes pretty annoying, especially when reading files.

Outline

Line Endings Format
- Control Characters: Carriage Return (CR), Line Feed (LR)
Look-Up, Convert Text File’s Terminators
For Cross-Platform Projects: Auto-Correct Line Ending Format (Git)
- Sol 1: Git Configuration
- Sol 2: Setup .gitattributes
For Cross-Platform Projects: Ignore File Mode

I. Line Ending Formats

There are mainly two kinds of control characters for line endings, Carriage Return (CR, the code is \r) and Line Feed (LF, the code is \n).

On different OS, different line ending is used.

OSX, Linux: LF (\n)
Legacy MacOS (MacOS 9 and earlier): CR (\r)
Windows: CR LR pair (\r\n)
- Carriage return points the cursor to the beginning of the line horizontly and Line feed shifts the cursor to the next line vertically. Combination of both gives you new line(\n) effect.

You can find more details on Wiki.

II. Look Up / Change Text’s Terminators

If you download a file to your system from a different OS. You might notice that some weird behaviors occurs while processing the strings. Probably it is a result of inconsistency between text and OS.

Ubuntu Users

For Ubuntu users, you can simply use file command to see the files line ending format.

foo@bar:~$ file testfile1.txt
testfile.txt: ASCII text

foo@bar:~$ file testfile2.txt
testfile2.txt: ASCII text, with CRLF line terminators

To convert from DOS/Windows to Unix:

foo@bar:~$ dos2unix testfile2.txt

To convert from Unix to DOS/Windows:

foo@bar:~$ unix2dos testfile1.txt

Editor Users (Take JetBrains for Example)

Lots of editors/IDE allow user to set up line separators (line endings) for newly created files, and change line separator style for existing files.

CLion Settings

III. Auto-Correct Git’s Text Line Ending

If you are working on cross-platform projects, the subtle difference above could be incredibly annoying; many editors on Windows silently replace existing LF-style line endings with CRLF, or insert both line-ending characters when the user hits the enter key.

In order to gaurantee that the code fits your OS system, there are two common ways to set things up so git will git to auto-correct line ending formats.

Solution 1: Git Configuration

Git can handle this by auto-converting CRLF line endings into LF when you add a file to the index, and vice versa when it checks out code onto your filesystem. That is, to change core.autocrlf. (You could add —-global to set all repos)

There are three values for this variable: true, input, false.

Commit-Checkout Cycle

git config core.autocrlf true

Set core.autocrlf=true: Git will auto-convert CRLF line endings into LF when you add a file to the index; Git will convert LF to CRLF when checking out code. (For cross-platform projects, this is the recommended setting on Windows)

git config core.autocrlf input

Set core.autocrlf=input: When committing text files, CRLF will be converted to LF. Git will not perform any conversion when checking out text files. (For cross-platform projects this is the recommended setting on Unix, but don’t use input under windows)

git config core.autocrlf false

Set core.autocrlf=false: Git will not perform any conversions when checking out or committing text files. (Choosing this option is not recommended for cross-platform projects)

Solution 2: .gitattribute

It is a good idea to keep a .gitattributes file as we don’t want to expect everyone in our team set their config. This file should keep in repo’s root path and if exist one, git will respect it.

text=auto  #Convert to OS’s line ending

This will treat all files as text files and convert to OS’s line ending on checkout and back to LF on commit automatically.

* text eol=crlf
* text eol=lf

You can also tell it explicitly

IV. Ignore File Mode

After you clone a repo, you may find that even if we set up core.autocrlf as we described above, it is still saying that files have been modified. The reason is that the file permissions may not be supported. (Linux has more complete access rights -rwxrwxrwx than Windows) You could try and set core.fileMode to false.

git config core.fileMode false

If you set core.fileMode to false, make sure that executable’s and script’s permission is well handle.

As https://stackoverflow.com/a/1580644 suggested, core.fileMode is not the best practice and should be used carefully. This setting only covers the executable bit of mode and never the read/write bits. In many cases you think you need this setting because you did something like chmod -R 777, making all your files executable. But in most projects most files don’t need and should not be executable for security reasons.

The proper way to solve this kind of situation is to handle folder and file permission separately, with something like:

find . -type d -exec chmod a+rwx {} \; # Make folders traversable and read/write
find . -type f -exec chmod a+rw {} \;  # Make files read/write

core.fileMode
    
    Tells Git if the executable bit of files in the working tree is to be honored.

    Some filesystems lose the executable bit when a file that is marked as executable is
    checked out, or checks out an non-executable file with executable bit on. [git-clone(1)]
    (https://www.kernel.org/pub/software/scm/git/docs/git-clone.html) or [git-init(1)]
    (https://www.kernel.org/pub/software/scm/git/docs/git-init.html) probe the filesystem to 
    see if it handles the executable bit correctly and this variable is automatically set as 
    necessary.

    A repository, however, may be on a filesystem that handles the filemode correctly, and 
    this variable is set to *true* when created, but later may be made accessible from 
    another environment that loses the filemode (e.g. exporting ext4 via CIFS mount, visiting 
    a Cygwin created repository with Git for Windows or Eclipse). In such a case it may be 
    necessary to set this variable to *false*. See [git-update-index(1)]
    (https://www.kernel.org/pub/software/scm/git/docs/git-update-index.html).

    The default is true (when core.filemode is not specified in the config file).

Reference

Line Endings

File Mode

Vim and Useful Plugins

2020-02-21T21:00:00+00:00

Metric Space Tracking using LiDAR Point Cloud

2020-01-01T22:03:00+00:00

Detected and tracked vehicles in metric space in order to reduce occlusion issues by utilizing point cloud information of vehicle sequences
Built an interface for presenting vehicle sequences and Velodyne LiDAR point cloud in 3D, which is convenient for debugging and labeling.
Improved stability by eliminating points of moving objects

Depth Estimation on Light Field Images with Recurrent Conditional Adversarial Network

2020-01-01T22:02:00+00:00

Developed a fast model for refocusing images by constructing depth information on Lytro light field images stacks (9x9)

Check it out here.

Dashcam Localization For Street View Change Detection

2020-01-01T22:01:00+00:00

Built a framework conducting Structure from Motion and trajectory alignment with the street view over time
Managed image retrieval task by training a machine learning model for feature vector encoding
Applied static scene changes detection leveraging computer vision techniques

Wearable Music Device based on Physical Models

2020-01-01T22:00:00+00:00

Implemented acoustically physical models for instruments including guitar and violin using visual programming language.
Organized a portable platform for users interaction through integration on Raspberry Pi

Markdown Extra Components

2016-02-24T22:48:00+00:00

Summary:

You can pick as item to see how to apply in markdown.

External Elements

Gist
Codepen
Slideshare
Videos

Evidence

You can try the evidence!

Paragraphs can be written like so. A paragraph is the basic block of Markdown. A paragraph is what text will turn into when there is no reason it should become anything else.

<span class="evidence">Paragraphs can be written like so. A paragraph is the basic block of Markdown. A paragraph is what text will turn into when there is no reason it should become anything else.</span>

Side-by-side

Like the Medium component.

Image on the left and Text on the right:

<div class="side-by-side">
    <div class="toleft">
        <img class="image" src="https://kuantingchen04.github.io/assets/images/profile.jpg" alt="Alt Text">
        <figcaption class="caption">Photo by John Doe</figcaption>
    </div>

    <div class="toright">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
    </div>
</div>

Photo by John Doe

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Text on the left and Image on the right:

<div class="side-by-side">
    <div class="toleft">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
    </div>

    <div class="toright">
        <img class="image" src="https://kuantingchen04.github.io/assets/images/profile.jpg" alt="Alt Text">
        <figcaption class="caption">Photo by John Doe</figcaption>
    </div>
</div>

Photo by John Doe

Star

You can give evidence to a post. Just add the tag to the markdown file.

star: true

Especial Breaker

You can add a especial hr to your text.

<div class="breaker"></div>

Spoiler

You can add an especial hidden content that appears on hover.

<div class="spoiler"><p>your content</p></div>

Gist

You can add Gists from github.

{ % gist sergiokopplin/91ff4220480727b47224245ee2e9c291 % }

Codepen

You can add Pens from Codepen.

<p data-height="268" data-theme-id="0" data-slug-hash="gfdDu" data-default-tab="result" data-user="chriscoyier" class='codepen'>
    See the Pen <a href='https://codepen.io/chriscoyier/pen/gfdDu/'>Crappy Recreation of the Book Cover of *The Flame Alphabet*</a> by Chris Coyier (<a href='https://codepen.io/chriscoyier'>@chriscoyier</a>) on <a href='https://codepen.io'>CodePen</a>.
</p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

See the Pen Crappy Recreation of the Book Cover of *The Flame Alphabet* by Chris Coyier (@chriscoyier) on CodePen.

Slideshare

Add your presentations here!

<iframe src="//www.slideshare.net/slideshow/embed_code/key/hqDhSJoWkrHe7l" width="560" height="310" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;" allowfullscreen> </iframe>

Videos

Do you want some videos? Youtube, Vimeo or Vevo? Copy the embed code and paste on your post!

Example

<iframe width="560" height="310" src="https://www.youtube.com/embed/r7XhWUDj-Ts" frameborder="0" allowfullscreen></iframe>

Markdown Common Elements

2016-02-24T22:44:00+00:00

Basic formatting

This note demonstrates some of what Markdown is capable of doing.

And that’s how to do it.

This note **demonstrates** some of what [Markdown][some/link] is *capable of doing*.

Headings

There are six levels of headings. They correspond with the six levels of HTML headings. You’ve probably noticed them already in the page. Each level down uses one more hash character. But we are using just 4 of them.

Headings can be small

# Heading
## Heading
### Heading
#### Heading

Lists

Ordered list

Item 1
A second item
Number 3

1. Item 1
2. A second item
3. Number 3

Unordered list

An item
Another item
Yet another item
And there’s more…

* An item
* Another item
* Yet another item
* And there's more...

Paragraph modifiers

Quote

Here is a quote. What this is should be self explanatory. Quotes are automatically indented when they are used.

> Here is a quote. What this is should be self explanatory.

URLs

URLs can be made in a handful of ways:

A named link to Mark It Down.
Another named link to Mark It Down
Sometimes you just want a URL like https://google.com/.

* A named link to [MarkItDown][3].
* Another named link to [MarkItDown](https://google.com/)
* Sometimes you just want a URL like <https://google.com/>.

Horizontal rule

A horizontal rule is a line that goes across the middle of the page. It’s sometimes handy for breaking things up.

---

Images

Markdown can also contain images. I’ll need to add something here sometime.

![Markdowm Image][/image/url]

Figure Caption?

![Markdowm Image][/image/url]
<figcaption class="caption">Photo by John Doe</figcaption>

Photo by John Doe

Bigger Images?

![Markdowm Image][/image/url]{: class="bigger-image" }

Code

A HTML Example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>Just a test</h1>
</body>
</html>

A CSS Example:

pre {
    padding: 10px;
    font-size: .8em;
    white-space: pre;
}

pre, table {
    width: 100%;
}

code, pre, tt {
    font-family: Monaco, Consolas, Inconsolata, monospace, sans-serif;
    background: rgba(0,0,0,.05);
}

A JS Example:

// Sticky Header
$(window).scroll(function() {

    if ($(window).scrollTop() > 900 && !$("body").hasClass('show-menu')) {
        $('#hamburguer__open').fadeOut('fast');
    } else if (!$("body").hasClass('show-menu')) {
        $('#hamburguer__open').fadeIn('fast');
    }

});

:ramen: Indigo, minimalist jekyll theme

2016-01-23T22:10:00+00:00

Example of project - Indigo Minimalist Jekyll Template - Demo. This is a simple and minimalist template for Jekyll for those who likes to eat noodles.

What has inside?

Gulp
BrowserSync
Stylus
SVG
Travis
No JS
98/100

Check it out here. If you need some help, just tell me.