Setting up Ubuntu Server as Virtual Machine in VMware
Install Ubuntu Server
- Download an image from this site
- Select
File > New…
to and follow the instructions, choose the.iso
file you downloaded as image file - Deselect "Simple installation" – you want to configure your system yourself
- Start the new virtual machine and follow the instructions
Install VMware Tools
- Choose
Virtual Machine > Install VMware Tools
from the VMware menu, then:
^
# install required packages
sudo apt-get install build-essential psmisc
# m...
Using QEMU to quickly test an ISO or bootable USB drive
When you want to quickly boot from a drive or image in a virtual machine you do not need to setup up a VirtualBox machine. Often QEMU does the job well enough.
Install it:
sudo apt-get install qemu
To boot an ISO:
qemu-system-x86_64 -cdrom filename.iso
If you prepared a USB pen drive and want to test it, run it like this (/dev/sdx
being your device name; you may need to sudo
to access it):
qemu-system-x86_64 -hda /dev/sdx
Be aware that not everything runs smoothly in QEMU -- you might need to set up a _VirtualBox...
Vector Magic: Precision Bitmap To Vector Conversion Online
Automatically convert bitmap images like JPEGs, GIFs and PNGs to the crisp, clean, scalable vector art of EPS, SVG, and PDF with the world's best auto-tracing software.
Print-Friendly Images and Logos with CSS
The trick is this: send a low-resolution version of your image to the screen, and a high-resolution version to the printer.
Installing RMagick on Ubuntu
When installing RMagick you may get an error messages like this:
Version 2.13.1:
checking for Ruby version >= 1.8.5... yes
checking for gcc... yes
checking for Magick-config... no
Can't install RMagick 2.13.1. Can't find Magick-config in /home/arne/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/var/lib/gems/1.8/bin
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of
necessary libraries and/or headers. Check the mkmf.log file for more
d...
Opera: How to use outlining for better layout debugging
I prefer using Opera's "User mode" to toggle an outlining of HTML elements quickly. This helps greatly when you want to see the actual dimensions of elements, e.g. for floating elements inside containers, instead of opening up the Dragonfly inspector every time.
Navigate to View → Style → "Manage Modes..." and tick the checkboxes like in the attached image. Then, switch to the User Mode by pressing the shortcut (Shift+G for the 9.2-compatible layout or for the default layout with enabled "single-key shortcuts") and select "Outline" from...
Liquid Canvas
Liquid Canvas is a JavaScript library which allows you to draw inside an HTML canvas element with an easy yet powerful description language.
It can be used to add graphics to your web page without ever touching an image creation tool such as The Gimp, Inkscape or Photoshop.
Check out the Demo and the basic example and then download version 0.3.
Onload callback for dynamically loaded images
Sometimes you need to dynamically load an image and do something as soon as its loaded (when for example its size is already available).
With jQuery, this seems to work across browsers:
$('<img>')
.attr('src', '')
.load(function() {
alert('fully loaded!');
})
.attr('src', '/the/real/image/url');
Customize your Bash prompt
The shell variable PS1
holds your bash prompt. You might want to change it to serve your needs best. Here is how to:
General
- non-printing escape sequences in your prompt have to be inclosed in
\[\e[
and\]
so your shell can correctly count its prompt's length - we recommend to highlight your prompt on production machines
- you can also [show different root prompts for each user](https://makandracards.com/makandra/9569-get-the-username-w...
Paperclip: Image resize options
Paperclip uses the imagemagick resize options like 100x50>
, 100x50<
, 100x50#
etc to resize images.
See the link what options are available.
- ('!') Ignore Aspect Ratio
- ('>') Only Shrink Larger
- ('<') Only Enlarge Smaller
- ('^') Fill Given Area
- ('%') Percentage Resize
- ('@') Pixel Area Limit
- ('#') Crop thumbnail centrally and ensure the requested dimensions, not documented at imagemagick doc
Linux: rename or change extension of multiple files
When you need to bulk rename files you can not call "mv *.foo *.bar
" to change the extension of all .foo
files to bar
(because bash resolves wildcards and replaces them with the list of matched files).
This works on linuxes who use the Perl version of the rename
command (like Ubuntu):
rename 's/\.foo$/\.bar/' *
You can also use this to rename other parts of the file, e.g. from flag_en.png
, flag_de.png
etc. to just en.png
or de.png
:
rename 's/^flag_//' *
Note that we used $
and ^
to explicitly look at the ...
Speed up file downloads with Rails, Apache and X-Sendfile
When you use the send_file
method to send a local file to the browser, you can save resources on the application server by setting the :x_sendfile
option to true
. This option is activated by default for Rails 3, so you need to understand this.
What this option does is not to send any data at all, but rather set the local file path as a new response header:
X-Sendfile: /opt/www/awesome-project/shared/downloads/image.png
When the response comes back from Rails to...
Proper cross-browser CSS styling for buttons
Styling button tags across all major browsers is not easy.
Many times you should be fine by using the native button style a browser-OS-combination offers you. But if you are trying to style buttons with images (e.g. by nesting a span
tag inside them as assigning a background to both button
and span
) it will look different on each browser.
Use this Sass snippet as a base style:
button
border: 0
padding: 0
cursor: pointer
overflow: visible // removes padding in IE
&::-moz-focu...
Generate a strong secret from the shell
A good tool to generate strong passwords and secrets is "apg". You can get it with
sudo apt-get install apg
To create a strong secret for sessions, hashed Paperclip paths, etc. say
apg -m128 -a1 -E\'\"
Arguments explained:
- The
-m
parameter defines the secret length -
-a1
makes apg choose from all 7-bit ASCII characters instead of just the alphabet -
-E\'\"
excludes quote characters so you can easily paste the secret into a Ru...
Install the Paperclip gem on Ubuntu servers
You need to install the following packages before you can build the Paperclip gem:
sudo apt-get install imagemagick librmagick-ruby
Copying validation errors from one attribute to another
When using virtual attributes, the attached trait can be useful to automatically copy errors from one attribute to another.
Here is a typical use case where Paperclip creates a virtual attribute :attachment
, but there are validations on both :attachment
and :attachment_file_name
. If the form has a file picker on :attachment
, you would like to highlight it with errors from any attribute:
class Note < ActiveRecord::Base
has_attached_file :attachment
validates_attachment_presence :a...
Deliver Paperclip attachments to authorized users only
When Paperclip attachments should only be downloadable for selected users, there are three ways to go.
The same applies to files in Carrierwave.
- Deliver attachments through Rails
The first way is to store Paperclip attachments not in the default public/system
, but in a private path like storage
inside the current release. You should prefer this method when dealing with sensitive data.
Make ...
JQuery CSS Emoticons Plugin
The CSS Emoticons plugin is a simple jQuery plugin (and stylesheet) that allows you to turn any text emoticons on the page into cute little smiling faces with pure CSS3 styling (no images whatsoever).
Use the new Google Images as a German user
In july Google announced a new version of their image serach tool Google Images. But you won't find it on the German google.de site. To reach the new - as I may say, very much better - tool from germany, you have to surf to images.google.com. Et voilà!
jQuery Captify (v1.1.3) / Simple Animated Image Captions
Captify is a plugin for jQuery written by Brian Reavis (@brianreavis) to display simple, pretty image captions that appear on rollover
Make box shadows look the same in IE and other browsers
The box shadows created rendered in IE by CSS3PIE look darker and are blurred differently than in browsers that render box-shadow
natively.
If possible, try to be OK with this. If not, make an IE-only stylesheet that uses a different color and blur radius:
// Real browsers:
+box_shadow("0 4px 10px #bbb")
// IE with PIE:
+box_shadow("0 5px 15px #888")
We should try to package this solution in a neat way so we don't need different stylesheets.
See also this [cross-browser box-shadow comparison]...
Recursively remove unnecessary executable-flags
Sometimes files attain executable-flags that they do not need, e.g. when your Windows VM copies them over a Samba share onto your machine.
From inside your Rails project directory call regularly:
geordi remove-executable-flags
Runs chmod -x
on Ruby, HTML, CSS, image, Rake and similar files.
This script is part of our geordi gem on github.
Setting expiry dates for images, JavaScript and CSS
When deploying Rails applications you might have noticed that JS and CSS are not cached by all browsers.
In order to force Apache to add expiry dates to its response, add the attached .htaccess
to the public directory. This will add a header such as Expires: Thu, 07 Oct 2010 07:21:45 GMT
to the httpd response.
Configuring Apache
Check that you have mod_expires
enabled. You need it for the attached .htaccess
to work:
sudo a2enmod expires
Configuring Nginx
You can add this:
Vadikom » Poshy Tip - jQuery Plugin for Stylish Tooltips
With this plugin, you can create a scalable tooltip by just using a single background image for the tooltip body.