Skip to main content

Blog

Agaric Sponsors Modulecraft for the Building of Drupal Shared business, Development, and Training Tools

For community shared business, development, and training tools, Agaric throws a little sponsorship at modulecraft.

Agaric Provides Very Minor Assist in Readying Insert Module for Drupal 7

Benjamin Melançon of Agaric helped with a patch for the Drupal 7 version of Insert module.

A round red capped mushroom with white spots.

Agaric?

What the word agaric means and why Agaric took it for our cooperative's name.

Designed to Life

Functionality designed to your life is the Agaric Design signature. Utilizing open source, free software from around the world, Agaric Design websites are impeccably crafted with a modern, sophisticated and understated spirit.

The Story on Agaric

I've always had a passion for good design and healthy coding, even back in the days of owning a web site cart in downtown Natick. Back then, my business partner and I made all natural HTML roll-up web sites and, as an incentive for customers to wait in line, we baked Drupal into different flavored designs.

Thank you for being awesome!  Use this page to register with your discount. If you want to attend more than one training, fill out the form once per training.

We will send you very occasional dispatches from our perspective on various overlapping movements for cooperation, freedom and justice as workers and as passionate observers.

The contextual filter configuration screen.

About the Map

The Climate Justice Action Map (CJAM) is a custom mapping tool that pulls 350 events and groups from multiple data sources (eg: ActionKit, EveryAction, CiviCRM) and displays an interactive map supporters can use to get involved.

 

350.org's climate action map.

It can be embedded within websites with many customization options (eg: preset the map center to a location,, show the map’s text and buttons in a different language, show only events related to a particular campaign, etc.).

It uses Mapbox for the map, OpenStreetMaps for the tileset, and Google Maps for the search lookup.

The CJAM Extract, Transform Load (ETL) Application is a data processor written in Python that runs every 15 minutes and pulls in data from those many sources (eg: EveryAction, CiviCRM) via APIs and direct SQL queries. It writes the combined event and group data to a JSON data file hosted on Amazon S3, which is then consumed by the CJAM JavaScript.

Our Approach

We met with 350 in mid-June, with the strikes set for September 20th and organizing pushes in July and August. With tight deadlines, a new team and a new codebase, we quickly got to work understanding the goals of the map, its current implementation and what needed to be done for each milestone.

Users First - Getting Clear on the Goals

On projects demanding quick turnarounds it's tempting to dive head first into the issue queue. We know though, that a project is only successful if everyone is aligned on the overall goals of the project. Luckily, the product team already had excellent documentation (they even had a slideshow!) on what the purpose of the climate action map and its key audiences.

 

Slideshow of goals.
350.org had a slideshow detailing the goals and audiences, helping us gain the background knowledge needed to effectively collaborate.

Goals

  1. To demonstrate the geographic scale of our work to visitors
  2. To connect site visitors to the following activities:
    - Attend an event
    - Get involved with a local group
    - Learn about our regional work
  3. To give staff the ability to embed the map on different sites and customize it to suit the purposes of the pages it's being embedded on.

Key Audiences

  • Site Visitor
  • Map Embedder

These documents were great to have coming into our kickoff call.

Refactor While Learning

Getting familiar with the inner workings of the climate action map was particularly challenging because the code was essentially in two states: the main branch with the original custom JavaScript and a refactor branch where the transition to React.js was happening. React is one of the most popular and widely used frameworks. Converting the application to React made the code easier to maintain and build upon. The original volunteer developer had begun this process of conversion and there were new features written in the new React way, unavailable until the refactoring was complete.

Mauricio and Chris met with him to get clear on how to see the transition to the end. They then set to familiarizing themselves with the codebase and refactoring along the way. By understanding, for example, a long complex function, and then rewriting it into smaller discrete functions, we were able to simplify the code, wrap our head around its inner workings and make it easier to work with for the next developer to join the project.

Debugging Woes

When first working with a codebase it takes time to understand why a new change isn't sticking or why an error is occurring. Logs are a developer's best friend when it comes to debugging. Unfortunately, the logging available was stark. The ETL had a running log, but wasn't saving to a file for future reference or easy retrieval. Chris made the error log easy to reference and  even added Slack integration sending a message to the team whenever an error occurred - helping people quickly respond to issues.

Strike Globally, Mobilize Locally

350.org has hundreds of chapters, spread across seven continents, with members speaking dozens of languages. Their mapping tool was built with this diversity in mind. It serves as a powerful storytelling device (goal number one), with a single map conveying the impressive reach of the movement, and not making assumptions as to where a visitor is or what they're looking for.

On the other hand, mobilizing is most effective when it comes from people we know, from communities we're part of. As such, the map can live in more localized contexts, showing just events and groups relevant to a particular scenario. For example, the 350 Colorado chapter can display a map zoomed into the Mountain West, while 350 France can show a map with just events in French.

These custom maps are created using embed parameters. To do this, a 350.org organizer pasted the map onto a page using an iframe, passing in parameters such as language, location and data source by including a query parameter in the url.

However, this approach was cumbersome, technically prohibitive and error prone. We dropped the iframe approach and replaced it with a series of shortcodes, a more intuitive method, that make direct calls to the Climate Action Map API to render a map specific to an organizer's needs.

We added support for the following short codes:

  • data-src-search - pass in a location search term and the map will pre-search to that location event-campaign - show only results tagged with a specific campaign, eg: ‘climate strike’
  • date-range-start - show events that start on or after a certain date
  • date-range-end - show events that end before or on a certain date
  • data-src-lang - show map text in a certain language
  • data-src-latlong - center the map at a certain latitude and longitude point
  • data-src-zoom - set the default zoom level
  • data-src-layers - specify which kind of data to show (campaign, event, group)

Now organizers can create any number of maps with criteria meeting their campaign or community's specific needs.

What Exactly is the "Future"? - Calculating Timezones with Python

With so many different events happening at any given time, the map risked overwhelming visitors looking to get involved. 350.org's designer Matthew Hinders-Anderson came up with the solution of applying different map pin styles to events depending on when they were happening. Past events have a subdued teal, while current and future events have a strong teal. To emphasize the storytelling (goal number) of the map, current events throb.

To accomplish this, we needed to calculate an event's date and time relative to the current time. Unfortunately, many of the events had no timezone associated with them. However, they did all have some form of location available. Chris found a handy Python tool called timezonefinder that calculates an event's timezone based on latitude and longitude.

With the timezone in hand, Mauricio could then apply the different colors (and flashing) based on the event's time relative to now.

 

Climate strike map with today's events pulsing.
We used Python to calculate an event's timezone based on its latitude and longitude.

 

Seamless Onboarding

With so many events organized, we wanted potential strikers to find an event to attend quickly. Map embedders found though, that sometimes searches would result in an empty map, despite events being nearby. This is one of the many challenges of designing interactive maps. One example was a visitor living in a nearby suburb of Boston. A search for Allston would turn up nothing, despite there being multiple events within a 5 mile radius. We fine tuned the zoom in behavior to better show nearby events.

There were still edge cases though. We addressed this by showing a "Zoom out" button if a visitor came up empty. Clicking that zooms a user out to the nearest result.

 

Screen recording of visitor searching for Laramie, getting no results, clicking the zoom out button and seeing the Northern Colorado group.
If a visitor gets no results from their search, they can zoom out to the nearest event or group.

 

The Results

The mobilization plan was to push activists and organizers to plan events from June through August. Then rally as many people to RSVP to the newly created events from August up until the big days: September 20th and September 27th. We rolled out the embed code functionality in  August which organizers put to good use, embedding local and regional specific maps on local 350 group pages and climate strike specific websites they had built.

The map was so popular, that other organizations asked if they could embed it on their own sites - increasing the mobilization points and audiences reached. That we were able to do this speaks to the importance of defending the open web and free and open source software that allows for the decentralized sharing and using of tools.

On the first day of the strikes the pin styles came to life, lighting up the many walkouts, rallies and protests happening that day. It was a go to graphic for journalists and supporters on social media to share when reporting on the unprecedented participation.

Ultimately, the numbers we saw was a testament to the long, hard work organizers constantly engage in and the urgency of the moment we are in. However, with tools like the Climate Justice Action Map, built by technology activists alongside the organizers using them, we deepen and widen the mobilizing possible. And in these times of massive wealth inequality, deep political corruption, and closing window of time for the bold action we need, disrupting the status quo is more important than ever before.

Special thanks to the 350.org product team members Kimani Ndegwa, Matthew Hinders-Anderson, Nadia Gorchakova, and suzi grishpul for their vision, management of the project and design and development leadership.

Those could be separated by a comma using CSS. For example, "By Clayton Dewey, Ben Melançon, David Valdez."

A more natural display, though, would be "By Clayton Dewey, Ben Melançon, and David Valdez." If, instead of three people, two people wrote the article (as is the case), we would want to display "By Clayton Dewey and Ben Melançon."

Before, a sitebuilder would have to abandon structured content for a text field which an editor would use instead. In other words, instead of using a reference field to display the authors (even if present on the edit form), the sitebuilder would add a regular text field for the content editor to write out the list in a more human-friendly way and that is what would be output, or the content editor would write the byline into the body field.

Now, displaying lists of structured content naturally is possible with the In Other Words module.

(More featureful listings are also possible with Twig templates, but that does not empower sitebuilders— it bogs down themers!)

For text list fields and entity reference fields, In Other Words provides the In Other Words: List field formatter. Its settings page looks like this:

Building the open web

Former school teacher turned technologist, Clayton now applies his background in linguistics, community organizing and web development as a user experience architect for Agaric and co-founder of Drutopia.

Clayton has worked with universities, open source companies, tech diversity advocates, prison abolitionists, and others to translate their organizational goals into impactful digital tools with meaningful content.

Aside from content strategy and information architecture, Clayton also enjoys being a goofy dad and always appreciates a good paraprosdokian.

As Drupal awareness grows and more people adopt it as a platform, the community becomes more interesting. There are some real characters that have grown to be major contributors to every facet of the beast. How did they evolve and find their place?

You cannot just apply the stereotypical nerd face to the Drupal community; it will not stick. This is the most welcoming community I have been a part of in my 17 years as a contributor in the Web Development arena, and in 8 years with Drupal, I have seen many new members welcomed enthusiastically.

For newcomers to the community, and to plenty of us who have been here for years, sometimes the question can be: where is my place in the Drupal community? The answer is: You can have many places or roles in the Drupal community. You are not limited to wearing one hat. Believe it or not, there is even a place for someone that has never seen Drupal. What better UI test candidate is there? From Guinea Pig to Drupal Glory, the path can start right there at zero.

Here is a recent month in my life with Drupal: January, 2014.

I managed to go to several meetups, be part of a Drupal Nights panel at BioRAFT in Cambridge, MA and I have three new Drupal client Websites in progress. I am a Project Manager on two sites and an Architect on the other. I introduced four new people to the Drupal community, two PHP developers, one artist, and one musician. All four of my friends have come to a meetup and they have each installed their first Drupal site! I think it is important to introduce new people to the Drupal community and to try and see it through by hooking them up with specific projects that may interest them, or by introducing them to people already part of the Drupal community that may have similar projects or goals.

A few weeks ago I finally convinced a colleague and friend that lives in Western Massachusetts to attend a Drupal meetup. We met years ago when we worked together at an over-funded company that developed an over-priced proprietary software app similar to Google Hangouts (we broadcast concerts and live events to anyone that downloaded the proprietary player). The company blew up in the dot com bubble burst at the turn of the century (just wanted to be able to say that phrase—'turn of the century'—it sounds kind of epic).

My friend had been trying to get his online store to be automated and he had been through the mill trying different solutions, some proprietary, Wordpress, even doing some strange super complex import process using Microsoft Access. I drove from Boston 100 miles West to pick up my friend and find the meetup in a small town called Hadley, MA. On the meetup page it counted only three people that had RSVP'd to attend. I hoped they were the right three people for my friend to meet. I also brought another friend with me from Boston, a local artist that needs a portfolio site and a way to sustain himself financially while helping other artists/musicians. He had just installed his first Drupal 7 site and had no prior experience with creating a website.

We arrived at the meetup just in time for some delicious pizza (yes, Drupal does feed your body as well as your mind sometimes) and lo and behold, there were about 20 people that showed up. The highlight of my night was when my friend asked if anyone thought he could create his site using the Commerce Kickstart distribution. He had already installed it and had started watching tutorials on how to set it up; the resounding answer was—of course—yes… but the better part is that a couple of people took great interest in his project (they were probably musicians) and right then and there, they walked him through a few solutions to some of the biggest challenges of his project, suggesting configurations and additional modules he could use.

The best part: Now my friend will be able to share his knowledge and help other people set up Drupal with Commerce Kickstart. In the near future I am sure he will also be helpful working on projects that require advanced configurations for Commerce Kickstart because I have known him to be creative, caring, and brilliant at learning new things— and now he has been bitten by the Drupal bug!

So, for that night, my place was to introduce new people to the community. The next day I helped someone install Drupal, so my hat changed. Another day my partners Ben Melançon and Stefan Freudenburg helped me set up my development environment on my new Linux box (which I promptly destroyed beyond repair). That day I was in the "help me I am falling" cheap seats place, but it did not feel irreversible. I was soon back in my site-builder role (making a site for my local Linux users group). A place we can all occupy sometimes, a role we can all play, is introducing new Drupal community members into the fold.

I would love to hear your stories of non-scary (or scary) introductions to Drupal, and hats you tried on to see if they would fit!

As big tech continues to violate our privacy, thwart worker power, collude with militaries and deportation agencies, we need to move to ethical tech tools we can trust.

However, it can be intimidating to make the switch to new, unfamiliar tools.

Micky is leading two workshops to help people make the switch.

“How to Switch to Free Software: Email” 4:45-6:45pm Wednesday, December 4

Micky Metts of Boston’s Agaric Tech Cooperative will help us get out of the fix. The key to regaining security and control of the internet is switching to free software equivalents to proprietary/corporate software for communicating – among many uses.

This first workshop focuses on communications using email and texting software. The moderate inconvenience of switching is worth the privacy of strong encryption and the freedom of a new world of user-controlled communications and organizing. This first workshop in Sala Quetzal focuses on email and texting with encrypted software under user control. Bring your phone.

“How to Switch to Free Software: Browsers Etc” 2-4pm Thursday, December 5

A professional software developer, Micky, will focus on this second workshop, also in Sala Quetzal, on browsing, searching, and virtual meeting software. She will show how free software opens up the world of “platform co-ops” – think of Uber under drivers’ control and AirBnB under homeowners’ control.

Micky will be assisted by at-the-elbow translator/helpers. Bring your laptop and your phone.

  1. Define the parameters of your cooperative environment.

    It could be in Articles of Organization, ByLaws or a simple contractual agreement between members or even a handshake. A cooperative or collective is defined by the members.

  2. Find co-workers in your industry that value cooperative principles.

    Talk to people in your personal network about your goal.

    Let former co-workers know you are forming or seeking to work with a cooperative.

  3. Go to events where you will meet members of cooperatives and ask them how they are structured internally

    There are meetups (meetup.com) or you could start one in your area.

    Reach out to mailing lists you are on and ask if people are interested in working collectively.

  4. Search for cooperatives that are listed in online directories and research their strategies

    Food:

    coopdirectory.org

    Worker coops:

    usworker.coop - member-directory

    Open Directory search for all types of coops:

    find.coop

    ica.coop

    and Twitter - https://twitter.com/hashtag/cooperatives

  5. Join in the Free Software movement so we are building a cooperative society on a free, not proprietary, foundation.

    Free Software Foundation

  6. Invest in other cooperatives.

    Encourage pooled funds from successful cooperatives to help bootstrap new proposed cooperatives

  7. Join a cooperative network or 2 or 3...

    http://usworker.coop
    http://techworker.coop

  8. We invite you to join the Show and Tell mailing list

Get involved in conversations, and create conversations. Let others know you are interested in cooperative work experiences and you are seeking information and connections.

""

Upgrade from Drupal 6 or 7 when it is right for you

In the era of modern Drupal, release cycles of major versions have only minor importance

There are four principles, freedoms, that define free software, the building blocks of this Digital Commons resource we all rely on.

  • Freedom 0 - The freedom to run the program as you wish, for any purpose.
  • Freedom 1 - The freedom to study how the program works, and change it, so it does your computing as you wish.
  • Freedom 2 - The freedom to redistribute copies so you can help others.
  • Freedom 3 - The freedom to distribute copies of your modified versions to others.

When software is built this way, it protects us as users from malicious backdoors compromising our security, proprietary algorithms obscuring what we see and don't see, and predatory vendors locking us into expensive contracts. It also democratizes our technology - making it free for anyone to install and make use of. Examples of software in the digital commons include the Firefox browser, Linux operating system, and MediaWiki (which powers Wikipedia).

Stewarding the Digital Commons

Using free software doesn't automatically mean that one is fully participating in the Digital Commons. For example, we use Drupal, Django, and WordPress to build websites. It is common for sites to then add on custom code, or configure their site in unique ways - source code that is hidden from the general public.

 

Diagram of the Digital Commons.

The diagram above shows an example website that has most of its software within the Digital Commons. However, there is some custom code (code written by someone that hasn't been released back into the commons) and some proprietary software integrating with the site.

" "

Taking a closer look at who is maintaining and contributing to the various projects, we see that the software in the Digital Commons has many more people behind it. When something is free and open, then communities of literally thousands of people can help maintain the software. When something is custom code, only the original creator and their coworkers can maintain it (poor David). And when it comes to proprietary software, we're handing complete control over to the company who owns it.

Maintaining Transparency and Code Quality in an Era of Tech Abuse

Freedom 1, the freedom to study how a program works, ensures that site visitors and users know exactly what a website or app is doing. Even if a website starts out using free software, it's possible to extend it to do all sorts of malicious things. Sharing one's code with the world is a way to communicate transparency. Note that, this is separate from one's data, such as user passwords and personal information - that stays under lock and key.

Keeping all code written out in the open also adds a layer of auditability regarding quality. We follow software development best practices and to back that up, we share that code with the world. Besides, best practices aren't always cut and dried, and there are often opportunities to make good code, great.

Contributing Code Back, Benefits Everyone

When possible, we write and use what is called "contributed code." This is code that has been written in a generalizable way so that others can also benefit from it. Often, a tool already exists to solve a problem. Other times a tool might get a project 90% of the way there. Some might decide to meet their unique case by building something from scratch. We, however, prefer to build upon existing solutions.

For example, when we built the ability for Portside to cross-post their articles to Twitter, we did that by improving the Social Post Twitter module - a tool anyone running a Drupal site can use as well. We could have written that as custom code, only for Portside to use. However, we took the time to contribute this back to the community.

Contributing code to the Digital Commons is not just a kind thing to do; it helps strengthen the software we rely on. As mentioned above, now the Social Post Twitter module is available for others to audit and make improvements to. While custom code is maintained by whoever initially wrote it, contributing code back to the commons opens that software up to maintenance and improvement from a wider community. The more sites using that software, the more attention and care it receives.

Going Slow to Go Farther

It can take more time to contribute code back to the commons than creating a one-off solution. For nonprofits and other organizations on small budgets, it may seem impractical or foolish to take the extra time to contribute code. However, we've found that the stability and future improvements gained by keeping the code in the commons is well worth it. It also ensures your software is maintainable moving forward. We've seen nonprofits get burned time and again by developers who choose to write custom code that is then difficult for others (or even the original authors!) to come in and maintain. By keeping your software in the commons, you protect your projects with the strength of the free software community.

Shifting from Scarcity to Abundance

Funding a solution that will then be shared and available for others to use for free can again sound foolishly selfless. Why should we let other organizations use for free what we had to commit significant resources to? It can feel odd to sponsor work others get for free. However, it's important to keep in mind that no software is built from scratch. We all stand on the shoulders of those who came before us. The functionality free software already provides, was paid for by someone else – either with money or volunteer time. When our clients are generous enough to agree to contribute their solutions back to the commons, we are sure to recognize them for it. This both lets others know the stewardship and leadership they're making in the Digital Commons.

Steps to Stewarding the Digital Commons

Now that you know more of the Digital Commons you are part of, we hope you join us in taking care of and benefiting from it. If you're a freelancer or agency, look for opportunities to change your workflow to deepen your participation in the commons. If you're an organization, audit your existing technology stack. Are there tools you use which are proprietary that you could be using free software for instead? Do you have custom solutions that would be better off contributed to the commons? Is your website or app's source code posted for people to audit and learn from? The next time you budget for a new improvement, discuss how that could be contributed back. Being part of the Digital Commons makes the software we all use stronger.