10. 5. 2021

Join multiple GoPro MP4 files to single one

GoPro 'chapters' are footage around 4 GB - The camera starts a new file every ~ 10 minutes. If you have media files with exactly the same codec and codec parameters you can concatenate them quite easily. Fastest way, that I found, is use ffmpeg with concating function, but there is one unnecessary step with mylist.txt, the list of all files, you want to have concatenated.

for f in *.MP4; do echo "file '$PWD/$f'"; done > mylist.txt

If your shell supports process substitution (like Bash and Zsh), you can avoid explicitly creating a list file and do the whole thing in a single line:

ffmpeg -f concat -safe 0 -i <(for f in *.MP4; do echo "file '$PWD/$f'"; done) -c copy output.mp4

Here is also nice bash function, that can be put to your .bash_profile:

function video-concat() {
  ffmpeg -f concat -safe 0 -i <(for f in ${@:1:${#}-1}; do echo "file '$PWD/$f'"; done) -c copy $_
}

Then you can call video-concat function as follow:

video-concat *.MP4 output.mp3

#bash #ffmpeg #gopro

9. 4. 2021

Display HTML with embed tag

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title></title>
</head>
<body>  
  <embed type="text/html" id="response" scrolling="no" style="height: 640px; width:100%;">
</body>
</html>
(async function() {
  const embedResponse = document.getElementById('response');
    try {
      // clean content first     
      embedResponse.setAttribute('src', 'data:text/html;charset=utf-8,');
      const response = await fetch(,
        {
          method: 'post',
          // accept HTML response
          headers: {
            'Accept': 'application/json, text/plain, */*',
            'Content-Type': 'application/json'
          },
          // sent data if needed
          body: JSON.stringify({data: ''})
        });

      // encode HTML response
      const html = await response.text();
      embedResponse.setAttribute('src', 'data:text/html;charset=utf-8,' + encodeURIComponent(html));

    } catch (e) {
      // catch errors and show them
      embedResponse.setAttribute('src', 'data:text/html;charset=utf-8,' + encodeURIComponent(e));
      console.error(e);
    }
 })();

There is another option, you can display HTML in new window as blob data:

const content = URL.createObjectURL(new Blob([response.data + overlay || ''], {type: "text/html"}));
window.open(content, "response", `width=640, height=480`).focus();

#js #webdesign

1. 4. 2021

April 2021

Tools

  • exa - a modern replacement for ls.
  • RDM - RDM - redis GUI

#notices

1. 3. 2021

March 2021

Libs

Tools

  • Removal.AI - AI-powered background removal
  • Starship - The minimal, blazing-fast, and infinitely customizable prompt for any shell!
  • bundless - Next gen dev server and bundler
  • microsite - is a fast, opinionated static-site generator built on top of Snowpack.

#notices

1. 2. 2021

February 2021

Tools

  • Vite - Next Generation Frontend Tooling
  • Mak - Markdown notice app

#notices

1. 1. 2021

January 2021

Tools & services

Image hosting

Gears

  • Keychron K3 - World's First Hot-Swappable Low Profile Optical Wireless Mechanical Keyboard
  • A2+ Speakers - A2+ premium powered speakers with high-fidelity stereo sound
  • Gibbon AIR - active monitor system with Bluetooth
  • Neumann NDH-20 - premium quality studio headphones
  • Lagoon anc traveller - Wireless headphones with ANC from BeyerDynamic
  • Sony WH-1000XM4 - Wireless Noise-Canceling Headphones form Sony
  • Raspberry Pi Pico - Raspberry Pi Pico is a tiny, fast, and versatile board built using RP2040, a brand new microcontroller chip designed by Raspberry Pi

Comments

  • Guestbook - GitHub issue based Guestbook
  • Utteranc - A lightweight comments widget built on GitHub issues.
  • Octomments - Using GitHub issues as a comment plugin.
  • Commento - Embed comments without giving up your privacy.
  • Fast Comments - A comment service that will delight your users and developers.

Earl Grey

Webdesign

  • Primer - Design, build, and create with GitHub’s design system

#notices

10. 12. 2020

PHP code speed comparison

function versus(callable $first, callable $second, $repeat = 100000) {
    
    $f = microtime(true);
    foreach (range(0, $repeat) as $r) call_user_func($first);
    $firstTimer = microtime(true) - $f;
    
    $s = microtime(true);
    foreach (range(0, $repeat) as $r) call_user_func($second);
    $secondTimer = microtime(true) - $s;

    printf(
        '%s function is %.2f%% faster (%f vs %f)',
        $firstTimer < $secondTimer ? 'First' : 'Second',
        abs((($firstTimer - $secondTimer) / $firstTimer) * 100),
        $firstTimer, $secondTimer
    );
}

Example

versus(
    function () {
        $str = '!loremipsum';
        return substr($str, 0, 1) === '!';
    },
    function () {
        $str = '!loremipsum';
        return $str[0] === '!';
    }
);

Will print:

Second function is 36.72% faster (0.142766 vs 0.090349)

#PHP #Snippets

8. 12. 2020

Optimal Social Media Sizes

Facebook

Facebook Ads
Facebook Video
  • Facebook video ad size: 1280×720
  • Facebook video size: 1280×720
  • Maximum Facebook video length: 240 minutes

Instagram

Instagram Ads
  • Instagram ads size: 1080×566 pixels (landscape), 1080×1080 pixels (square)
  • Minimum Instagram image ad size: 500 pixels wide
Instagram video
  • Minimum Instagram video sizes: 600×600 (square), 600×315 (landscape), 600×750 (portrait), 600×700 (Carousel video dimensions)
  • Maximum Instagram video length: 60 seconds
  • Instagram IGTV video size: 1080×1920

Twitter

Twitter video
  • Twitter video size: 720×720 (square), 1280×720 (landscape), 720×1280 (portrait)
  • Twitter ad size (video): 720×720 (square), 1280×720 (landscape), 720×1280 (portrait)
  • Maximum Twitter video length: 140 seconds

LinkedIn

Company pages:
Personal pages:
  • LinkedIn profile picture size: 400×400
  • LinkedIn background photo size: 1584×396
  • LinkedIn post image size: 1200×1200 (desktop) 1200×628 (mobile)
  • LinkedIn link post size: 1200×628
  • LinkedIn video size: 256×144 (minimum) to 4096×2304 (maximum)
  • Maximum LinkedIn video length: 10 minutes

YouTube

  • YouTube Channel cover picture: 2560×1440 pixels (desktop) and 1546×423 pixels (smartphones)
  • YouTube Display ads: 300×250
  • YouTube Overlay ads: 480×60
  • YouTube Companion banner ads: 300×250 pixels
  • YouTube Skippable video ads length: 6 – 20 seconds
  • YouTube Non-skippable video ads length: 12 seconds to 3 minutes (30 seconds is recommended)
  • YouTube Bumper video ads length: 6 seconds
  • YouTube Standard video: 1280×760 pixels

TikTok

  • Tik Tok Video length: 1080×1920, maximum 15 seconds recommended.
  • Tik Tok Profile photo 200×200
  • Profile Picture: 180×180 pixels (Displays 170×170 on Desktop)
  • Cover Photo: 820×312 pixels

#webdesign