Home  »  Solutions

Latest Solutions

See All Solutions

Every idea has problems, and every problem has a solutions.
These are solutions created while working on our ideas we thought we'd share.

See More Solutions

 

What I've Learned Recently

See All I've Learned

With every project and every day, you should learn something.
Here's what I've learned.

  • Find the Files/Folders Taking Up the Most Space in Unix

    If you’re logged into your server and trying to pin down what folders are taking up the most space on your hard drive, there are simple commands to compile an organized list.

    First, to see the disk space usage of your drives and partition, run:

    df

    This will output a list of all drives/partitions on your system, the size, usage and percent used.

    If you’d like to see all of the folders in a particular directory sorted by their filesize use the du command.

    du -ks ./* | sort -n

    Tags: ,
  • Quick Way to Help Optimize Mysql Databases

    The Analyse procedure built into MySql can give you a wealth of information about your database tables, making it easy to find tables that can be tightened up.

    If you query:

    SELECT * FROM table_name PROCEDURE ANALYSE()

    You’ll get a result back with the minimum/maximum value, minimum/maximum length, number of empty or zero strings, number of nulls, the average value/length, the standard deviation, and a suggested optimal fieldtype for every row in the table.

    Should be noted this isn’t very helpful unless you have active tables with a fair amount of data in them already.


    Tags: ,
  • Layer XUL Elements/Images/Backgrounds in Firefox 3 Extensions Using Stack

    While working on the Read It Later Firefox Extension, I wanted a way to layer multiple background images on a toolbar button so I could create a nice looking notification indicator like on the iPhone. (Note I opt-ed later to use a simpler look, but this method might still be helpful for other applications).

    In order to make this work you’ll need to familarize yourself with XBL and XUL Stacks.  XBL allows you to essentially reconfigure how an XUL element works/looks.

    In this case, we’ll use XBL to replace a normal ToolbarButton into a Stack Element.

    So first you’ll need your toolbarbutton added to your XUL overlay:

    <toolbarbutton id=”tButton” type=”menu-button” />

    Next we need to create the XBL Binding (complete the tutorial linked about XBL if you don’t know what XBL is):

    <?xml version="1.0" encoding="UTF-8"?>
    
    <bindings xmlns="http://www.mozilla.org/xbl"
     xmlns:xbl="http://www.mozilla.org/xbl"
     xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
    
    <binding id="toolbarbutton"
     display="xul:menu"
     extends="chrome://global/content/bindings/button.xml#menu-button-base">
    
    <resources>
      <stylesheet src="chrome://global/skin/toolbarbutton.css" />
    </resources>
    
    <content>
      <xul:toolbarbutton
       class="buttonstack"
       anonid="button"
       flex="1"
       allowevents="true"
       xbl:inherits="disabled,crop,image,label,accesskey,command,align,
       dir,pack,orient,toolbarmode,buttonstyle,status,notifyNumber" />
      </content>
    </binding>
    
    <binding id="buttonstack">
      <content>
        <children>
          <xul:stack
           align="center"
           pack="center"
           xbl:inherits="allowevents">
    
          <xul:image src="chrome://urextension/skin/buttonimage.png" />
    
          <xul:image src="chrome://urextension/skin/number_circle.png" />
    
          <xul:label value="" xbl:inherits="value=notifyNumber,allowevents" />
    
          </xul:stack>
        </children>
      </content>
    </binding>
    
    </bindings>

    What we have here is 3 layers.  The first is the main button icon (for example with the iphone button it’d be the rounded blue envelope button.  The second is the image that’s behind the number (for example the red circle on the iphone button). And the last layer is the actual number you are using to show the notication of (in the iPhone’s case, it’s 3).

    You will need to apply left/top attributes to the second and third layers to position the numbered circle where you’d like it.  Follow the Stack tutorial (linked above) for more information about positioning the elements inside of a stack.

    To change the number in the notification, simply change the attribute ‘notifyNumber’ on your toolbar button.

    document.getElementById(’tButton’).setAttribute(’notifyNumber’, 3);

    If you look at the XBL code, make note of where ‘notifyNumber’ is inherited.  This is how XBL knows to send the attribute down the chain.  You can make the attribute anything or add other attributes as well.

    Finally, you need to apply the bindings to your toolbar button. In your stylesheet add the following lines:

    #tButton {
    -moz-binding: url("chrome://urextension/content/yourxblfile.xml#toolbarbutton");
    }
    .buttonstack {
    -moz-binding: url("chrome://urextension/content/yourxblfile.xml#buttonstack");
    }

    Tags: , , ,
  • Replace Standard Menupop in XUL

    I came across a time I needed to open a different element then a standard popup menu when clicking the dropdown selector on a toolbar button. I wanted to open a panel instead. To open a different element and hide the popup you can do something similar to this:

    <toolbarbutton type=”menu-button”>
    <menupopup onpopupshowing=”OpenOtherFunction();event.stopPropagation();return false;” />
    </toolbarbutton>

    Update: You can do this much more efficiently using XBL Bindings.  I highly recommend reading up on them.

    Where I learned it: While working on the Read It Later Firefox Extension


    Tags: , , ,
  • How To Disable ‘will not be installed because it does not provide secure updates’ Warning in Firefox 3

    By default, Firefox 3 prevents users from installing any extensions that do not offer a secure connection for automatic updates.  This prevents users from being victims of hijacked update URLs.

    But for developers or people installing extensions they know they can trust, it is a pain.

    Luckily it is easily disabled by:

    1. Enter ‘about:config’ into address bar, hit go
    2. Right click somewhere in the list of keys below.  Select New->Boolean
    3. Enter ‘  extensions.checkUpdateSecurity ‘ as the name
    4. Select false as the value
    5. Reattempt installation of your plugin.

    Ran into this problem when installing Extension Developer’s Extension while working on Read It Later.

    Found the solution at MozillaZine (via Google)


    Tags:
  • Flash Sees Text Inside <b> Tag as Seperate Font and Must Be Embedded

    In flash, if text inside html tags like <b> or <i> is not appearing in your dynamic textfields, you need to embed the stylized font. Flash/Actionscript sees the text inside as a seperate font and therefore it also needs to be embedded.

    For example, if you have a dynamic textfield with Arial. If you add a bold tag (<b>) around text inside the field, you will need to additionally embed Arial with bold turned on into your flash document.

    I ran into this while working on flash graphs for Tail Report.

    I found the answer in the Los Angeles Flash Users Group (via Google)


    Tags: , ,
  • When Dynamically Generating CSV, Don’t Forget the Quotes

    I was generating CSV files with PHP so that a client could easily export their mailing list from the database when I hit a snag with loading the generated files on a Mac.

    I received the error message:

    “SYLK: file format is not valid.” when opening the file in Excel on OS X.

    To solve the problem, simply make sure all data is enclosed with quotes.

    Ex: ‘ID’,'First Name’, ‘Last Name’

    Found this on Microsoft’s website: http://support.microsoft.com/kb/323626


    Tags: , ,
  • Get Rid of Those Dotted Lines Around Links in Firefox

    I just always assumed that these were a fact of life with Firefox.

    They are meant to give an idea to the user where their focus is if they are using the keyboard to get around the page. But when you use text-indent to do image swaps for navigation elements the dotted lines shoot off into infinity on the left side of your screen.

    Found an easy solution from Nathan Smith via Google:

    a:active {
    
     outline: none;
    
    }

    Check out his article for more information on how best to remove Firefox dotted links.


    Tags: , ,


See More of What I've Learned