rad_common_interface 0.0.6 → 0.0.7

data/app/static/lib/SimpleDialog/SimpleDialog.Image.js

@@ -0,0 +1,121 @@
+SimpleDialog.Image = new Class({
+	Extends: SimpleDialog,
+
+	options: {
+	  images: [],
+		keys: {
+      left: function(){
+        var images = this.options.images;
+        var i = images.indexOf(this.imageUrl);
+        if(i >= 0){
+          i = i == 0 ? images.length - 1 : i - 1;
+          this.show(images[i]);
+        } else {
+          console.log("SimpleDialog.Image: can't show previous image!");
+        } 
+      },
+      right: function(){
+        var images = this.options.images;
+        var i = images.indexOf(this.imageUrl);
+        if(i >= 0){
+          i = i == images.length - 1 ? 0 : i + 1;
+          this.show(images[i]);
+        } else {
+          console.log("SimpleDialog.Image: can't show next image!");
+        }
+      },
+      esc: function(){
+        this.destroy();
+      }
+    }
+	},
+
+	initialize: function(options){
+	  this.parent(options);
+	},
+	
+
+  // 
+  // Protected methods
+  // 
+  _buildContent: function(imageUrl){
+	  this.imageUrl = imageUrl;
+	  
+	  this.image = new Element('img', {
+			events: {
+				load: function(){
+					(function(){
+						var setSize = function(){
+						  this.image.inject(this.element)
+						  this.image.store('dimensions', this.image.getSize()); 
+						}.bind(this);
+						
+						setSize();
+						this._resize();
+						setSize(); //stupid ie
+						this._relocate();						
+					}).bind(this).delay(10);
+				}.bind(this),
+				error: function(){
+					this.fireEvent('error');
+					this.image.destroy();
+					this.element.set('html', this.options.errorMessage);
+				}.bind(this)
+			},
+			styles: {
+				width: 'auto',
+				height: 'auto'
+			}
+		});
+		this.image.src = imageUrl;
+  },
+  
+  _resize: function(){
+    //     //keep currentIndex height/width
+    // var currentDimensions = {x: '', y: ''};
+    // if(this.image) currentDimensions = this.image.getSize();
+    // 
+    // ///empty the content, show the indicator
+    // this.element.set('html','').setStyles({
+    //  width: currentDimensions.x,
+    //  height: currentDimensions.y
+    // });
+    // this._position();
+    //     // this.fade();
+
+    var imageDimensions = this.image.retrieve('dimensions');    
+    if(imageDimensions){ // check if image already loaded    
+      var maxX = (window.getSize().x * 0.9).toInt();
+  		var maxY = (window.getSize().y * 0.9).toInt();		
+  				
+      var imgX = imageDimensions.x; var imgY = imageDimensions.y;
+		
+      var xRatio = 1, yRatio = 1;
+      if(imgX > maxX) xRatio = maxX / imgX;
+      if(imgY > maxY) yRatio = maxY / imgY;      
+      var ratio = xRatio < yRatio ? xRatio : yRatio;
+      
+      var imgX = (imgX * ratio).toInt();
+      var imgY = (imgY * ratio).toInt();
+      
+      this.image.width = imgX;
+      this.image.height = imgY;    
+      this.image.setStyles({width: imgX, height: imgY});      
+    }
+    
+
+    // 
+    // //if image is taller than window...
+    //     // if(imageDimensions && (imageDimensions.y > maxHeight)){
+    //       // this.image.height = maxHeight;
+    //       // this.image.width = (imageDimensions.x * (maxHeight / imageDimensions.y));
+    //       // this.image.setStyles({
+    //       //  height: maxHeight,
+    //       //  width: (imageDimensions.x * (maxHeight / imageDimensions.y)).toInt()
+    //       // });
+    //     // }
+    // 
+    // //get rid of styles
+    // this.element.setStyles({height: '', width: ''});
+	}
+});

data/app/static/lib/SimpleDialog/SimpleDialog.Mask.js

@@ -0,0 +1,76 @@
+// 
+// You can attach a Mask to Dialog, and it will acts (show, hide, destroy) automatically.
+// 
+// dialog = new SimpleDialog()
+// SimpleDialog.Mask.new(dialog) // attach and forget about it, it will act automatically
+// dialog ...
+// 
+SimpleDialog.Mask = new Class({
+	initialize: function(dialog){	  	      
+	  this.element = new Element('div', {'class': 'simple_dialog_mask', styles: {'display': 'none'}});    
+    this.element.inject(document.body);
+            
+    this._attachEvents();
+    this._attachToDialog(dialog);
+	},
+	
+	show: function(){
+	  this.element.show();
+    this._resize();
+		this._relocate();
+		return this;
+	},
+	
+	hide: function(){
+	  this.element.hide();
+		return this;
+	},
+	
+	toElement: function (){
+	  return this.element;
+	},
+	
+	destroy: function(){	  			
+		this._detachEvents();			
+		this.element.destroy();
+		
+		return this;
+	},	
+	
+  // 
+  // Protected methods
+  // 	
+  _attachToDialog: function(dialog){
+    ['show', 'hide', 'destroy'].each(function(name){
+      dialog.addEvent(name, this[name].bind(this));
+    }.bind(this));
+  },
+  
+  _relocate: function(){
+    var scrollSize = window.getScroll();
+		this.element.setStyles({left: scrollSize.x, top: scrollSize.y});
+		return this;
+	},
+	
+	_resize: function(){
+    var size = window.getSize();
+    this.element.setStyles({width: size.x, height: size.y});
+    return this;
+	},
+	
+	_attachEvents: function(){		
+	  this.updateEvent = function(e){
+	    this._resize();
+		  this._relocate();
+	  }.bind(this);
+	  		
+		window.addEvent('resize', this.updateEvent);		
+		window.addEvent('scroll', this.updateEvent);
+	},
+	
+	// Detaches events upon close
+	_detachEvents: function(){
+		window.removeEvent('resize', this.updateEvent);
+		window.removeEvent('scroll', this.updateEvent);
+	}
+});

data/app/static/lib/SimpleDialog/SimpleDialog.css

@@ -0,0 +1,12 @@
+.simple_dialog {
+  outline: none;
+  position: absolute;
+  z-index: 20;  
+}
+
+.simple_dialog_mask {
+  position:absolute;
+  z-index:10;
+  background-color:#000;
+  opacity: 0.3;
+}

data/app/static/lib/SimpleDialog/SimpleDialog.js

@@ -0,0 +1,158 @@
+var SimpleDialog = new Class({
+	Implements: [Options, Events],
+	
+	options: {
+		keys:{
+			esc: function(){this.destroy();}
+		}
+	},
+	
+	initialize: function(options){
+		this.setOptions(options);
+    this._buildElement();
+    this._attachKeyEvents();
+    this._attachUpdateEvents();
+		this._setFocus();
+	},
+	
+	show: function(){
+	  this.element.empty();
+	  this._buildContent.apply(this, arguments);
+	  
+	  this.element.show();
+    this._resize();
+		this._relocate();
+		
+		this.fireEvent('show');
+		
+		return this;
+	},
+	
+	hide: function(){
+	  this.element.hide();
+	  this.fireEvent('hide');
+		return this;
+	},	
+	
+	destroy: function(){	  
+		this.fireEvent('destroy');			
+		this._detachEvents();			
+		this.element.destroy();
+		return this;
+	},
+	
+	wait: function(content){
+	  content = content || "<p>Please wait ...</p>"
+	  this.element.getChildren().hide();
+	  Elements.from(content).inject(this.element);
+	  return this;
+	},
+	
+	toElement: function (){
+		return this.element;
+	},
+		
+  // 
+  // Protected methods
+  // 	
+  _relocate: function(){
+    var windowSize = window.getSize(), 
+			scrollSize = window.getScroll(), 
+			elementSize = this.element.getSize();
+		this.element.setStyles({
+			left: scrollSize.x + ((windowSize.x - elementSize.x) / 2),
+			top: scrollSize.y + ((windowSize.y - elementSize.y) / 3)
+		});
+		return this;		    
+	},
+	
+	_resize: function(){
+	},
+  
+  _buildElement: function(){
+	  this.element = new Element('div', {'class': 'simple_dialog', styles: {'display': 'none'}});    
+	  this.element.inject(document.body);
+	},
+	
+	_buildContent: function(html){
+	  Elements.from(html).inject(this.element);
+	},
+  
+	_setFocus: function(){
+	  (function(){
+	    this.element.setAttribute('tabIndex',0);
+  		this.element.focus();
+	  }).bind(this).delay(10);	      
+	},
+		
+	_attachKeyEvents: function(){
+	  this.keyEvent = function(e){
+			if(this.options.keys[e.key]) this.options.keys[e.key].call(this);
+		}.bind(this);
+		this.element.addEvent('keyup', this.keyEvent);
+	},
+	
+	_attachUpdateEvents: function(){
+		this.updateEvent = function(e){
+		  this._resize();
+		  this._relocate();
+		}.bind(this);		
+		window.addEvent('resize', this.updateEvent);		
+		window.addEvent('scroll', this.updateEvent);
+		window.addEvent('updateStyle', this.updateEvent);
+	},
+	
+	_detachEvents: function(){
+		if(this.keyEvent) this.element.removeEvent('keyup', this.keyEvent);
+		if(this.updateEvent){ 
+  		window.removeEvent('resize', this.updateEvent);
+  		window.removeEvent('scroll', this.updateEvent);
+  		window.removeEvent('updateStyle', this.updateEvent);
+  	}
+	}
+});
+
+
+// 
+// Autodestroy - closes element if user clicks on element or anywhere on the document body.
+// 
+SimpleDialog.Autodestroy = new Class({
+  autodestroy: function(){
+    SimpleDialog.Autodestroy.elements.add(this);
+    this.addEvent('click', function(){
+      this.close();
+    }.bind(this));
+  }
+});
+      
+SimpleDialog.Autodestroy.extend({
+  elements: [],
+  close: function(){
+    this.elements.invoke('destroy');
+    this.elements.clear();
+    
+  }
+});  
+
+document.body.addEvent('click', function(){
+  SimpleDialog.Autodestroy.close();
+});
+
+
+// 
+// OnlyOne, allows only one instance of element to be active, closes all other elements when a new one is created.
+// 
+SimpleDialog.OnlyOne = new Class({
+  onlyOne: function(element){
+    SimpleDialog.OnlyOne.onlyOne(element);
+  }
+});
+
+SimpleDialog.OnlyOne.extend({
+  elements: [],
+  onlyOne: function(element){
+    this.elements.invoke('destroy');
+    this.elements.clear();
+    this.elements.add(element);
+  }
+});

data/app/static/lib/ajax_file_uploading.js

@@ -0,0 +1,33 @@
+// 
+// Support AJAX file uploading
+// 
+Rad.implement({
+  submitFormViaIFrame: function(form, data, callback){
+    callback = callback || function(){};
+    request = new iFrameFormRequest(form, {
+      onComplete: function(response){ 
+        Browser.exec(response);
+        callback.call();
+        window.fireEvent('updated');
+        window.fireEvent('updateStyle');
+      },
+      onFailure: function(){
+        callback.call();
+        console.log("invalid iFrame request!");
+        window.fireEvent('updated');
+        window.fireEvent('updateStyle');
+      }
+    }).send();
+  },
+  
+  submitForm: function(form, data, callback){
+    var hasFile = form.getElements('input[type=file]').any(function(input){
+      return !input.get('value').blank();
+    });
+    if(hasFile){
+      this.submitFormViaIFrame(form, data, callback);
+    }else{
+      this.submitFormViaXhr(form, data, callback);      
+    }
+  }
+});

data/app/static/themes/default/reset.css

@@ -0,0 +1,127 @@
+/*
+Copyright (c) 2008, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 3.0.0pr1
+*/
+
+/*html {
+  color: #000;
+  background: #FFF; }*/
+
+body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
+  margin: 0;
+  padding: 0; }
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0; }
+
+fieldset, img {
+  border: 0; }
+
+address, caption, cite, code, dfn, em, strong, th, var {
+  font-style: normal;
+  font-weight: normal; }
+
+li {
+  list-style: none; }
+
+caption, th {
+  text-align: left; }
+
+h1, h2, h3, h4, h5, h6 {
+  font-size: 100%;
+  font-weight: normal; }
+
+q:before, q:after {
+  content: ''; }
+
+abbr, acronym {
+  border: 0;
+  font-variant: normal; }
+
+sup {
+  vertical-align: text-top; }
+
+sub {
+  vertical-align: text-bottom; }
+
+input, textarea, select {
+  font-family: inherit;
+  font-size: inherit;
+  font-weight: inherit; }
+
+input, textarea, select {
+  *font-size: 100%; }
+
+legend {
+  color: #000; }
+
+h1 {
+  font-size: 138.5%; }
+
+h2 {
+  font-size: 123.1%; }
+
+h3 {
+  font-size: 108%; }
+
+h1, h2, h3 {
+  margin: 1em 0; }
+
+h1, h2, h3, h4, h5, h6, strong {
+  font-weight: bold; }
+
+abbr, acronym {
+  border-bottom: 1px dotted #000;
+  cursor: help; }
+
+em {
+  font-style: italic; }
+
+blockquote, ul, ol, dl {
+  margin: 1em; }
+
+ol, ul, dl {
+  margin-left: 2em; }
+
+ol li {
+  list-style: decimal outside; }
+
+ul li {
+  list-style: disc outside; }
+
+dl dd {
+  margin-left: 1em; }
+
+th {
+  font-weight: bold;
+  text-align: center; }
+
+caption {
+  margin-bottom: .5em;
+  text-align: center; }
+
+p, fieldset, table, pre {
+  margin-bottom: 1em; }
+
+input[type=text], input[type=password], textarea {
+  width: 12.25em;
+  *width: 11.9em; }
+
+body {
+  font: 13px/1.231 arial,helvetica,clean,sans-serif;
+  *font-size: small;
+  *font: x-small; }
+
+select, input, button, textarea {
+  font: 99% arial,helvetica,clean,sans-serif; }
+
+table {
+  font-size: inherit;
+  font: 100%; }
+
+pre, code, kbd, samp, tt {
+  font-family: monospace;
+  *font-size: 108%; }

data/app/static/themes/default/style/application.less

@@ -0,0 +1,51 @@
+// the_layout
+body                    {
+  > .css_box            {max-width: @max_width; margin-left: auto; margin-right: auto;
+    > table.css_table   {
+      > tbody           {
+        > tr            {
+          > td.css_td1  {}
+          > td.css_td2  {width: @tools_width;}}}}
+    > .css_box          {}}}
+    
+    
+.the_content {}
+
+
+.the_aspects {}
+
+
+.the_tools {.s_box; .s_border; .s_round;}
+
+.panel_t () {.t_toolbar;
+  .css_box  {max-width: @max_width; margin-left: auto; margin-right: auto;}}
+.panel_s       {.s_toolbar; .s_small_text;
+  .css_box     {
+    .l_left    {// padding-left: @normal + @small + @normal;
+      .l_logo  {font-weight: bold;}
+      .l_item  {}}
+    .l_right   {// padding-right: @normal + @small + @normal;
+      .l_item  {}}}}
+
+.the_top_panel {.panel_t; .panel_s; background: @light_color;
+  .css_box     {
+    .l_left    {
+      .l_item  {}
+      .l_logo  {font-weight: bold;}}
+    .l_right   {
+      .l_item  {}}}}
+  	
+
+.the_bottom_panel {.panel_t; .panel_s; background-color: @light_color; padding-top: @big; padding-bottom: @big;}
+
+
+.the_navigation {.panel_t; .panel_s;
+  .css_box      {
+    .l_active   {font-weight: bold; background-color: @light_color; .s_round_bl(@small_radius); .s_round_br(@small_radius);}}}
+
+/*.the_navigation_t {.t_tabs;
+  > .css_box      {.t_max_width;}}
+.the_navigation         {.the_navigation_t; .s_tabs; .s_small_text; padding-left: 0; padding-right: 0;
+  > .css_box            {
+    .l_item:first-child {margin-left: @normal + @small;}
+    .l_active           {.s_round_bl(@small_radius); .s_round_br(@small_radius);}}}*/

data/app/static/themes/default/style/aspects.less

@@ -0,0 +1,15 @@
+.the_controls {.s_controls;}
+
+
+.the_details {}
+
+
+.the_discussion_t () {
+  > .l_controls   {float: right;}}  
+.the_discussion {.the_discussion_t;
+  > .l_controls {.s_box; .s_controls;}} 
+
+
+.the_paginator {.s_link; .s_box;
+  > *          {margin-right: @normal;}  
+  .l_active    {font-weight: bold;}}

data/app/static/themes/default/style/basic.less

@@ -0,0 +1,49 @@
+.the_more {.m_tiny; .s_a_link;}
+
+
+.the_narrow {margin-left: 20%; margin-right: 20%;}
+
+
+.the_tabs     {
+  > .l_panel  {.t_tabs; .s_tabs; border-bottom: @small solid @light_color;  
+    .l_active {.s_round_tl(@small_radius); .s_round_tr(@small_radius); cursor: text;
+      a       {cursor: text;}}
+    a         {outline: none;}}
+  > .l_content{}}
+
+
+.the_basic_list {.t_list; .s_list; 
+  .l_item       {.s_link;
+    .l_check_box {}
+    .l_content {}}}
+
+
+.the_info_message  {.s_box; .s_round; .s_narrow; .s_link; background: @light_yellow_color;}
+.the_error_message {.s_box; .s_round; .s_narrow; .s_link; background: @light_red_color;}
+
+
+.the_divider_t () {.s_box; clear: both;}
+.the_divider {.the_divider_t; .s_normal_text; text-align: right; border-bottom: @small solid @color;}
+
+
+.the_table_t () {width: 100%;}
+.the_table            {.the_table_t; .s_link;
+	thead               {
+    tr                {
+      th              {background: @light_color; .s_normal_text; text-align: left; padding: @normal;
+        &:first-child {.s_round_tl;}
+        &:last-child  {.s_round_tr;}}}}
+  tbody               {
+    tr                {
+      td              {padding: @normal;}}
+    .l_even           {background: @very_light_color;}}}
+
+
+.the_toolbar {.t_toolbar; .s_toolbar; .s_link;  
+  .l_left    {
+    .l_item  {}}	
+	.l_right   {
+	  .l_item  {}}}
+	  
+
+.the_title {.s_box}

data/app/static/themes/default/style/forms.less

@@ -0,0 +1,34 @@
+.the_form_t ()         {
+  .l_field             {
+    > table.css_table  {
+      > tbody          {
+        > tr           {
+          > td.css_td1 {width: 30%;}
+          > td.css_td2 {}}}}}  
+  .l_line              {.t_tabs;}}
+  
+.the_form          {.the_form_t; // .s_box; .s_border; .s_round;
+	.l_errors        {
+    .l_error       {.s_small_text; color: @red_color;}}  
+	.l_field         {.s_vbox(@small); .s_link;
+    .l_required    {font-weight: bold;}
+		.l_label       {}		
+    .l_input       {
+      
+      select               {min-width: 30%}
+      input, textarea      {width: 100%;}
+      textarea             {min-height: @textarea_height !important;}
+      input[type=checkbox] {width: auto;}
+      input[type=radio]    {width: auto;}
+      label                {margin-left: @normal; margin-right: @big;}}        
+      
+    .l_description {.s_small_text; color: @light_color;}						
+		.l_errors      {}}
+  .l_line          {.s_tabs; .s_vbox; .s_link;
+    .l_item        {
+      a            {padding: 3px 0px 4px; display: block;}}}} // to be the same size as button in formalize.css
+
+
+// special cases
+.the_form   {
+  .the_more {float: right;}}