Sunday, April 6, 2014

Image upload preview using my JQuery Upload Plugin

Adding a simple image preview during the upload process can be easily done by doing some tweaking to my Upload Plugin demos.

Here is the modified demo:

The magic happens on onNewFile(id, file); our new file callback recives an HTML5 File object as parameter which can be used with the FileReader to accomplish our goal.

The code is very self explanatory:

    onNewFile: function(id, file){

      // Checks if this feature if availabe to the user
      if (typeof FileReader !== "undefined"){
        var reader = new FileReader();

        // Our <img> object
        var img = $('your-image-dom-object');

        reader.onload = function (e) {



Modern browsers like Chrome/Firefox or IE10 support this feature; which is enough since those are also my uploader plugin requirements.

Saturday, March 29, 2014

Ruby on Rails in Fedora 20

So this post is gonna be a short one; and as i said before there is several ways to install RoR.
The important thing is: do not mix up things; and by mix up i mean trying to use packages already built by your distro like rubygems and then installing the gems on the userspace; while that may work on some cases it may also lead into weird issues.

For beginners installing Rails on Fedora 20 is simple as doing:
$ sudo yum install ruby rubygems rubygem-rails

That way you have all you need to get things going; also you can look up for other gems on the repositories by the name rubygem-*.

And the mandatory hello world app:
$ rails new hello-world
.... have some patient here...
$ cd hello-world
$ rails server
Open: http://localhost:3000

As you get more involved into rails you may want to try to set up your dev enviroment with other tools like RVM. (I wrote a post about this long time ago; but it's kinda outdated and may be a nice idea for a future post)

Some nice resources about Rails and Ruby in general:

Sunday, February 9, 2014

Using the Symfony OptionsResolver interface with Custom Forms

My beloved Symfony changed a lot since last time we seen. Now when trying to update some projects to 2.4 many things broke including my hearth. But after the initial annoyance of any migration i realize some things were better, even new. This is the case of the new OptionsResolver component.
This is used by several components, but the one i liked was when we apply it to custom Form classes.
See, back in time if we wanted to pass some parameters to our Form class we had to use the native PHP constructors, do some fancy stuff.... include some checks and your initial simple class became a big mess.

So this is a new approach you could try:

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;

class GalleryEditor extends AbstractType
  public function buildForm(FormBuilderInterface $builder, array $options)
    // Access your options here using something like: $options['db']

  public function setDefaultOptions(OptionsResolverInterface $resolver)
    // I think function names are self-explanatory here
         'db' => 'Doctrine\DBAL\Connection'
    // Other ones you could use are:
    // - setOptional
    // - setDefaults


For much I hate code-snippet posts i really liked this one.... also to not let my blog die for another 6 months (again)

Thursday, December 12, 2013

Theming an Android Listview with the jQuery Mobile styles

As i get used to work with more mobile applications(call it HTML or native apps) one thing you realize about them is the difference in performance between both (especially once your app start growing); as an Android user i see that a lot.

But that's not the point of this post and to put things on prospective even if i don't have much experience with Java i consider that I know enough to jump into the droid world without much issue.

In my opinion the key part to be successful at this is to fully understand the flow of an app and be GOOD as a UI designer rather than just know how to work with arrays in Java.

To help me with that I started this little page (or call it project if you want) to try  to reproduce some of the jQuery Mobile widgets on an android native project.
(Because that's what i like the most from JQM..... their dark theme :)

Enjoy it and hopefully someone can find it useful :)

Link to GitHub Project

Note: Obviously for now it only contains some basic stuff, but keep an eye on it, even if i don't update anything here as long as I don't get distracted by some random new technology (as many times) i will be working on it.

Friday, November 1, 2013

jQuery Ajax File uploader with progress bar and drag and drop

Normally when i start one of those projects(own) that i always end up leaving behind due to unknown reasons.... some things in the middle may turn interesting.
Well this little JavaScript project is one of those things that took over the initial thing for the past few days.

Basically is a jQuery plugin for Ajax file uploading, including drag & drop and some upload progress bar action. Some of the stuff i found online didn't had all this features and/or mess up A LOT with markup making customization even harder than doing the whole thing from scratch.
The plugin provides a series of callbacks for pretty much everything so the developer can fully customize the UI from there.
Look at the online demos to get a better feeling of it:
  1.  (good lookng BootstrapCSS theme'd).
  2. (plain HTML/CSS)
Update: Added another demo where I explain how to add a Image Preview during the upload proccess. Check it out:

Testing is NEEDED!, but it should work on the latest(and not that recent) versions of Chrome/Firefox/Safari and IE10. For the rest a fallback mode(callback) is provided and the developer can do wherever they want from there.

Check the Project Page and Source Code. And feel free to contact me via email or using the Github Issues tracker, for any comments or suggestions on it.

Monday, February 11, 2013

Getting VMware player to work on Fedora 17/18 (Updated)

 When i wrote this post i was using F17 and 3.7ish~ kernels. By the time i switched to F18 (and 3.8 kernels) another issue came up saying it wasn't possible to rebuild the VMCI module. Fortunately there is a way to fix it, not easy as the one i commented before but still. First you need to run our previous bug fix:

cp -rp /usr/src/kernels/$(uname -r)/include/generated/uapi/linux/version.h /usr/src/kernels/$(uname -r)/include/linux/

Now basically you need to patch your player sources:
  • cd /usr/lib/vmware/modules/source
  • May want to backup the vmci.tar file just in case
  • tar -xf vmci.tar
  • cd vmci-only
  • Download the patch
  • patch -p1 < 'filenameujustdownloaded.diff'
  • cd ..
  • tar -cf vmci.tar vmci-only/
  • vmware-modconfig --console --install-all
  • rm -rf vmci-only/
After all that your Player should be ready to run, good luck :)

After update my Fedora 17 desktop to the newest kernel (by this time) i realized my VMWare player was broken.

If you been a VMPlayer user for a while you may noted that every time the kernel is updated our player re-compiles his own modules.
The issue with this particular version is a missing version.h on the sources files. Fortunately this file can be found on one of the internal folders and can be copied over to fix this issue:
cp -rp /usr/src/kernels/$(uname -r)/include/generated/uapi/linux/version.h /usr/src/kernels/$(uname -r)/include/linux/

ps: remember that you probably have more than one kernel version after the update, if you don't want to use this fix just reboot your computer and pick the previous one.

Sunday, February 3, 2013

How to install Node.js in Fedora 17

Update: NodeJS is now part of Fedora as a stable package; so all you need to do to install it is:
$ yum install nodejs
Node currently is begin added/implemented on Fedora 18 and will be part of Fedora 19. If you want to try it out this may work for you:
sudo yum --enablerepo=updates-testing install nodejs
Besides that, I'm the kind of guy who doesn't like to get involved with experimental stuff or mess with my os regular install (and i currently have F17 on my notebook and work pc), so this is what i did:

First make sure you have a few devel packages that you'll need:

$ sudo yum install openssl-devel.i686 gcc gcc-c++

Download the source files (you can get the lastest version link from Node's homepage)

$ wget

Once it finish, zunip and compile it (it may take a while depending on your computer)
$ tar zxvf node-v0.8.18.tar.gz
$ cd node-v0.8.18
$ ./configure
$ make
$ sudo make install

After that you can start using node!:

$ node -v