March Madness: New Forge Component Contest!

March Madness: New Forge Component Contest!

  

#WINNING in March: Your Component?

Join us for OutSystems New Forge Component Contest!


In the US, March is about winning basketball games. But, there are other ways to win in March. So, if you have a component idea that you keep putting off, this is the time to get it done because you could win some great prizes like an Apple Watch or some OutSystems swag. 



How to Enter

Reply to this thread with a link to your component, and a description. Of course, your component will have to follow all of our requirements here. Anyone, from anywhere in the world may enter. 

Submissions are open until March 31. The winners will be announced April 5th.


Requirements for the component

  • New components only (published from March 1st to 31st, 2017)

  • Created for OutSystems 10

  • Description and image

  • Appropriate tags

  • Original (cannot be a copy or duplicate of another existing component)

  • Installs and runs on an OutSystems Personal Environment

  • Example of its value (the benefits of using it)


How to Vote

To vote, please “Like” the component reply in this thread.Screen Shot 2017-02-22 at 9.02.54 AM.png You may vote for your own component and for as many other components as you like.


How to Win

Get to the top 3 by having the most votes (likes). The final winner will be assessed and chosen by the OutSystems Community team. You may submit as many new components as you wish.


Prizes

First Place


Second Place


Top 10 - Honorable Mentions

  • OutSystems SWAG pack



New to Forge Components? Check out our Complete Guide to Creating Components!


*Unfortunately we do not ship to certain countries due to high import fees. If your country falls in this category, we will give you an online voucher as a prize.


If you have any questions, contact community@outsystems.com

Brace yourself components are coming!

Here's my first submission. 

The Play Games Services Plugin, provides APIs that let you easily integrate popular gaming features such as achievements and leaderboards in your web-based games.

Alexandra Bowen wrote:

#WINNING in March: Your Component?

Join us for OutSystems New Forge Component Contest!


In the US, March is about winning basketball games. But, there are other ways to win in March. So, if you have a component idea that you keep putting off, this is the time to get it done because you could win some great prizes like an Apple Watch or some OutSystems swag. 



How to Enter

Reply to this thread with a link to your component, and a description. Of course, your component will have to follow all of our requirements here. Anyone, from anywhere in the world may enter. 

Submissions are open until March 31. The winners will be announced April 5th.


Requirements for the component

  • New components only (published from March 1st to 31st, 2017)

  • Created for OutSystems 10

  • Description and image

  • Appropriate tags

  • Original (cannot be a copy or duplicate of another existing component)

  • Installs and runs on an OutSystems Personal Environment

  • Example of its value (the benefits of using it)


How to Vote

To vote, please “Like” the component reply in this thread.Screen Shot 2017-02-22 at 9.02.54 AM.png You may vote for your own component and for as many other components as you like.


How to Win

Get to the top 3 by having the most votes (likes). The final winner will be assessed and chosen by the OutSystems Community team. You may submit as many new components as you wish.


Prizes

First Place


Second Place


Top 10 - Honorable Mentions

  • OutSystems SWAG pack


*Unfortunately we do not ship to certain countries due to high import fees. If your country falls in this category, we will give you a online voucher as a prize.


If you have any questions, contact community@outsystems.com

Hi 

I have wrapped a Cordova barcode scanning plugin, https://www.outsystems.com/forge/component/1934/barcode-scanner-plugin, because the current barcode scanning plugins do not work i.e. they give false readings when scanning simple barcodes. I have tested this plugin thoroughly on numerous barcodes and it give positive readings every time. The plugin is for mobile apps and scans numerous barcode types. It also gives the user feedback on what barcode type it is.


Cropit

A jQuery plugin for image cropping and zooming. Loads images locally via FileReader, and crops them using canvas. Designed to be extremely customizable via CSS. Best for the cases where you want users to upload images of a specific size and aspect ratio.

Hi!

SocialLogin is a simple drag and drop authentication mechanism for multiple OAuth providers.

If you don't care about OAuth implementation details and you need to authenticate an user against Facebook, GitHub, Google, Instragram, Linkedin..., this component is for you, just drag a web block!

Please feel free to drop your feedback.

Hi there! Another week, another component!

Native Audio Plugin

You can see the plugin in action here. For a starting point you can check the Music Pad App at the forge.


This plugin enables concurrency (multi-channel playback), polyphony (multi-voice playback) and minimized latency (via caching) in audio-based applications, by leveraging native audio APIs. Designed for the use in HTML5-based cross-platform games and mobile/hybrid audio applications.


Cheers!

I Miss You!

Simple plug-in that changes the page title and favicon of your page when it is not the active tab on your web browser.

Very basic and easy to use and an effective way to get your users back to the page/tab you want!

Wraps: https://github.com/Bahlaouane-Hamza/I-Miss-You

Try it out here!

And throw me a like while you're at it   

More to come soon,

Justin

Mobile version of the datedroper plugin, a simple to use calendar picker with multiple functionalities like language, calendar mode, popup mode...

http://www.outsystems.com/forge/component/1969/datedropper-plugin/

and here is the desktop version that was updated today with the same functionalities

http://www.outsystems.com/forge/component/1146/datedropper/

Mobile version of the timedropper plugin, a simple to use time picker.

http://www.outsystems.com/forge/component/1968/timedropper-plugin/

Launch Navigator Plugin



You can see the plugin in action here. For a starting point you can check the OutSystems Navigator Demo App here at the forge.


This plugin can be used to navigate to a destination using the native navigation app on:

  • Android: Google Navigator
  • iOS: Apple Maps/Google Maps[1]

[1]: on iOS, you can choose to prefer Google Maps over Apple Maps if it's installed on the user's device; if not, Apple Maps will be used instead.

Component with 0 downloads and then with many likes....   

Pedro Coelho wrote:

Component with 0 downloads and then with many likes....   

Sometimes, likes are given to the ideia, to the utility it might have, to the person proactivity, or better than that... the willing to help by sharing the stuff.   

Cheers

Here is my contribution.

http://www.outsystems.com/forge/1999/

Is a component for creating dynamic forms, with validations, masks, tips and dependent fields.

Very useful when the user needs to create his form, create polls, surveys, quiz and checklists.


Ok, this is contribution from country of Indonesia (Outsystems Partner):


Image Overlay for Google Map Web Plugin

https://www.outsystems.com/forge/Component_Overview.aspx?ProjectId=2006

Require Google Map Component...

Use Case: Attach Floorplan (use roadmap type for better max zoom)


How to use it:

1. Add dependency: Google Map and Google Map Overlay

2. Add usual Map from Google Map Component

3. Add MapOverlayFlow\AddMapOverlay webblock below the Map webblock.

4. Assign input parameter: MapId, ImageURL, North East Latitude & Longitude, South West Latitude & Longitude


Image will be drawn and resized at North East point & South West point bound.



Another one from me:


OpenStreetMap MapType Plugin for Google Map Component

https://www.outsystems.com/forge/Component_Details.aspx?ProjectId=2008


Require Google Map Component...

OpenStreetMap have more contrast and looks just like a paper map...

Google Map have more details, but if you want a fresh looking and different map, this one is for you...


This is not a complete map replacement to OpenStreetMap!

We're still using Google Maps JS API through Google Maps Component, only the map tile is using OpenStreetMap.


How to use it:

1. Add dependency: Google Map and Google Map OpenStreetMap

2. Add usual Map from Google Map Component

3. Add GMap_OSM_Flow\OpenStreetMap_MapType webblock below the Map webblock.

4. Assign input parameter: MapId

5. Set MapOptions in Map component to:

"{
    mapTypeId: 'OpenStreetMap',
    mapTypeControl: false
}"

mapTypeControl is disabled because when you click Map Control, mapTypeId will be reverted to Google Map's own 'roadmap'.


Note: max zoom is locked to 19 when using OpenStreetMap MapType


Google Maps regular 'roadmap' for comparison:

Heatmap Plugin for Google Map Component

https://www.outsystems.com/forge/Component_Details.aspx?ProjectId=2019


Require Google Map Component...

Use Case: Showing heatmap on Google Map Component


How to use it:

1. Add dependency: Google Map and Google Map Heatmap

2. Add usual Map from Google Map Component, set desired center lat/long, zoom, and MapOptions

3. Add GMaps_Heatmap_Flow\GoogleMap_Heatmap_APICall webblock above the Map webblock (used to hook API Call with Visualization Library, before actual Google Map Component's own API call)

4. Assign input parameter: APIKey (it's the same API Key you entered on Google Map Component)

5. Add GMaps_Heatmap_Flow\GoogleMap_Heatmap_Plugin webblock below the Map webblock

6. Assign input parameter: MapId

7. Assign input parameter: Radius (integer value e.g. 10) <blank=default radius>

8. Assign input parameter: Opacity (decimal value e.g. 0.8) <blank=100% opacity>

9. Assign input parameter: GradientColor (possible choice: blank [default] or "blue/red")

10. In Preparation Logic of your screen, query your data using aggregate, loop data and ListAppend HeatmapPoints, after that use SetHeatmapData logic with HeadmapPoints as input parameter.


For more details, look at Heatmap_Sample module (included).



Radius, Opacity, and Gradient Color are customizable...

Physical Table Name is an application to help us find the table on Databases Manager.


http://www.outsystems.com/forge/Component_Versions.aspx?ProjectId=2021




Resizable Columns

Component that can be linked to any table that will allow the user to dynamically resize the columns of their tables.

Configured to notify back the values of the column sizes that can be stored per session or in the database (or not at all) and then passed back into the widget to have the column sizes persist for the user!

See it in action here!

A few sample screenshots:

If you have any feedback, let me know   

Toss me a like if this component made you cheer for dynamic tables, if not, you can toss me a like anyway  

Happy Coding,

Justin

Marker Clusterer Plugin for Google Map Component

Forge: https://www.outsystems.com/forge/2033/

Try Now: https://wildoutsys.com/GMap_Clusterer_Sample/

Require Google Map Component...

Use Case: Showing cluster of marker instead of individual marker on Google Map Component


How to use it:

1. Add dependency: Google Map and Google Map Clustere

2. Add usual Map from Google Map Component, set desired center lat/long, zoom, and MapOptions

3. Add GMaps_Clusterer_Flow\GoogleMap_Clusterer webblock below the Map webblock

4. In Preparation Logic of your screen, query your data using aggregate, loop data: add marker using Google Map Component as usual, then ListAppend Markers (type: List of Text), after that use AddMarkerToClusterer logic with MapId and Markers as input parameter.



When you click the cluster or zoomed in, the cluster will expand...

My first component:

FullBackgroundEffect 

Fills background image on a website that covers the entire browser window at all times. Let's put some specifics on it:

Fills entire page with image, no white space

Scales image as needed

Retains image proportions (aspect ratio)

Image is centered on page

Does not cause scrollbars

As cross-browser compatible as possible

Isn't some fancy shenanigans like Flash

Works in:


IE7+ (could probably get in IE6 with a fixed position shim)

Most any other desktop browser



Credits to:


https://css-tricks.com/perfect-full-page-background-image/

My second component:

Headroom


What's it all about?


Headroom.js is a lightweight, high-performance JS widget (with no dependencies!) that allows you to react to the user's scroll. The header on this site is a living example, it slides out of view when scrolling down and slides back in when scrolling up.

Why use it?

Fixed headers are a popular approach for keeping the primary navigation in close proximity to the user. This can reduce the effort required for a user to quickly navigate a site, but they are not without problems…


Large screens are usually landscape-oriented, meaning less vertical than horizontal space. A fixed header can therefore occupy a significant portion of the content area. Small screens are typically used in a portrait orientation. Whilst this results in more vertical space, because of the overall height of the screen a meaningfully-sized header can still be quite imposing.


Headroom.js allows you to bring elements into view when appropriate, and give focus to your content the rest of the time.

Credits to:
http://wicky.nillia.ms/headroom.js/

Hello, guys.

Here is my humble contribution:

Colors:

https://www.outsystems.com/forge/component/2037/colors/

Basically, this extension contains a possible implementation of the Euclidean Distance between Two Colors, with two possible usages.


Android Permissions Plugin

This plugin is designed for supporting Android new permissions checking mechanism.
Forge link


Requesting Permissions at Run Time

Beginning in Android 6.0 (API level 23), users grant permissions to apps while the app is running, not when they install the app. This approach streamlines the app install process, since the user does not need to grant permissions when they install or update the app. It also gives the user more control over the app's functionality; for example, a user could choose to give a camera app access to the camera but not to the device location. The user can revoke the permissions at any time, by going to the app's Settings screen.

System permissions are divided into two categories, normal and dangerous:

  • Normal permissions do not directly risk the user's privacy. If your app lists a normal permission in its manifest, the system grants the permission automatically.
  • Dangerous permissions can give the app access to the user's confidential data. If your app lists a normal permission in its manifest, the system grants the permission automatically. If you list a dangerous permission, the user has to explicitly give approval to your app.

Read more at: https://developer.android.com/training/permissions/requesting.html


Klout Score Tracking Application!

This application was created to allow my company's social media team track employee's progress by leveraging the industry standard Klout Score (www.klout.com). We run a monthly contest for highest average score and plan to add other contests in the future (eg Most Improved, Rookie of the Month, etc) in order to encourage increased social media activity. Enjoy!

https://www.outsystems.com/forge/Component_Overview.aspx?ProjectId=2041

hi osers,

here is my "learning" contribution:

https://www.outsystems.com/forge/component/2043/accelerometer/

This plugin provides access to the device's accelerometer. The accelerometer is a motion sensor that detects the change (delta) in movement relative to the current device orientation, in three dimensions along the x, y, and z axis. Have a nice gravity!

regards,

O

Eric Ilustrisimo wrote:

Klout Score Tracking Application!

This application was created to allow my company's social media team track employee's progress by leveraging the industry standard Klout Score (www.klout.com). We run a monthly contest for highest average score and plan to add other contests in the future (eg Most Improved, Rookie of the Month, etc) in order to encourage increased social media activity. Enjoy!

https://www.outsystems.com/forge/Component_Overview.aspx?ProjectId=2041

As a user of the application, can't thank Eric enough.  We were looking for a way to simply and quickly measure people's social engagement. Leaderboard is a simple, straight forward form of gamification. Manually gathering each person's is time consuming and, simply put, inconceivable.  Being able to add and remove people in a matter of seconds and measure people's progress is great to.  Thank you, Eric.  


https://www.outsystems.com/forge/component/2047/network-connection-information/


A simple plugin to check what connection type your mobile device has (Wi-fi, Cell-2G, Cell-3G, Cell-4G, Unknown, No Connection).


regards,

Baronk

The contest is now closed! Thanks to everyone for participating and submitting!


We are so excited to go through them and will announce the winner here on April 5th.

Solution

Thanks to everyone for your submissions! We were so excited to review them and impressed by the amount of ideas, the creativity and usefulness! We had 21 submissions and this thread has received over 717 likes! 


Based on a combination of a high number of votes, component downloads, and the usefulness of the component, we’d like to congratulate: 


First Place: Haurlem Lima with his Dynamic forms Component with 96 Likes and 52 Downloads!



Second Place: Miquel ‘Kelter’ Atunes with his Play Games Services Component!


We’d like to give an honorable mention to the below, Top 10 Components

We will be reaching out to you to coordinate your swag pack.


We were blown away by the results and are excited to do another contest in the future. If you have any ideas, feel free to add them under the Meta Category. Head on over to Forge and download their components now! 


Thanks again for your participation! 

Alex, Carla and the Community Team.

Solution

Awesome all around!

Congrats Haurlem Lima and Miquel ‘Kelter’ Atunes

Nice work everybody   

I want to thank everyone for their support.

Thank you very much, and congratulations to all for the contributions.