releaf-core 0.2.1

data/app/assets/javascripts/releaf/include/url_builder.js

@@ -0,0 +1,193 @@
+// constructor
+function UrlBuilder( params )
+{
+	if( params === undefined )
+	{
+		params = {};
+	}
+	var keepCurrentQuery = true;
+	if( params === false || params.baseUrl !== undefined )
+	{
+		keepCurrentQuery = false;
+	}
+	if( typeof params === 'string' )
+	{
+		params = { baseUrl: params };
+	}
+	// setup members
+	this.path = '';
+	this.query = {};
+	// get url
+	var baseUrl = params.baseUrl || location.href;
+	// remove anchor
+	baseUrl = baseUrl.split( '#' ).shift();
+	// split url
+	var urlParts = baseUrl.split( '?' );
+	this.path = urlParts.shift();
+	if( keepCurrentQuery && urlParts.length > 0 )
+	{
+		var queryParts = urlParts.shift().split( '&' );
+		for( var i = 0; i < queryParts.length; i++ )
+		{
+			if( queryParts[ i ].length > 0 )
+			{
+                var value;
+				var variable = queryParts[ i ].split( '=' );
+				var name = variable.shift();
+
+				if( variable.length > 0 )
+				{
+					value = decodeURIComponent( variable.shift() );
+				}
+				else
+				{
+					value = '';
+				}
+
+				if( decodeURIComponent( name ).substr( decodeURIComponent( name ).length - 2, 2 ) === '[]' )
+				{
+					name = decodeURIComponent( name );
+				}
+
+				if( name.substr( name.length - 2, 2 ) === '[]' )
+				{
+					name = name.substr( 0, name.length - 2 );
+					if( this.query[ name ] === undefined || !(this.query[ name ] instanceof Array) )
+					{
+						this.query[ name ] = [];
+					}
+					this.query[ name ].push( value );
+				}
+				else
+				{
+					this.query[ name ] = value;
+				}
+			}
+		}
+	}
+	if( params.keep !== undefined && params.keep instanceof Array )
+	{
+		var filteredQuery = {};
+		for( var a = 0; a < params.keep.length; a++ )
+		{
+			if( this.query[ params.keep[a] ] !== undefined )
+			{
+				filteredQuery[ params.keep[a] ] = this.query[ params.keep[a] ];
+			}
+		}
+		this.query = filteredQuery;
+	}
+}
+
+UrlBuilder.prototype.add = function( params, value )
+{
+	if( params instanceof Array )
+	{
+		for( var i = 0; i < params.length; i++ )
+		{
+			if( params[ i ].name !== undefined && params[ i ].value !== undefined )
+			{
+				var name = params[ i ].name;
+				if( name.substr( name.length - 2, 2 ) === '[]' )
+				{
+					name = name.substr( 0, name.length - 2 );
+					if( this.query[ name ] === undefined || !(this.query[ name ] instanceof Array) )
+					{
+						this.query[ name ] = [];
+					}
+					this.query[ name ].push( params[ i ].value );
+				}
+				else
+				{
+					this.query[ params[ i ].name ] = params[ i ].value;
+				}
+			}
+		}
+	}
+	else if( params instanceof Object )
+	{
+		for( var a in params )
+		{
+            if (params.hasOwnProperty(a))
+            {
+                this.query[ a ] = params[ a ];
+            }
+		}
+	}
+	else if( typeof params === 'string' )
+	{
+		if( value === undefined )
+		{
+			var temp = new UrlBuilder( '?' + params );
+			for( var b in temp.query )
+			{
+                if (temp.query.hasOwnProperty(b))
+                {
+                    this.query[ b ] = temp.query[b];
+                }
+			}
+		}
+		else
+		{
+			this.query[ params ] = value;
+		}
+	}
+	return this;
+};
+
+UrlBuilder.prototype.removeAll = function( preserveParams )
+{
+    for( var i in this.query )
+    {
+        if( preserveParams === undefined || jQuery.inArray(i, preserveParams) === -1 )
+        {
+            this.remove(i);
+        }
+    }
+	return this;
+};
+
+UrlBuilder.prototype.remove = function( name )
+{
+	delete this.query[ name ];
+	return this;
+};
+
+UrlBuilder.prototype.get = function( name )
+{
+	if( this.query[ name ] !== undefined )
+	{
+		return this.query[ name ];
+	}
+	return null;
+};
+
+UrlBuilder.prototype.getUrl = function()
+{
+	var query = '';
+	var isFirst = true;
+	for( var i in this.query )
+	{
+        if(this.query.hasOwnProperty(i))
+        {
+            if( !isFirst )
+            {
+                query += '&';
+            }
+            else
+            {
+                isFirst = false;
+            }
+            if( this.query[ i ] instanceof Array )
+            {
+                query += i + '[]=' + this.query[ i ].map(encodeURIComponent).join( '&' + i + '[]=' );
+            }
+            else
+            {
+                query += i + '=' + encodeURIComponent(this.query[ i ]);
+            }
+        }
+	}
+
+	return this.path + '?' + query;
+};

data/app/assets/stylesheets/releaf/application.scss

@@ -0,0 +1,9 @@
+//= require jquery-ui
+//= require font-awesome
+// :TODO: get rid of the icon font and use svg spritesheet
+
+
+// releaf path prefix is used so that any overrides in the project's folder
+// can be placed in stylesheets/releaf folder and not clash with other stylesheets of the project
+@import 'releaf/environment';  // import sass variables, functions and mixins
+@import 'releaf/layout';       // import releaf styling rules

data/app/assets/stylesheets/releaf/environment/extras.scss

@@ -0,0 +1,11 @@
+// this file is intentionally left empty
+// it is included as the last environment import
+// and is intended to be overriden in actual applications
+// when something needs to be added or changed in the SASS environment
+// e.g., color scheme
+
+// the override file should be placed in
+// app/assets/stylesheets/releaf/environment/extras.scss
+// and then it will be used instead of this one
+
+// rails cache will have to be cleared for the framework to detect this file

data/app/assets/stylesheets/releaf/environment/functions/units.scss

@@ -0,0 +1,12 @@
+@function steps($number)
+{
+    // grid step used everywhere for widths and heights
+
+    // this matches half of the default line-height of the page
+    @return (12px * $number);
+}
+
+@function create-rgba( $color, $opacity )
+{
+    @return rgba( red($color), green($color), blue($color), $opacity );
+}

data/app/assets/stylesheets/releaf/environment/functions.scss

@@ -0,0 +1 @@
+@import 'releaf/environment/functions/units';

data/app/assets/stylesheets/releaf/environment/mixins/blocks.scss

@@ -0,0 +1,133 @@
+@mixin clear-inside
+{
+    &:after
+    {
+       content: " ";
+       display: table;
+       clear: both;
+    }
+}
+
+@mixin unclear-inside
+{
+    &:after
+    {
+       content: none;
+       display: none;
+       clear: none;
+    }
+}
+
+@mixin block-list
+{
+    display: block;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+
+    & > li
+    {
+        display: block;
+        margin: 0;
+        padding: 0;
+    }
+
+    & > li:before
+    {
+        content: "";
+        display: none;
+    }
+
+}
+
+@mixin pop-up-menu
+{
+    // used for floating pop-up menus (toolboxes, localization menus etc)
+    @include block-list;
+    display: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 100;
+    text-align: left;
+
+    > ul
+    {
+        @include block-list;
+        position: relative;
+    }
+
+    button, a, .button
+    {
+        display: block;
+        white-space: nowrap;
+        width: 100%;
+        text-align: left;
+    }
+}
+
+
+@mixin full-screen-overlay
+{
+    // used for displaying a clickable closing layer over the whole page under a pop-up-menu
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 90;
+    display: none;
+}
+
+
+
+@mixin inverted( $background-color: $color-background-inverted-normal, $text-color: $color-text-inverted-lightest )
+{
+    background: $background-color;
+    color: $text-color;
+
+    .button,
+    .button.secondary
+    {
+        background-color: inherit;
+        color: $color-highlight-normal;
+
+        &:hover,
+        &:focus,
+        &:active
+        {
+            background-color: inherit;
+            color: $text-color;
+        }
+
+        &.danger
+        {
+            &:not(:hover):not(:focus):not(:active)
+            {
+                background-color: $background-color;
+                color: $color-alert;
+            }
+
+            &:hover,
+            &:focus,
+            &:active
+            {
+                background-color: $color-alert;
+            }
+        }
+    }
+
+}
+
+@mixin section-header
+{
+    @include inverted;
+
+    padding: steps(0.5) steps(2);
+    position: relative;
+}
+
+@mixin pop-up-shadow
+{
+    box-shadow: 1px 3px 5px 0px $color-shadow-normal;
+}

data/app/assets/stylesheets/releaf/environment/mixins/elements.scss

@@ -0,0 +1,64 @@
+@mixin clickable-element
+{
+    // resets native button/link styles
+    // and unifies outlines
+
+    cursor: pointer;
+    text-decoration: none;
+    background: transparent;
+    border: none;
+    padding: 0;
+    margin: 0;
+    box-shadow: none;
+    color: inherit;
+    font-size: inherit;
+
+    &:focus
+    {
+        outline-width: 1px;
+        outline-style: dotted;
+        outline-color: $color-highlight-normal;
+    }
+
+    &:active
+    {
+        outline: none;
+    }
+
+    &::-moz-focus-inner
+    {
+        border: 0;
+        padding: 0;
+    }
+
+}
+
+
+@mixin icon-small
+{
+    display: inline;
+    font-size:      10px;
+    line-height:    steps(2);
+}
+
+@mixin icon
+{
+    display: inline;
+    font-size:      14px;
+    line-height:    steps(2);
+}
+
+@mixin icon-large
+{
+    display: inline;
+    font-size:      18px;
+    line-height:    steps(2);
+}
+
+
+
+
+
+
+
+

data/app/assets/stylesheets/releaf/environment/mixins/text.scss

@@ -0,0 +1,61 @@
+@mixin reset-font
+{
+    font-family: inherit;
+    font-weight: normal;
+    font-size:   100%;
+    line-height: inherit;
+}
+
+@mixin body-font
+{
+    font-family: Arial, Helvetica, sans-serif;
+    font-weight: normal;
+}
+
+@mixin brand-font
+{
+    font-family: Roboto;
+    font-weight: normal;
+}
+
+
+
+
+// use pixels for font-sizes
+// there is no longer a real need for ems/rems
+
+// use px for line height, so that the line height remains fixed
+// when inherited by blocks with a different font-size
+
+@mixin font-size-smaller
+{
+    font-size:      11px;
+    line-height:    steps(2);
+}
+
+@mixin font-size-normal
+{
+    font-size:      13px;
+    line-height:    steps(2);
+}
+
+@mixin font-size-larger
+{
+    font-size:      14px;
+    line-height:    steps(2);
+}
+
+@mixin font-size-largest
+{
+    font-size:      20px;
+    line-height:    steps(2);
+}
+
+
+@mixin heading-text
+{
+    @include brand-font;
+    @include font-size-largest;
+}
+
+