Довгий час вважалося, що вся ця «хмара» — це динамічно згенерований код. Але реальність куди цікавіша і, чесно кажучи, геніальніша у своїй простоті.

Секрет у файлі ProximityPairingLoop.mov

Якщо «залізти під капот» iOS, а саме в директорію /Applications/Setup.app/, можна знайти файл під назвою ProximityPairingLoop.mov.

Виявляється, та сама заворожуюча «хмара часток» — це просто статичний відео-ассет. Сама по собі вона не несе ніякої технічної інформації для пейрингу. Справжній код — це шар «статичного шуму», який накладається поверх цього відео.

Це класичний приклад того, як Apple розділяє естетику та функціональність:

• Відео-петля створює візуальний контекст і емоцію «магії».

• Оверлей із шумом містить у собі дані, зашифровані за принципами, які Apple описувала у своїх патентах про невидимі оптичні мітки.

Як працює цей «невидимий» код?

Навіть якщо хмара — це лише відео, сам шум зверху працює за дуже хитрими алгоритмами психовізуального сприйняття:

1. Тимчасове усереднення: Код мерехтить на частоті 60–120 Гц. Для нашого ока це виглядає як легкий шум або частина анімації, бо мозок «усереднює» картинку. Але камера iPhone бачить кожен кадр окремо і легко дешифрує матрицю даних.

2. Хроматичні маніпуляції: Дані зашиті в коливаннях кольору (хроматичності), до яких людське око менш чутливе, ніж до яскравості. Це дозволяє приховати код навіть на рухомому фоні.

Чому цей підхід — урок для кожного інженера?

Працюючи з Ruby on Rails чи архітектурою складних систем, ми часто намагаємося зробити все «чесно» — щоб кожна піксельна зміна була результатом складних обчислень. Apple пішла іншим шляхом:

• Економія ресурсів: Навіщо рендерити складну математичну модель часток у реальному часі на слабкому процесорі годинника, якщо можна програти легке відео і накласти на нього тонкий шар даних?

• Invisible Design: Це ідеальний баланс між «красивим» та «корисним». Користувач не бачить технічного «сміття», а система отримує всі необхідні дані для з’єднання.

Мій висновок

Цей кейс навчив мене, що найкраще інженерне рішення — це не обов'язково найскладніше. Це те, яке вирішує проблему користувача найелегантнішим способом. Іноді для «магії» достатньо простої відео-петлі та правильно накладеного шуму.

В моїй практиці, будь то розробка високонавантажених сервісів чи налаштування Home Assistant, я все частіше намагаюся знайти такі «точки спрощення». Бо кінцевому користувачу байдуже на складність вашого алгоритму — йому важливо відчути магію, яка просто працює.

Щоб завантажити власні шрифти на електронну книгу PocketBook з компʼютера Apple Mac чи ноутбука Apple MacBook, виконайте наступні дії:

1. Підʼєднайте книгу до компʼютера.
   Для сучасних моделей вам знадобиться кабель USB Type-C — USB Type-C. Упевніться, що кабель підтримує передачу даних.
   Якщо при підключенні електронної книги нічого не відбувається і вона не заряджається, спробуйте підключити кабель іншою стороною або в інший порт на MacBook. Якщо ви спробували всі варіанти, змініть кабель.

2. На PocketBook зʼявиться повідомлення: “Оберіть режим USB” та дві кнопки: “Звʼязок з ПК” та “Зарядка”. Натисніть на “Звʼязок з ПК”.
   Якщо при підключенні відбувається лише зарядка та вікно на PocketBook не зʼявляється, відкрийте “Параметри”, “Обслуговування”, у “Режим USB” оберіть “Запитати при підключенні”.

3. На Mac зʼявиться таке вікно:

Натисніть кнопку “Дозволити”.

3. На Mac відкрийте програму “Finder” та відкрийте новий зʼємний пристрій в меню зліва:

4. Увімкніть перегляд прихованих папок. Для цього натисніть комбінацію “Command + Shift + .” (крапка). Ви маєте побачити приховану папку “System”:

5. У папці “System” відкрийте папку “fonts”:

6. Перенесіть свої шрифти з розширенням “.ttf” у цю папку.
Краще не створювати підпапок та не видаляти стандартні шрифти, аби не зашкодити роботі системи:

7. Після перенесення всіх файлів зі шрифтами, натисніть кнопку безпечного відʼєднання пристрою:

8. Трохи зачекайте, на PocketBook зʼявться іконка завантаження.

9. Після завершення завантаження, відкрийте будь-яку електронну книгу на PocketBook.

10. Знову зачекайте закінчення завантаження. Натисніть “Параметри”, “Шрифт” та оберіть новий шрифт.

Чим більше шрифтів ви завантажите на PocketBook, тим довше буде завантажуватись їх список.

Ця стаття втратила актуальність після закінчення відключення світла. Останнє відключення світла у Львові було 30 грудня 2024 р.

Ви можете легко додати графіки погодинних відключень світла у місті Львові в Google Календар на Android чи Apple Календар на iPhone.

Графіки в календарях оновлено 10 липня 2024 року.

Дізнайтесь групу відключень на сайті Львівобленерго.

Для того, аби додати графік відключень у календар на смартфоні чи компʼютері, натисніть на посилання необхідної групи, а потім підтвердьте додавання календаря:

• Група 1.1: Google Календар
• Група 1.2: Google Календар
• Група 2.1: Google Календар
• Група 2.2: Google Календар
• Група 3.1: Google Календар
• Група 3.2: Google Календар

Як додати графік відключення світла на початковий екран?

На iPhone помістіть віджет Календаря на початковий екран, потім затисніть його, оберіть “Редагувати віджет”, в полі “Календарі” оберіть календар із вашою групою.

Інструкція “Переміщення програм і віджетів на початковий екран на iPhone” від Apple.

Віджет із графіком відключення світла на початковому екрані iPhone

You have a web site with the domain example.org. Images are loaded through Cloudflare CDN with the subdomain cdn.example.org.

Broken image icons

Problem

.webp images not loaded in Google Chrome, Microsoft Edge, Arc, and other Chromium-based browsers.

Solution

1. Go to Cloudflare Dashboard.
2. Select the “Rules” tab on the sidebar, “Transform Rules”.
3. Open the “Modify Response Header” tab and press “+ Create rule”.
4. Fill in the form:

Rule name: Content-Type: image/webp

If: Custom filter expression Field: URI Path Operator: contains Value: .webp

Then: Set static Header name: Content-Type Value: image/webp

Transform Rules

5. Press the “Deploy” button.

Result

Go to your website and .webp images should be displayed in Google Chrome.

If you encountered this problem in your schema.rb file:

# Could not dump table "users" because of following FrozenError
# can't modify frozen String: "false"

Then, do the following:

1. Create file config/initializers/prepare_column_options.rb with the following content:

module ActiveRecord
module ConnectionAdapters
module ColumnDumper
def prepare_column_options(column, types)
spec = {}
spec[:name] = column.name.inspect
spec[:type] = column.type.to_s
spec[:null] = 'false' unless column.null

limit = column.limit || types[column.type][:limit]
spec[:limit] = limit.inspect if limit
spec[:precision] = column.precision.inspect if column.precision
spec[:scale] = column.scale.inspect if column.scale

default = schema_default(column).dup if column.has_default?
spec[:default] = default unless default.nil?

spec
end
end
end
end

2. Run bundle exec rake db:schema:dump to recreate the schema.rb file.

And you will not see the following error in your schema.rb file anymore when you run rails db:migrate.

Source: Abdul Rehman at Stack Overflow.

Актуально станом на липень 2023.

Крок 1. Отримувати інформацію електронним листом

Для цього потрібно зареєструвати Персональний кабінет Львівобленерго:

Після чого додати свою адресу, натиснувши на кнопку “Додати споживача”:

Вам знадобиться номер особового рахунку, який можна знайти у паперових рахунках або дізнатись в орендодавця, якщо ви винаймаєте житло.

Після додавання рахунок буде відображатись на головній сторінці:

На вашу електронну пошту будуть надходити листи про відключення електроенергії:

Крок 2. Реєстрація у Pipedream

Для того, аби додавати події до календаря, нам необхідно використовувати сервіс автоматизацій. Можна використовувати будь-який, де є інтеграція із поштою, Google Календарем та обробка тексту.

В цьому прикладі ми будемо використовувати сервіс Pipedream.

Перейдіть на сторінку реєстрації та створіть новий аккаунт:

Після реєстрації відкриється інтерфейс створення нового workflow:

Крок 3. Пересилання листів до Pipedream

На сторінці створення workflow у Pipedream знайдіть додаток “Email”:

Після натискання на додаток “Email” виберіть джерело “New Emails”:

Розгорніть блок із подією, натиснувши на стрілочку біля тексту “Select event”.

Ви побачите адресу електронної пошти, на яку необхідно пересилати листи:

Для пересилання листів, перейдіть у налаштування Gmail в розділ “Пересилання та POP/IMAP”:

Натисніть на кнопку “Додати адресу для пересилання” та вставте адресу електронної пошти із Pipedream із попереднього кроку.

Відкриється вікно підтвердження, натисніть “Продовжити”.

Тепер поверніться у Pipedream і ви побачите нову подію із листом, який надіслав Gmail:

Натисніть на нього, відкрийте вкладку “Results”. Потім розгорніть “steps.trigger”, “event”, “body” та“text”. Ви побачите посилання для підтвердження адреси пересилання, перейдіть за ним:

І натисніть “Підтвердити”:

Тепер поверніться у налаштування Gmail та відкрийте вкладку “Фільтри й заблоковані адреси”:

Під списком натисніть “Створити новий фільтр”.

У полі “Від” введіть “online@loe.lviv.ua”:

Натисніть “Створити фільтр”.

Відмітьте пункт “Переслати на адресу” та оберіть адресу Pipedream із попереднього кроку:

Можна також відмітити “Видалити”, тоді листи не будуть залишатись у вхідних.

Натисніть на кнопку “Створити фільтр”.

Крок 4. Обробка листів у Pipedream

У Pipedream натисніть на “+” внизу сторінки та оберіть “Run custom code”:

Тут вставте код для обробки листів:

function convertDateFormat(inputDate) {
const [datePart, timePart] = inputDate.split(' ');

const [day, month, year] = datePart.split('.');

const [hours, minutes] = timePart.split(':');

return `${year}-${month}-${day}T${hours}:${minutes}:00`;
}

export default defineComponent({
async run({ steps, $ }) {
const timezone = "03:00"

const description = steps.trigger.event.body.text

let dates = description.split("електроенергія з ")[1].split("\n")[0].split(" до ")

if (!dates[1].includes(" ")) {
dates[1] = dates[0].split(" ")[0] + " " + dates[1]
}

return {
"start": `${convertDateFormat(dates[0])}+${timezone}`,
"end": `${convertDateFormat(dates[1])}+${timezone}`,
"reason": description.split("через ")[1].split(" відсутня електроенергія")[0].split(" з ")[0],
"location": description.split("За адресою: ")[1].split(", кв.")[0].split(" через")[0].replace(", б.", ", ")
}
},
})

Дія має виглядати ось так:

Крок 5. Створення події в календарі

У Pipedream натисніть на “+” внизу сторінки та знайдіть додаток “Google Calendar”:

Оберіть подію “Create Event”:

У полі “Google Calendar Account” натисніть “Connect account” та привʼяжіть свій Google Аккаунт, надавши всі необхідні дозволи.

У полі “Calendar ID” оберіть календар, до якого будуть додаватись події. Новий календар можна створити на сайті Google Календаря.

Наступні поля заповніть такими значеннями:

Event Title:
⚡ Відключення світла: {{steps.code.$return_value.reason}}

Event Location:
{{steps.code.$return_value.location}}

Event Description:
{{steps.trigger.event.body.text}}

Event Start Date:
{{steps.code.$return_value.start}}

Event End Date:
{{steps.code.$return_value.end}}

Тепер зверху справа натисніть на кнопку “Deploy”:

Результат

Тепер ви отримуватимете інформацію про відключення світла у своєму календарі:

But, when you follow the link, you just see the home page of Dialogflow with the message that you don’t have any agents:

Here is an instruction on how to delete the agent:

1. Go to the Google Cloud Shell. Make sure you selected the right project at the upper left corner of the page.
2. Type in gcloud config set project id with id of your project instead of id. To get the id, click on the name of the project in the upper left corner and find the id in the “ID” column of the table.
3. Run gcloud alpha resource-manager liens list in the G Cloud Shell. You will see the message with the following first line: “NAME: id” with the id of the lien to delete.
4. Type in gcloud alpha resource-manager liens delete id and replace the id with the lien’s id from the previous step. You should see the message “Deleted”.

Now the Dialogflow agent is deleted and you can completely delete the Google Cloud project.

Source

Active Bootstrap skin with missed icons

This article applies to the version [0.1.5](https://rubygems.org/gems/active_bootstrap_skin/versions/0.1.5) of the Active Bootstrap skin gem.

To fix this issue, open the file app/assets/stylesheets/active_admin.scss and modify:

// @import "active_bootstrap_skin"; <- remove or comment this line previously in your code
@import "active_bootstrap_skin_modified";

Then, create a new file app/assets/stylesheets/active_bootstrap_skin_modified.scss. Paste the content of the file active_bootstrap_skin from the original gem. Here is the link to this file on the gem’s repository: https://github.com/vinhnglx/active_bootstrap_skin/blob/master/app/assets/stylesheets/active_bootstrap_skin.scss

In this file, delete or comment following lines (note: the completed code is presented here):

// #main_content_wrapper .table_actions {
// @extend .btn-toolbar;
// min-width: 117px;

// > .member_link {
// margin: (-3px) 10px 0 0;

// &:last-child {
// margin-right: 0;
// }
// }
// }

// @extend .glyphicon;
// font-size: 0;
// text-align: center;
// padding: 3px 0;
// width: 28px;

// &:before {
// font-size: 14px;
// }

// .ui-sortable-handle {
// @extend .glyphicon-sort;
// cursor: all-scroll;
// }

// .view_link {
// @extend .glyphicon-search;
// }

// .edit_link {
// @extend .glyphicon-pencil;
// }

// .delete_link {
// @extend .glyphicon-trash;
// }

Update the browser tab and you will see that buttons are now too big:

Buttons are too big

To fix this, add the following lines to the end of the file:

.member_link, .ui-sortable-handle {
padding: 0px 10px;
}

The result:

Buttons with the proper size and without icons

You can see the completed file here.

To fix this error:

gpg: keyserver receive failed: Server indicated a failure

In your command replace hkp://pool.sks-keyservers.net with keyserver.ubuntu.com .

For example:

gpg --keyserver hkp://pool.sks-keyservers.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB
# Output: gpg: keyserver receive failed: Server indicated a failure

gpg --keyserver keyserver.ubuntu.com --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB
# Output is fine

Photo by Campaign Creators on Unsplash

To solve this problem, we should add a specific attribute to tr element:

And now we can perform turbo_stream.replace in our controller:

Source

There is a standard for the phone number called ‘E.164’.

It says that the phone number should have a ‘+’ sign at the start and a maximum of 15 digits.

So, our JavaScript should:

1. Check if there is a ‘+’ sign at the start of the string and add it if necessary.
2. Do not allow to enter letters and other signs. Only digits.
3. Allow to enter up to 15 digits.

The JavaScript code which implements this functionality:

Demo:

You can see this error:

undefined method `turbo_frame_tag'

when trying to use turbo_frame_tag inside of your ViewComponent.

To solve this, add a helper to your ApplicationComponent:

And inherit from ApplicationComponent.

Update Credentials of Current Environment

To edit Rails 7 credentials in the preferred editor, run:

EDITOR= rails credentials:edit

Replace <editor> with editor name.

For example:

# nano
EDITOR=nano rails credentials:edit

# mate
EDITOR="mate --wait" rails credentials:edit

Update Credentials of Other Environment

To edit production’s credentials, run:

EDITOR=nano rails credentials:edit --environment

Replace <env_name>with needed environment name.

For example:

# production:
EDITOR=nano rails credentials:edit --environment production

# staging
EDITOR=nano rails credentials:edit --environment staging

Get a List of HTML Tags used in your code:

Get a List of HTML Attributes used in your code:

First things first, add ‘JWT’ and ‘Blueprint’ gems to your Gemfile.

JWT gem is a ruby implementation of the RFC 7519 OAuth JSON Web Token (JWT) standard.

Blueprinter is a JSON Object Presenter for Ruby that takes business objects and breaks them down into simple hashes and serializes them to JSON.

So, your Gemfile should contain these new lines:

Then run bundle in the Terminal.

To be able to access API pages, add them to the routes.rb file:

Create app/controllers/api folder and put the api_controller.rb file there:

To implement the registration feature, create this registrations_controller.rb file. Note, that standard registration logic is reused from the version of the application before the API feature implementation. Here we used the DRY Monads.

Implement the authorization feature in sessions_controller.rb:

To test the API we can try to get the profile data for an authenticated user with the users_controller:

Add Blueprint that will transform object’s data to JSON:

That’s it! You have JWT Auth API with DRY Monads in your existing Rails application.

To render the ViewComponent with Turbo Stream in your controller do the following.

Now you can render the content in your SearchComponent.

To enable the glow effect from the Synth Wave ’84 extension you should run the VS Code with administrative privileges.

In the Ubuntu & Arch systems, you shouldn’t run the VS Code with sudo.

Instead, run this command in the Terminal.

Open the Command Palette in VS Code with Ctrl+Shift+P and run Enable Neon Dreams.

Restart the VS Code and you will see the fancy glow effect.