npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

pebble-effect-layer

v1.1.4

Published

Visual Effects layer for Pebble smartwatch

Downloads

3

Readme

EffectLayer is a visual effect layer for Pebble Smartwatch. User places the layer over screen at set coordinates and special effects are applied to that area of the screen. Effects work both Aplite/Basalt/Chalk platforms unless specified (e.g. Blur won't work on Aplite)

To use the library add #include <pebble-effect-layer/pebble-effect-layer.h> to your source. EffectLayer library is implemented in efficient pay-to-play way so only effects that you actualy use get compiled into your binary.

Inverter Bitmap Mask Text Mask

Currently supported effects:

EffectLayer* effect_layer_create(GRect frame) - creates effect layer and returns pointer to it. Parameter is GRect with coordinates and layer size, for example EffectLayer* effect_layer = effect_layer_create(GRect(0, 0, 144, 168)); will cover entire screen

void effect_layer_destroy(EffectLayer *effect_layer) - destroys effect layer and frees memory.

Layer* effect_layer_get_layer(EffectLayer *effect_layer) - gets underlying Layer of the effect layer for basic manipulations such as addin to Window root layer or layer's changing frame or bounds

Layer* effect_layer_set_frame(EffectLayer *effect_layer, GRect frame) - shortcut to set the frame of the effect layer.

void effect_layer_add_effect(EffectLayer effect_layer, effect_cb effect, void* param) - adds effect to the layer. Parameters are - effect layer that you created previously, name of the function to perform effect, optional data to pass to the effect. User can call this function multiple times on the same effect layer, adding multiple effects, so there's no need to create multiple layers. At this time library has following built in effect functions to represent the effects listed above:

void effect_layer_remove_effect(EffectLayer *effect_layer) - removes last added effect from the layer. parameters is effect layer that you created previously.

effect_layer_add_effect(my_effect_layer, effect_invert, NULL); - adds inverter effect

effect_layer_add_effect(my_effect_layer, effect_invert_bw_only, NULL); - Inverts pixels within the layer bounds if the pixels equal GColorBlack or GColorWhite. All other pixels are left untouched allowing for 2.x style black and white themes with splashes of color added for Pebble Times.

effect_layer_add_effect(my_effect_layer, effect_invert_brightness, NULL); - Inverts the perceived brightness of pixels within the layer bounds, except for pixels that equal GColorBlack and GColorWhite (can be used with effect_invert_bw_only to invert black and white pixels). The hue of the pixels is left mostly intact and was initially intended to maintain good contrast of color in cases where an app/watchface has both a light and dark mode with color UI elements without having to have multiple sets of color resources/coding. Works best when color elements are all designed to have good contrast on either a light or dark background and then the effect layer is hidden for that background and shown for the opposite background.

effect_layer_add_effect(my_effect_layer, effect_mirror_vertical, NULL); - adds vertical mirror effect

effect_layer_add_effect(my_effect_layer, effect_mirror_horizontal, NULL); - adds horizontal mirror effect

effect_layer_add_effect(my_effect_layer, effect_rotate_90_degrees, (void *)true); - rotates 90 degrees counterclockwise

effect_layer_add_effect(my_effect_layer, effect_rotate_90_degrees, (void *)false); - rotates 90 degrees clockwise

effect_layer_add_effect(my_effect_layer, effect_blur, (void *)my_radius); - Creates blur effect (on Basalt/Pebble Time only), where my_radius is uint_8t radius of the blur.

effect_layer_add_effect(my_effect_layer, effect_zoom, EL_ZOOM(x,y)); - Zooms screen area under layer by x and y

effect_layer_add_effect(my_effect_layer, effect_lens, EL_LENS(f,d)); - Applies Lens effect, where f & d are focal distance of the lens and distane to object respectfully.

effect_layer_add_effect(my_effect_layer, effect_mask, mask); - Applies Mask, achieving various transparency effects. See this article on usage examples.

effect_layer_add_effect(my_effect_layer, effect_fps, EffectFPS); - displays average FPS of the app

effect_layer_add_effect(my_effect_layer, effect_shadow, &shadow); - adds shadow of a given color to objects on screen of given color. shadow is a parameter of type EffectOffset:

typedef struct {
   GColor orig_color; //color of pixel being ofset
   GColor offset_color; //new color of pixel at offset coords
   int8_t offset_x; // horizontal ofset
   int8_t offset_y; // vertical offset
} EffectOffset;

For example if you want to give all red text under layer a yellow shadow 2 pixels long, you parameter would be:

EffectOffset shadow;
shadow.orig_color = GColorRed;
shadow.offset_color = GColorYellow;
shadow.offset_y = 2;  
shadow.offset_x = 2;

You can specify option in the parameter shadow.option = 1; to display long continuous shadow (to use this on Aplite you also need to specify shadow.aplite_visited array to keep track of set pixels. See https://github.com/ygalanter/Color_Shadow/ watchface for example implementation.

effect_layer_add_effect(my_effect_layer, effect_outline, &shadow); - Similar to the Shadow effect, however the color is added in all directions.

effect_layer_add_effect(my_effect_layer, effect_colorize, &colorpair); - Replaces the first color with the second, useful for 'painting' a b&w watchface. colorpair is a parameter of type EffectColorpair:

typedef struct {
  GColor firstColor;  // first color (target for colorize, one of set in colorswap)
  GColor secondColor; // second color (new color for colorize, other of set in colorswap)
} EffectColorpair;

For example if you want to take your black and white watchface, and make it black and green, your parameter for the above call would be:

EffectColorpair colorpair;
colorpair.firstColor = GColorWhite;
colorpair.secondColor = GColorGreen;

effect_layer_add_effect(my_effect_layer, effect_colorswap, &colorpair); - Similar to the Colorize effect, but also replaces the second color with the first, effectively like a targeted invert (useful for when you have two colors and just want them flipped, but they're either not a direct invert, or you don't want to affect other colors)

Library is user-extendable, if you define your function in format

void effect_my_own_cool_effect(GContext* ctx, GRect position, void* param) { /* cool effect code */ }

you can add it to EffectLayer in manner similar to above:

effect_layer_add_effect(my_effect_layer, effect_my_own_cool_effect, param);

Simple Striped watchface uses Mask effect to show background image thru transparent text TV Time watchaface uses inverter effect for battery info and blur effect for antialiasing fonts Long Shadow watchface uses shadow effect in "long" mode