scottopolis

// we have an array of objects, we want to remove one object using only the id property
const apps = [{id:34,name:'My App',another:'thing'},{id:37,name:'My New App',another:'things'}];

// get index of object with id of 37
const removeIndex = apps.findIndex( item => item.id === 37 );
// remove object
apps.splice( removeIndex, 1 );

reinink

<template>
    <div>
        <label v-if="label" class="form-label" :for="`date-input-${_uid}`">{{ label }}:</label>
        <input v-bind="$attrs" class="form-input" :id="`date-input-${_uid}`" :class="{ error: error }" type="text" ref="input" :value="value" @change="change" @keyup="change">
        <div v-if="error" class="form-error">{{ error }}</div>
    </div>
</template>

<script>
import pikaday from 'pikaday'

akexorcist

const axios = require('axios')

/* ... */

const params = new URLSearchParams()
params.append('name', 'Akexorcist')
params.append('age', '28')
params.append('position', 'Android Developer')
params.append('description', 'birthdate=25-12-1989&favourite=coding%20coding%20and%20coding&company=Nextzy%20Technologies&website=http://www.akexorcist.com/')
params.append('awesome', true)

djoudi

<?php

namespace App\Http;

use Illuminate\Foundation\Http\Kernel as HttpKernel;

class Kernel extends HttpKernel
{
   //----

eirikb

const req = require.context('./components/', true, /\.(js|vue)$/i);
req.keys().map(key => {
  const name = key.match(/\w+/)[0];
  return Vue.component(name, req(key))
});

Topener

<?php
	/**
	 * This is a simple script to invite users to your slack
	 * Replace the subdomain and token in the variables below.
	 * Upload a logo called "logo.png" to the same directory for your group
	 * Upload a logo called "slack.png" to the same directory for slack
	 */
	define('SUBDOMAIN','{YOUR SUBDOMAIN HERE}');
	define('TOKEN','{YOUR API TOKEN HERE}');
?>

FrostyX

<?php
	class FacebookDebugger
	{
		/*
		 * https://developers.facebook.com/docs/opengraph/using-objects
		 *
		 * Updating Objects
		 *
		 * When an action is published, or a Like button pointing to the object clicked,
		 * Facebook will 'scrape' the HTML page of the object and read the meta tags.

mattattui

Our video player needed redoing (it was videogular before, we're using Vue now). For the seek/progress bar, I thought I'd use <input type="range" min="0" :max="player.duration"> which is nice and straightforward because there's no JS to really write for it, and because it's a browser built-in widget, it's accessible as heck.

One problem: IE is the only browser that lets you style the background colour of the slider track differently according to whether it's before or after the current slider position (it's call the "thumb" for some reason).

Solution: CSS custom properties, linear-gradient background. Use JS to update the custom property when the video time changes:

djekl

<?php

Route::filter('stripe.plans.free', function() {
    if (Auth::guest() || Auth::user()->subscribed()) {
        return;
    }

    $user = Auth::user();

    $chosenPlan = 'free';

piotrpog

{# v2 #}
{%- macro ytAddress(url, lazy = true) -%}
{% if url is not empty %}
{% set id = url|split('v=')|last %}
{% set id = id|split('&')|first %}
{% set id = id|split('/')|last %}

<div class="youtube-player">
<figure style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; margin: 0px;">
<iframe src="https://www.youtube.com/embed/{{id}}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"{{ lazy ? ' loading="lazy"'}}></iframe>