Chrome Extensions

Some random notes on Chrome Extensions:

A Browser Action appears as some added icon that e.g. opens some popup.html when clicked.

How to debug (e.g. where to see the console.log messages) each script:

  • Background script: In chrome://extensions/, there’s a link to “inspect views” or access the background page.
  • Content script: The active tab’s main console
  • popup.js: Right-click icon (or the popup.html) and click inspect element

Example permissions:

  • “activeTab”: to use chrome.tab.executeScript()
  • “contextMenus”: to do stuff with context menus
  • DB or something for the Chrome Extension is stored here:

    C:\Users\\AppData\Local\Google\Chrome\User Data\Default\Extensions\theextensionidsomestring
    When I removed an extension (from chrome://extensions/, it also deleted its theextensionidsomestring folder from there.

    Input type=number

    <input type="number" step="any"/> Will allow any decimal point. If the current value of the input is “123.456”, for example, then clicking the UP arrow will increase it to “124.456”. Without the ‘step=”any”‘, it would’ve increased to “124”. Note: The ‘step’ attribute, together with ‘min’ and ‘max’, control which values are considered valid.

    jQuery Cheatsheet

    Traversal

    $('p').find('span') Finds all span elements that are descendants of some ‘p’ elements (not necessarily immediate children). Compare to .children(), that travels only a single level down the DOM tree.
    $('p').find('span')
    or: $('span', $('p'))
    Finds all span elements that are descendants of some ‘p’ elements (not necessarily immediate children). Compare to .children(), that travels only a single level down the DOM tree.

    Manipulation

    $(this).data('k',123) Use $(this).data('k') to get the associated value (123 in this case), $(this).data() to get all the key-value map, and $(this).removeData('k') to remove a data entry.
    $('<div/>',{'class':'c1 c2'}) As of jQuery 1.4, this creates an element on the fly with specified attributes, e.g. <div class="c1 c2"></div> in this case. Note: Usually you’d like to append() or appendTo() this new element. But if you want its string representation, use the element.outerHTML attribute, i.e. $(...)[0].outerHTML.

    Social Apps, OAuth

    Google

    To revoke access of a Google App:
    https://accounts.google.com/IssuedAuthSubTokens,
    or https://plus.google.com/apps if you have a Google+ profile.

    For OAuth purposes:
    – To create an App: https://cloud.google.com/console/.
    – Use Client ID (e.g. 123456789012.apps.googleusercontent.com) and Client secret (e.g. FAft3aUW3sdtM1E28XXMimQw).
    – Make sure you configure both the “Authorized Javascript origins” as well as the “Authorized redirect URI” fields.

    Facebook

    To revoke access of a Facebook App:
    https://www.facebook.com/settings?tab=applications (Settings -> Apps).

    For OAuth purposes:
    – To create an App: developers.facebook.com.
    – Use App ID and App Secret.
    – Make sure you configure the “App Domains”, and add a “Platform”, namely “Website”, where you also configure the “Site URL” cialis 20mg tadalafil.

    LinkedIn

    For OAuth purposes:
    – To create an App: https://www.linkedin.com/secure/developer.

    Laravel Cheatsheet

    Some useful Laravel 4 commands below.

    Config

    In app/config/ there are various files (objects) like ‘app’, ‘auth’, ‘database’, and more. Configure them as you like. You can use Config::get($key) to access some configuration in real-time, e.g.Config::get('app.debug').

    Redirect

    Redirect::to('') or Redirect::to('/') Redirects to /public/
    Redirect::route('someName') Redirects using a Named Route.

    Named Routes

    Route::get('user/profile', array('as' => 'profile', function() { ... })) or Route::get('user/profile', array('as' => 'profile', 'uses' => 'UserController@showProfile')); Associates the “user/profile” route with some function (or Controller method), and creates a Named Route to “user/profile” (so now when you’ll call Redirect::route('profile'); you’ll redirect to “user/profile”.

    Laravel Blank Page / White Screen

    Did you also get an annoying blank page / white screen after your first installation of Laravel? Here are a few troubleshooting directions that may help:

    • Permissions: folders within app/storage require write access by the web server! Make sure you chmod everything appropriately!
      • Note for beginners: If you’re using Apache, the user used by the web server may be “www-data” or “root” by default. You can find the User directive usually in the /etc/apache/apache2.conf file, usually with something like User ${APACHE_RUN_USER} (the environment variable APACHE_RUN_USER is set in /etc/apache2/envvars.
    • Note that Apache 2.2 and 2.4 differ in some Rewrite-related commands. Might be relevant for you, if you’re struggling with some rewrites.
    • Ubuntu users, make sure you sudo apt-get install php5-mcrypt (and then sudo service apache2 restart)
    • In the routes.php file, try a really simple route before going into View rendering etc., for example: Route::get('/', function() { echo 'HERE! (delete me!)'; return 'Returning a simple string without any View rendering.'; }

    Still stuck? Leave a comment and we’ll do our best to debug your problem. But it seems like the reasons above solve most of the cases.

    Play! Framework, quick tip to overcome weird Eclipse errors

    Quick tip to those working with Play! Framework in Eclipse (the following tip worked for Play! version 2.1.1 on Eclipse Helios SR2, but may very well apply for other versions). Sometimes Eclipse will complain about the index.render function, for example, claiming it cannot be resolved or the signature is incompatible, or whatever. While the overall project might not contain errors, the file in question will annoyingly enough display some errors (not warnings! errors!) that will try to drive you crazy. There might also be sudden problems in the build path of the project. Possible solutions that worked for me:
    1. Make sure you have the up-to-date Scale IDE installed (“Help -> Install New Software…” or “Help -> Check for Updates”). See also ScalaIDE’s Getting Started guide.
    2. Run play clean compile again from the console on the same project.
    3. Using “Project -> Clean…” didn’t really work. Instead, “Project -> Close Project” followed by “Project -> Open Project” did get rid of those annoying errors.

    Bugs in Play! Framework version 2.1.1 Tutorial, Fixtures

    In http://www.playframework.com/documentation/2.1.1/JavaGuide2, when working with Fixtures, the link to download the test-data.yml is broken. Instead, you should use the initial-data.yml file from the zentasks/ example, rename it, and load it (for example in the JUnit test method) using the following code:
    Map<String,List<Object>> all = (Map<String,List<Object>>)Yaml.load("test-data.yml");
    // Insert users first
    Ebean.save(all.get("users"));
    // Insert projects
    Ebean.save(all.get("projects"));
    for(Object project: all.get("projects")) {
      // Insert the project/user relation
      Ebean.saveManyToManyAssociations(project, "members");
    }
    // Insert tasks
    Ebean.save(all.get("tasks"));
    
    (Just to be clear: The latter is as opposed to the documentation, which suggests that you should load it using Ebean.save((List) Yaml.load("test-data.yml"));. But the documentation is wrong here, as the Yaml.load() returns a LinkedHashMap that cannot be cast into List.) Finally, if you want the tests to work with that .yml file we just borrowed from the zentasks/ example, you should either modify the tests themselves, or — well — modify the .yml file. For all you lazy guys out there looking for a complete test-data.yml file to simply copy and paste, there you go. Enjoy:
    
    # Users
    
    users:
    
        - !!models.User
            email:      bob@example.com
            name:       Guillaume Bort
            password:   secret
        
        - !!models.User
            email:      jane@example.com
            name:       Maxime Dantec
            password:   secret
        
        - !!models.User
            email:      jeff@example.com
            name:       Sadek Drobi
            password:   secret
        
    # Projects
    
    projects:
    
        - !!models.Project
            id:         1
            name:       Play 2.0   
            folder:     Play framework
            members:
                - !!models.User
                    email: bob@example.com
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
    
        - !!models.Project
            id:         2
            name:       Play 1.2.4
            folder:     Play framework
            members:
                - !!models.User
                    email: bob@example.com
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
                    
        - !!models.Project
            id:         3
            name:       Website 
            folder:     Play framework
            members:
                - !!models.User
                    email: bob@example.com
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
    
        - !!models.Project
            id:         4
            name:       Secret project 
            folder:     Zenexity
            members:
                - !!models.User
                    email: bob@example.com
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
                    
        - !!models.Project
            id:         5
            name:       Playmate
            folder:     Zenexity
            members:
                - !!models.User
                    email: bob@example.com
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
                
        - !!models.Project
            id:         6
            name:       Things to do
            folder:     Personal
            members:
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
    
        - !!models.Project
            id:         7
            name:       Play samples
            folder:     Zenexity
            members:
                - !!models.User
                    email: jane@example.com
                - !!models.User
                    email: jeff@example.com
                    
                    
    # Task
    
    tasks:
        
        - !!models.Task
            title:      Fix the documentation
            done:       false
            folder:     Todo
            project:    !!models.Project
                            id: 1
            assignedTo: !!models.User
                            email: bob@example.com
                            
        - !!models.Task
            title:      Prepare the beta release
            done:       false
            folder:     Urgent
            dueDate:    2011-11-15
            project:    !!models.Project
                            id: 1
            assignedTo: !!models.User
                            email: bob@example.com
    
        - !!models.Task
            title:      Buy some milk
            done:       false
            folder:     Todo
            project:    !!models.Project
                            id: 3
    
        - !!models.Task
            title:      Check 1.2.4-RC2
            done:       false
            folder:     Todo
            dueDate:    2011-11-18
            project:    !!models.Project
                            id: 2
            assignedTo: !!models.User
                            email: bob@example.com
                            
        - !!models.Task
            title:      Finish zentask integration
            done:       true
            folder:     Todo
            dueDate:    2011-11-15
            project:    !!models.Project
                            id: 7
            assignedTo: !!models.User
                            email: bob@example.com