rsence-pre 2.1.0.1.pre

data/js/controls/imageview/imageview.js

@@ -0,0 +1,109 @@
+/*   RSence
+ *   Copyright 2006 Riassence Inc.
+ *   http://riassence.com/
+ *
+ *   You should have received a copy of the GNU General Public License along
+ *   with this software package. If not, contact licensing@riassence.com
+ */
+
+/*** = Description
+  ** HImageView is a control unit intended to display images on the screen
+  ** through the HTML <IMG> tag. The HImageView class is a container 
+  ** to visualize
+  ** images loaded via URL. It supports scaling via two class methods, 
+  ** scaleToFit and scaleToOriginal. If the image is unable to be loaded, 
+  ** a default blank image will be rendered.
+  **
+  ***/
+var//RSence.Controls
+HImageView = HControl.extend({
+  
+  controlDefaults: (HControlDefaults.extend({
+    scaleToFit: true,
+    value: null,
+    constructor: function(_ctrl){
+      if(this.value===null){
+        // default to a blank image
+        this.value = _ctrl.getThemeGfxPath() + "/blank.gif";
+      }
+    }
+  })),
+  
+  _makeScaleToFit: function(_parentId){
+    var _value = (this.value!==null)?this.value:(this.options.valueObj?this.options.valueObj.value:this.options.value);
+    this.elemId = ELEM.make(_parentId,'img');
+    ELEM.setAttr(this.elemId,'src',_value);
+    ELEM.setAttr(this.elemId,'alt',this.label);
+    ELEM.setAttr(this.elemId,'title',this.label);
+  },
+  _makeScaleToOriginal: function(_parentId){
+    var _value = (this.value!==null)?this.value:(this.options.valueObj?this.options.valueObj.value:this.options.value);
+    this.elemId = ELEM.make(_parentId,'div');
+    ELEM.setStyle(this.elemId,'background-image','url('+_value+')');
+    ELEM.setStyle(this.elemId,'background-position','0px 0px');
+    ELEM.setStyle(this.elemId,'background-repeat','no-repeat');
+    ELEM.setAttr(this.elemId,'title',this.label);
+  },
+  _makeElem: function(_parentId){
+    if(this.options.scaleToFit){
+      this._makeScaleToFit(_parentId);
+    }
+    else {
+      this._makeScaleToOriginal(_parentId);
+    }
+  },
+  
+/** = Description
+  * Used to refresh HImageView if the this.value is changed.
+  * 
+  **/
+  refreshValue: function(){
+    if(this.options.scaleToFit){
+      ELEM.setAttr(this.elemId,'src',this.value);
+    }
+    else{
+      ELEM.setStyle(this.elemId,'background-image','url('+this.value+')');
+    }
+  },
+  
+/** = Description
+  * Refreshesh the label of HImageView.
+  *
+  **/
+  refreshLabel: function(){
+    if(this.options.scaleToFit){
+      ELEM.setAttr(this.elemId,'alt',this.label);
+    }
+    ELEM.setAttr(this.elemId,'title',this.label);
+  },
+  
+/** = Description
+  * Changes the size of the image element so that it fits in the rectangle of
+  * the view.
+  *
+  **/
+  scaleToFit: function() {
+    if(!this.options.scaleToFit){
+      ELEM.del(this.elemId);
+      this._makeScaleToFit(this._getParentElemId());
+      this.options.scaleToFit=true;
+    }
+  },
+  
+  
+/** = Description
+  * Resizes the image element to its original dimesions. If the image is larger
+  * than the rectangle of this view, clipping will occur.
+  *
+  **/
+  scaleToOriginal: function() {
+    if(this.options.scaleToFit){
+      ELEM.del(this.elemId);
+      this._makeScaleToOriginal(this._getParentElemId());
+      this.options.scaleToFit=false;
+    }
+  }
+
+
+  
+});

data/js/controls/passwordcontrol/passwordcontrol.js

@@ -0,0 +1,23 @@
+/*   RSence
+ *   Copyright 2006 Riassence Inc.
+ *   http://riassence.com/
+ *
+ *   You should have received a copy of the GNU General Public License along
+ *   with this software package. If not, contact licensing@riassence.com
+ */
+
+/*** = Description
+  ** Just like HTextControl, but the typed characters are not shown.
+  **
+  ** = Instance variables
+  ** +type+::  '[HPasswordControl]'
+  ** +value+:: The string that is currently held by this object.
+  **
+  ***/
+var//RSence.Controls
+HPasswordControl = HTextControl.extend({
+  
+  componentName: 'passwordcontrol'
+  
+});
+

data/js/controls/passwordcontrol/themes/default/passwordcontrol.html

@@ -0,0 +1,18 @@
+<div class="textcontrol_bg"></div>
+
+<div class="textcontrol_n"></div>
+<div class="textcontrol_s"></div>
+<div class="textcontrol_w"></div>
+<div class="textcontrol_e"></div>
+
+<div class="textcontrol_nw"></div>
+<div class="textcontrol_ne"></div>
+<div class="textcontrol_se"></div>
+<div class="textcontrol_sw"></div>
+
+<div id="label#{_ID}" title="#{this.label}" class="textcontrol_input_parent">
+  <input type="password" class="textcontrol_input" #{this.enabled?'':'disabled'}
+    onfocus="HSystem.views[#{this.viewId}].textFocus();" 
+    onblur="HSystem.views[#{this.viewId}].textBlur();" 
+    id="value#{_ID}" value="#{this.value}" />
+</div>

data/js/controls/progress/progressbar/progressbar.js

@@ -0,0 +1,40 @@
+/*   RSence
+ *   Copyright 2006 Riassence Inc.
+ *   http://riassence.com/
+ *
+ *   You should have received a copy of the GNU General Public License along
+ *   with this software package. If not, contact licensing@riassence.com
+ */
+
+/*** = Description
+  ** HProgressBar is a control unit used to convey the progress of a task, 
+  ** such as a download or file transfer. In other words, it is a component 
+  ** indicating a percentage of a total task has completed.
+  **
+  ** Use the maxValue to define the point of progress at the end and use value
+  ** to define the point of progress.
+  **
+***/
+var//RSence.Controls
+HProgressBar = HControl.extend({
+  componentName: "progressbar",
+  
+/** The amount of pixels the theme insets the width of the progress bar **/
+  themeWidthInset: 2,
+  
+/** Sets the width of the progress bar when the value changes. **/
+  refreshValue: function(){
+    if( this.drawn && this.markupElemIds.value ){
+      var _visibleWidth = this.rect.width-this.themeWidthInset,
+          _progressWidth = Math.round(_visibleWidth * this.value);
+      if(_progressWidth<0){
+        _progressWidth = 0;
+      }
+      this.setStyleOfPart('value','width',_progressWidth+'px');
+    }
+  },
+  onIdle: function(){
+    this.base();
+    this.refreshValue();
+  }
+});

data/js/controls/progress/progressbar/themes/default/progressbar.css

@@ -0,0 +1,16 @@
+.progressbar {
+  cursor: wait;
+  position: absolute;
+  left: 0px; top: 0px; right: 0px; bottom: 1px;
+  border: 1px solid #999;
+  background-color: #ccc;
+} 
+.progressbar .progress {
+  position: absolute;
+  left: 0px; top: 0px;
+  width: 50px; bottom: 0px;
+  background-color: #333;
+}
+.disabled .progressbar {
+  opacity: 0.75;
+}

data/js/controls/progress/progressbar/themes/default/progressbar.html

@@ -0,0 +1,2 @@
+<div class="progressbar"
+  ><div class="progress" id="value#{ _ID }"></div></div>

data/js/controls/progress/progressindicator/progressindicator.js

@@ -0,0 +1,44 @@
+/*   RSence
+ *   Copyright 2006 Riassence Inc.
+ *   http://riassence.com/
+ *
+ *   You should have received a copy of the GNU General Public License along
+ *   with this software package. If not, contact licensing@riassence.com
+ */
+
+/*** = Description
+  ** A progress indicator is the indeterminate progress bar, which is used in 
+  ** situations where the extent of the task is unknown or the progress of 
+  ** the task can not be determined in a way that could be expressed as a 
+  ** percentage. This bar uses motion or some other indicator to show that 
+  ** progress is taking place, rather than using the size of the filled portion
+  ** to show the total amount of progress.
+  ***/
+var//RSence.Controls
+HProgressIndicator = HView.extend({
+  _indicator: null,
+  _animDirection: 0,
+  drawSubviews: function(){
+    var _this = this;
+    _this.setStyle( 'border', '1px solid #999' );
+    _this.setStyle( 'background-color', '#ccc' );
+    var _height = _this.rect.height,
+        _visibleWidth = ELEM.getVisibleSize( _this.elemId )[0],
+        _width = (_visibleWidth===0)?_this.rect.width:_visibleWidth;
+    _width -= 2;
+    _this['_rect'+0] = HRect.nu( 0,0,_height,_height );
+    _this['_rect'+1] = HRect.nu( _width-_height, 0, _width, _height );
+    _this._indicator = HView.nu( HRect.nu( _this['_rect'+0] ), _this );
+    _this._indicator.setStyle('background-color','#333');
+    _this._indicator.onAnimationEnd = function(){
+      this.parent._toggleDirection();
+    };
+    _this._toggleDirection();
+  },
+  _toggleDirection: function(){
+    this._animDirection = this._animDirection===1?0:1;
+    var _directionRect = HRect.nu( this['_rect'+this._animDirection] );
+    this._indicator.animateTo(_directionRect);
+  }
+});
+

data/js/controls/radiobutton/radiobutton.js

@@ -0,0 +1,43 @@
+/*   RSence
+ *   Copyright 2008 Riassence Inc.
+ *   http://riassence.com/
+ *
+ *   You should have received a copy of the GNU General Public License along
+ *   with this software package. If not, contact licensing@riassence.com
+ */
+
+/*** = Description
+  ** A HRadioButton is a labeled, two-state button that's displayed in a group along
+  ** with other similar buttons. The button itself is a round icon that has a filled
+  ** center when the HRadioButton is turned on, and is empty when it's off.
+  ** The label appears next to the icon.
+  **
+  ** Only one radio button in the group can be on at a time; when the user clicks a
+  ** button to turn it on, the button that's currently on is turned off. One button
+  ** in the group must be on at all times; the user can turn a button off only by
+  ** turning another one on. The button that's on has a value of 1 (H_CONTROL_ON);
+  ** the others have a value of 0 (H_CONTROL_OFF).
+  **
+  ** The HRadioButton class handles the interaction between radio buttons in the
+  ** following way: A direct user action can only turn on a radio button, not turn
+  ** it off. However, when the user turns a button on, the HRadioButton object turns
+  ** off all sibling HRadioButtons—that is, all HRadioButtons that have the same
+  ** parent as the one that was turned on.
+  **
+  ** This means that a parent view should have no more than one 
+  ** group of radio buttons among its children. Each set of radio buttons 
+  ** should be assigned a separate parent—perhaps an empty HView that 
+  ** simply contains the radio buttons and does no drawing of its own.
+  ***/
+
+var//RSence.Controls
+HRadioButton = HCheckbox.extend(
+  HValueMatrixInterface
+);
+HRadioButton.prototype.componentName = 'radiobutton';
+
+
+// Backwards compatibility
+var//RSence.Controls
+HRadiobutton = HRadioButton;
+

data/js/controls/radiobutton/themes/default/radiobutton.css

@@ -0,0 +1,69 @@
+.radiobutton_control,
+.radiobutton_state,
+.radiobutton_label,
+.radiobutton_antiselect {
+  position: absolute; height: 24px;
+}
+.radiobutton_control {
+  left: 0px; top: 0px; right: 0px;
+  cursor: pointer;
+}
+.disabled > .radiobutton_control {
+  cursor: default;
+}
+.radiobutton_state {
+  left: 0px; top: 0px; width: 24px;
+  background-repeat: no-repeat;
+  background-position: -24px 0px;
+  background-image: #{this.getCssFilePath('radiobutton_parts1.png')};
+}
+
+#{BROWSER_TYPE.ie6?'.enabled .unchecked .radiobutton_state':'.enabled > .unchecked > .radiobutton_state'} {
+  background-position: -24px 0px;
+}
+#{BROWSER_TYPE.ie6?'.enabled .unchecked:hover .radiobutton_state':'.enabled > .unchecked:hover > .radiobutton_state'} {
+  background-position: -24px -24px;
+}
+#{BROWSER_TYPE.ie6?'.enabled .unchecked:active .radiobutton_state':'.enabled > .unchecked:active > .radiobutton_state'} {
+  background-position: -24px -48px;
+}
+
+#{BROWSER_TYPE.ie6?'.enabled .checked .radiobutton_state':'.enabled > .checked > .radiobutton_state'} {
+  background-position: 0px 0px;
+}
+#{BROWSER_TYPE.ie6?'.enabled .checked:hover .radiobutton_state':'.enabled > .checked:hover > .radiobutton_state'} {
+  background-position: 0px -24px;
+}
+#{BROWSER_TYPE.ie6?'.enabled .checked:active .radiobutton_state':'.enabled > .checked:active > .radiobutton_state'} {
+  background-position: 0px -48px;
+}
+
+#{BROWSER_TYPE.ie6?'.disabled .unchecked .radiobutton_state':'.disabled > .unchecked > .radiobutton_state'} {
+  background-position: -24px -72px;
+}
+#{BROWSER_TYPE.ie6?'.disabled .checked .radiobutton_state':'.disabled > .checked > .radiobutton_state'} {
+  background-position: 0px -72px;
+}
+
+.radiobutton_label {
+  left: 24px; right: 0px; top: 0px;
+  height: 20px; line-height: 21px;
+  text-align: left; vertical-align: middle;
+  font-family: Arial, sans-serif;
+  font-size: 12px;
+  color: #333;
+}
+#{BROWSER_TYPE.ie6?'.disabled .radiobutton_control .radiobutton_label':'.disabled > .radiobutton_control > .radiobutton_label'} {
+  color: #999;
+}
+#{BROWSER_TYPE.ie6?'.enabled .radiobutton_control:hover .radiobutton_label':'.enabled > .radiobutton_control:hover > .radiobutton_label'} {
+  color: #000;
+}
+#{BROWSER_TYPE.ie6?'.enabled .radiobutton_control:active .radiobutton_label':'.enabled > .radiobutton_control:active > .radiobutton_label'} {
+  color: #000;
+}
+
+.radiobutton_antiselect {
+  left: 0px; top: 0px; right: 0px;
+}
+

data/js/controls/radiobutton/themes/default/radiobutton.html

@@ -0,0 +1,5 @@
+<div class="radiobutton_control#{this.value?' checked':' unchecked'}" id="control#{_ID}">
+  <div class="radiobutton_state" id="state#{_ID}"></div>
+  <div class="radiobutton_label" id="label#{_ID}">#{this.label}</div>
+  <div class="radiobutton_antiselect"></div>
+</div>