2021/12/08

Imitate Jetbrains Moving Radial Gradient Effect

今天在逛 Jetbrains 新產品 fleet 的網頁時,看到一個圓形漸層會跟著滑鼠移動的特效,覺得很有意思。

手癢來刻一個類似的。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Glow Cursor</title>
<style>
.box {
width: 300px;
height: 300px;
border: 2px solid blue;
}
</style>
</head>
<body>
<div class="box"></div>
<script>
var box = document.querySelector('.box');
box.addEventListener('mousemove', function (e) {
var rect = e.target.getBoundingClientRect();
var x = e.clientX - rect.left;
var y = e.clientY - rect.top;
box.style.background = `radial-gradient(circle at ${x}px ${y}px, rgba(138, 189, 61, 1) 0%, rgba(255, 255, 255, 1) 150px`;
});
box.addEventListener('mouseleave', function () {
box.style.background = null;
});
</script>
</body>
</html>

效果大概是這樣 Demo

2021/12/03

Imitate Laravel Collection Sum Funtion in PHP, Python, Node.js

Laravel 包含了許多好用的套件,Collection 應該是最好用的,將陣列導進去以後可以做各種花式操作,自己嘗試在 PHP、Python、Node.js 上模擬一下作法。

PHP

<?php
class Collection
{
private array $collections;
public function __construct(array $collections)
{
$this->collections = $collections;
}
public function sum(Closure $callable = null): int
{
$callbackIn = ($callable === null) ? $this->isNotCallback() : $this->isCallback($callable);
return array_reduce($this->collections, fn($carry, $item) => $carry + $callbackIn($item), 0);
}
private function isNotCallback(): Closure
{
return fn(int $value): int => $value;
}
private function isCallback(Closure $callable): Closure
{
return fn(int $value): int => $callable($value);
}
}
$collection = new Collection([1, 2, 3]);
$cal = fn($item): int => $item + 5;
echo $collection->sum(), PHP_EOL;
echo $collection->sum($cal);

Python

from functools import reduce
from typing import Callable
class Collection(object):
collections: list
def __init__(self, collections: list):
self.collections = collections
def sum(self, callback=None) -> int:
callback_in = self.is_not_callable() if callback is None else self.is_callable(callback)
return reduce(lambda carry, item: carry + callback_in(item), self.collections, 0)
@staticmethod
def is_not_callable() -> Callable[[int], int]:
return lambda x: x
@staticmethod
def is_callable(callback) -> Callable[[int], Callable[[int], int]]:
return lambda x: callback(x)
def call_me() -> Callable[[int], any]:
return lambda x: x + 5
collection = Collection([1, 2, 3])
print(collection.sum())
print(collection.sum(call_me()))

Node.js

class Collection {
private collections: any[];
constructor(collections: any[]) {
this.collections = collections;
}
public sum(callback: Function = null) {
const callbackIn = (callback === null) ? this.isNotCallable() : this.isCallable(callback);
return this.collections.reduce((carry, item) => carry + callbackIn(item), 0);
}
private isNotCallable(): Function {
return (value: any) => value;
}
private isCallable(callback): Function {
return (value: any) => callback(value);
}
}
const collections = new Collection([1, 2, 3]);
const cal = (value) => value + 5;
console.log(collections.sum());
console.log(collections.sum(cal));

2021/12/02

Laravel Connet To MSSQL Server On CentOS

PHP 安裝

# Install PHP 7.4
sudo yum -y install https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm
sudo yum -y install https://rpms.remirepo.net/enterprise/remi-release-7.rpm
sudo yum -y install yum-utils
sudo yum-config-manager --enable remi-php74
sudo yum install -y php php-pdo php-odbc php-mbstring php-zip php-xml

MSSQL Driver 安裝,擇一安裝

1. MSSQL Driver(首選,支援版本 SQL Server 2000 以上)

sudo yum install php-sqlsrv
curl https://packages.microsoft.com/config/rhel/7/prod.repo > /etc/yum.repos.d/mssql-release.repo
sudo yum remove unixODBC-utf16 unixODBC-utf16-devel #to avoid conflicts
sudo ACCEPT_EULA=Y yum install -y msodbcsql17

2. FreeTDS(Sql Server 2000)

sudo yum -y install php-mssql
sudo yum -y install unixODBC-*
sudo yum -y install freetds
cd /usr/lib64
sudo mv libtdsodbc.so.0.0.0 libtdsodbc.so
sudo vi /etc/odbcinst.ini

在最後增加:

[FreeTDS]
Description = ODBC for FreeTDS
Driver64 = /usr/lib64/libtdsodbc.so
Setup64 = /usr/lib64/libtdsodbc.so
FileUsage = 1
sudo vi /etc/freetds.conf

在最後增加:

[SqlServer2000]
host = {IP}
port = 1433
tds version = 8.0
client charset = UTF-8

在 Laravel 的配置一切照舊,除了 MSSQL 的 host 要指到 SqlServer2000,若遇到時間格式的問題可以參考此篇,使用 FreeTDS 可以通吃,但怕會有無法預期的問題,不建議同一台 Server 同時使用兩種方式。

參考網站