Yeti Media

Guillermo Iguaran Joins Rails Core

We are happy to announce that Yeti developer Guillermo Iguaran has joined the Rails Core Team. Guillermo started contributing to the Rails framework in 2011 and is an active contributor.

He also contributes to other open source projects like rubinius, jruby and others (See Guillermo Github account). He’s also the author of Light: an HTTP rack based server.

Guillermo has been working on Rails 4 lately. He is mainly focused on the Asset pipeline, releasing a new version of sprocket-rais. Also he extracted StrongParameters from rails as a gem, did a complete refactor of ActiveResource and removed rack-cache as a dependency from rails 4.

Here are a couple of Guillermo’s posts for the Yeti blog:

Congratulations, Guillermo! Great job. Yeti Media is proud to sponsor Guillermo’s contributions to Rails 4.

ActiveResource is dead, long live ActiveResource

by Guillermo Iguaran:

As many of you already know, ActiveResource was removed from the Rails master branch and won’t be shipped with Rails 4. The motivation behind the removal was the lack of maintenance and maintainers on Core Team. But its not all bad news, ActiveResource now lives as an independent plugin and is receiving more love from contributors. There is also a small team lead by Jeremy Kemper working on it. Since the extraction from Rails we have added some nice features:

  • Basic support for associations: has_many, has_one, belongs_to now can be used in ActiveResource models. Here is a small example of it:

https://gist.github.com/4035394

https://gist.github.com/4035401

If the request to http://37s.sunrise.i:3000/posts/1 returns comments then @post.comments will be available immediately, if not, it will be populated the first time that @post.comments is called with a request to http://37s.sunrise.i:3000/posts/1/comments

  • Basic support for callbacks, after_create, after_save, after_update, before_create, before_save, before_update, before_validation, after_validation and other friends that can be used with ActiveResource models. A simple example:

https://gist.github.com/4035404

  • Support for APIs without a format in the path, you can now consume APIs that support setting of the desired format through the Accept header. I think this will be a nice feature appreciated by you RESTafarians ;)

  • Support for non-RESTful APIs, the ActiveResource models can set a collection_parser which can deal with API responses that do not match Rails (RESTful) conventions, a handy example to understand how it works:

https://gist.github.com/4035407

  • Support for Singleton resources through the ActiveResource::Singleton mixin. An example:

https://gist.github.com/4035417

  • Fixes, fixes and more fixes, we have merged a lot of fixes provided by contributors

We will release ActiveResource 4.0 in the next months (trying to be in sync with Rails 4 release) but I will be working soon in a plugin to backport all these changes to ActiveResource 3.2, then you won’t need to wait more to use all these exciting features in your current projects. Long live to ActiveResource!!!.

We will keep you posted with more updates about Rails 4 and all their related projects.

About Guillermo Iguaran:

Senior Software Architect and Open-source evangelist with more than 4 years of experience working as a software developer and programming with Ruby. Guillermo is a young developer and open source enthusiast who is rapidly moving up the ranks in the ruby community. Currently, he is a Rails Core Contributor and has contributed to some popular projects of the ruby world like Rubinius and JRuby.

Angular.js and the asset pipeline

A couple of months ago, I was developing an application with Rails and Angular.js and I found that when you deploy to production, the javascript application throws an error (SessionCtrl is undefined), ergo the app never started.

I have a controller in javascript like this one:

https://gist.github.com/3997766

And the routing

https://gist.github.com/3997770

The problem is when you deploy to production, the assets are compiled and compressed, and the controllers’ names that you declared are replaced by a letter (in favor of compress the code).

The solution to this problem is to create a controller using the function controller provided by angular.

https://gist.github.com/3997772

The routes should be slightly changed. Instead of providing the Controller function to the controller variable in the routes declaration, provide the controller name as a string.

https://gist.github.com/3997772

Now, when you deploy to production with the assets recompiled and compressed the application will start with no errors.

Blog back if this was helpful!

Moving forward with the Rails asset pipeline

From Yeti dev Guillermo Iguaran:

One of the big changes with Rails 3.1 was the inclusion of the asset pipeline. With all the productivity benefits it brought, there’ve been some headaches. Here are some notes on how it’s improving and changing in Rails 4.0.

Extraction to plugin

In Rails 4.0, the asset pipeline has been extracted to a separate plugin, named sprockets-rails. This extraction has helped to the plugin to grow independently from Rails Core, and follow the Rails moves towards modularity. I’ve been leading the development of the new plugin since the initial extraction (which I also performed).

Sprockets

Since the sprockets-rails gem was extracted, we were able to start to support the latest versions of sprockets and we are working on keeping sprockets-rails updated with the latest features available in sprockets.

We’ve agreed to sync sprockets and sprockets-rails version numbering, and now sprockets-rails 2.x will be compatible with sprockets 2.x. The next major version of sprockets will be released the next year and will bring exciting features like source maps support. Sprockets-rails 3.0 will be compatible with sprockets 3.0 and hopefully will be released before the release of Rails 4.1.

Precompiling

The precompiling has been improved dramatically by Josh Peek. Now sprockets has built-in support for precompiling and generation of a manifest log (that now is saved as json instead of yaml). In sprockets-rails we are dropping the StacticCompiler class used for precompiling in favor of the methods provided by Manifest class of sprockets for pre-compilation.

Additionally we are removing support for “double-compiling” (digested and undigested assets simultaneously); now the value set config.assets.digest in production environment is respected during the precompiling process. That change will improve the performance of precompiling dramatically, and we will encourage people to keep their undigested assets in the public folder.

Configuration options

We are doing some tweaks to some of the configuration variables used for asset pipeline:

  • config.assets.enabled was deprecated. Assets pipeline is enabled by default and to disable it you should disable the loading of the sprockets-rails framework like any other framework in Rails. For reference check this gist.

  • config.assets.manifest has been removed; this option was rarely used and often misused. By default the assets manifest is saved in the same place as assets, in future versions of sprockets it’ll probably will be moved to another folder.

  • config.assets.cache has changed its default value: now the default cache store (placed in tmp/cache/assets) isn’t shared between different environments. In Rails 3.x if you test in the browser, then run integration tests, then test in the browser browser, it blows away the cache at every change. In Rails 4.0 this won’t a problem anymore, since the cache used during integration tests running will be different than the cache used while you test on browsers.

  • config.assets.logger has been removed. Now sprockets is logging more silently, using debug level by default. If you still want to use a different logger set it with Rails.application.assets.logger =

Asset Tags Helpers

Josh Peek has refactored the code of all the assets tags helpers. Now the helpers are independent from ActionView helpers. This will make to the code easier to maintain and now it’s easier for users to track and debug errors related to assets tags helpers.

Performance

The performance for assets compiling has been improved drastically. Precompiling in most of the projects is requiring a couple of seconds instead of several seconds or minutes. For example, in a single application with multiple js and css assets:

Before:

% time rake assets:precompile rake assets:precompile

8.06s user 0.85s system 95% cpu 9.339 total

After:

% time rake assets:precompile rake assets:precompile

1.42s user 0.32s system 99% cpu 1.752 total

Nathan Broadbent is doing further work to optimize the precompiling even more, in how it detects changes in assets. There is an open pull request to merge his changes in sprockets and sprockets-rails. You can test his work right now with the turbo-sprockets-rails3 gem.

More updates on the good stuff on the way in Rails 4.0 coming soon.

How we built a Timeline plugin for angular.js.

After a good week of coding using the amazing MVW Framework angujar.js, I decided to build the first simple plugin, a timeline presenter.

First, we have to know how directives work,

Directives: from the angular.js developer guide: “Directives are a way to teach HTML new tricks. During DOM compilation directives are matched against the HTML and executed. This allows directives to register behavior, or transform the DOM. Angular comes with a built in set of directives which are useful for building web applications but can be extended such that HTML can be turned into a declarative domain specific language (DSL).” You have two ways to build a directive.

A short one.

https://gist.github.com/3371731

In this version you only provide the link function. The other options are provided by default.

And a long one.

https://gist.github.com/3371750

For this version you can find the explanation here: http://docs.angularjs.org/guide/directive For the timeline plugin we will use the short version. First, we have to define the directive format and the properties it is based on: A Timeline should have a box to add new data A Timeline should get data from an expression A Timeline should have the refresh time period Step 1,

https://gist.github.com/3371806

Step 2, define the module name and the directive name.

https://gist.github.com/3371761

Step 3, define the updateTimeline function that gets the data and prepends it in the timeline.

https://gist.github.com/3371766

Step 4, define the function that updates the timeline every certain amount of time, specified in the data-refresh attribute.

https://gist.github.com/3371775

Step 5, put all the functions inside of the directive function and execute the updater.

https://gist.github.com/3371801

Now is time to test our first plugin: http://jsfiddle.net/nsanta/BLjb7/4/ Final Thoughts: Angular.js lets you build presenters in a unique way, with a lot of simplicity. The most powerful feature of directives (this applies to filter and resources too) is that they can be extracted of your current project and turned into a reusable component with no pain at all. Source code for the timeline plugin: https://github.com/Yeti-Media/angular-timeline

Firefox Extension Development: How to Upload a File

We decided to create extensions for the most popular browsers for Upscrn (upscrn.com). This addons let you take a screenshot of your browser and upload it to Upscrn. After researching a bit (first time developing addons) I got my hands to it.

I started with Mozilla Firefox. The extension lets you select an area of the screen (or all of it), but the problem comes when trying to send it. Creating a XmlHttpRequest object and getting it ready to send a request is quite simple, but attaching a file to the request was quite a challenge.

I’ve tried sending it in a FormData, but it requires the file to be a File object a not a nsiFile one. One would think that would be simple to convert it, but if it is, I can not say it has been for me.

Creating a stream of the file, and sending it to Upscrn through the request, seemed to be a possible solution, but it was neccesary to refactor the api to handle such requests, so we marked it as a last resort solution (we did not want to do that). Things were getting serious, I even got to the 4th page on a Google search, I am sure you can imagine where I was. But I finally stumbled upon what seemed to be a solution. This guy (Chris Finke) had the same problem we did, and created a function that receives a set of arguments (file included) and generates a valid request body for sending them. You can check the original post here.

The function receives an associative array of the form fields, like

https://gist.github.com/3362935

and returns and array usable on our request,

https://gist.github.com/3362939

This array has a stream and a boundary. The function creates a stream that contains all the data we want to send (file included) together, and marks the end of every piece of info with the predefined boundary. To achieve this, first we create a stream for every element of the array we want to send. Each stream contains an object, if it is a file it’s filename and MimeType, and the boundary, delimiting the end of the object.

https://gist.github.com/3353438

Then we create the final stream, and append every other stream we have to it.

https://gist.github.com/99ea4703a2676085694e

That’s it, an array that’s passable as a parameter with the XMLHttpRequest.send method.

This is everything put together.

https://gist.github.com/ef61dc89e19aefc73507

If you want to see it in action, you can do it on our Upscrn Extension for Firefox here (around line #750).

A fun friday at Yeti-Media

Today it was decided that it was going to be a fun friday at the Yeti-Media Office.

Instead of bringing our own lunch or even going out to lunch we decided to enjoy the sunshine and have a BBQ. Burgers, Veggie Burgers, Potato Salad, Grilled corn on the cob and of course Bloody Ghost Chili Beers.  You may ask what the heck is a bloody ghost chili beer? Well It is PBR, Bloody Mary Mix, and GHOST CHILI SAUCE. We like it hot.

 

Happy Friday From all of us here at Yeti-media. If you find yourself in Orange County California this weekend. The Yeti Team will be at The Santa Ana Art Walk Saturday Evening. We hope to see you there. We Hope You Enjoy Your weekend. 

And don’t forget We are currently accepting new projects. Get your app started today. Yeti Media: A web an mobile apps shop http://yeti-media.com  feel free to contact us at info@yeti-media.com 

Meet some of our team members.

The first Yeti Team member we will introduce is……….

Yeti Media’s CEO Nick Treadway . 

Second is Yeti-Media’s CTO Nicolas Santa 

Next is Patrick Yeo he is our star junior front end developer

 Ariel Fernando Diaz Bermejo, He is The VP of Engineering here at Yeti-Media

Leandro Marcucci, He is a Senior Developer here at Yeti-Media. He Loves clowning around, when he’s not working of course. 

Last but not least is Salvador Olocco Gorla, He is one of our Developers here at

Yeti-Media.

 I am loving how much fun the staff is here.  I will highlight more of amazing Team very soon. You know you would love this fun bunch to work on your next project.

Get in touch to quickly turn your ideas into solid applications. info@yeti-media.com

Also check out our new Website. http://yeti-media.com 

Website Revamped.

Yeti-Media has been working hard to revamp our website. We added lots of new exciting information and links. We added a meet the staff section as well as new Yeti Pet. Meigo the yeti is on vacation so he sent us a new relative to stand in for him on the website. 

Feel free to pop over and check it out. We are also currently accepting new clients looking for web or mobile applications to be built. The sky is the limit on what we can help you create. Head over to http://yeti-media.com and if your interested in our services from our custom app shop feel free to email us at info@yeti-media.com .

Hope you are having a wonderful day.