oslego

# SSL self signed localhost for rails start to finish, no red warnings. 

# 1) Create your private key (any password will do, we remove it below)

$ openssl genrsa -des3 -out server.orig.key 2048


# 2) Remove the password

$ openssl rsa -in server.orig.key -out server.key

oslego

// addEventListener wrapper
// returns function for auto-unbinding
function on(elem, type, fn) {
    elem.addEventListener(type, fn, false);
    return function () {
        off(elem, type, fn);
    };
}

// removeEventListener wrapper

oslego

<script type="text/javascript">
    (function () {
      "use strict";
      // once cached, the css file is stored on the client forever unless
      // the URL below is changed. Any change will invalidate the cache
      var css_href = './index_files/web-fonts.css';
      // a simple event handler wrapper
      function on(el, ev, callback) {
        if (el.addEventListener) {
          el.addEventListener(ev, callback, false);

oslego

/*
  Mock-implementation of chrome.runtime messaging API
*/
var Messager = (function (){
    var _listeners = [];

    return {
      onMessage: {
        addListener: function(cb){
          _listeners.push(cb);

oslego

  function get(url){
    return new Promise(function(resolve, reject){

      // request strategies: ajax, jsonp
      var types = ['json', 'jsonp'];

      function call(){

        // try data type strategies one-by-one; mutates the array
        var type = types.shift();

oslego

/*
  Takes a CSS property name string and returns its DOM notation.

  @example: shape-inside -> shapeInside
  @example: -webkit-shape-inside -> webkitShapeInside

  @param {String} str CSS property name, possibly hyphenated.
  @return {String}
*/
function getDOMCSSProperty(str){

oslego

JavaScript library to help working with CSS Regions. Handles prefixes internally.

API

flow = Flow('flow-name') Get the NamedFlow by name.

flow.fitWith('<div class="region">') Make the flow fit by adding elements to the region chain

oslego

//
// returns a list of all elements under the cursor
//
function elementsFromPoint(x,y) {
	var elements = [], previousPointerEvents = [], current, i, d;

        // get all elements via elementFromPoint, and remove them from hit-testing in order
	while ((current = document.elementFromPoint(x,y)) && elements.indexOf(current)===-1 && current != null) {
          
            // push the element and its current style

oslego

[Draft] Working with CSS Regions, Good Practices

CSS Regions are now enabled by default in a widely used browser - Safari on iOS 7. This makes it easier for developers to experiment and use the feature in their projects.

Perhaps this is a good time to share some of the lessons we learned at Adobe while using CSS Regions in demos. Take this article as a recommendation of good practices, not by any means a comprehensive list. CSS Regions is still an evolving feature.

Use columns sensibly

oslego

  (function(){
    // feather-weight Modernizr-like CSS feature check
    ['shape-inside','flow-into','shiny-new-feature'].forEach(function(property){
      
      // check if any variant exists, prefixed or not
      var isCapable = ['-webkit-','-ms-','-moz-',''].some(function(prefix){
        return prefix + property in document.body.style 
      })
      
      property = isCapable ? property : 'no-' + property;