profoundjs 7.5.0 → 7.7.0

package/htdocs/profoundui/userdata/custom/widgets/googlemaps.js

@@ -1,139 +1,139 @@
-
-
-// Example - creating a custom widget
-
-pui.widgets.add({
-  // widget name - this is placed into the standard "field type" property
-  name: "google maps",
-  
-  // the default id prefix - used to assign id's when the element is first created
-  newId: "Map",
-  
-  // pull-down menu name
-  menuName: "Google Maps Widget",
-  
-  // default properties for the widget
-  defaults: {
-    "width": "400px",
-    "height": "300px",
-    "z index": "25",
-    "background color": "#FFFFFF"
-  },
-  
-  // property setter functions
-  propertySetters: {
-  
-    // this will fire when the field type property is set to "google maps" 
-    // initialization code for the element should go here
-    "field type": function(parms) {
-      if (parms.design) {
-        // design mode content creation code goes here
-        // add preview image
-        var img = document.createElement("img");
-        img.src = "/profoundui/proddata/images/GoogleMaps.jpg";
-        img.style.position = "absolute";
-        img.style.left = "0px";
-        img.style.top = "0px";
-        //img.style.width = parms.dom.style.width;
-        //img.style.height = parms.dom.style.height;
-        img.style.width = "100%";
-        img.style.height = "100%";
-        parms.dom.appendChild(img);
-        parms.dom.style.overflow = "hidden";
-      }
-      else {
-        // runtime content creation code goes here
-        // clear
-        parms.dom.innerHTML = "";
-        // get url property - evalProperty will evaluate any js expressions that may have been used to build the property
-        address = parms.evalProperty("google maps address");
-        // populate the widget's dom element 
-        if (address == null || address == "") {
-          parms.dom.innerHTML = "Google Maps Address property not specified.";
-        }
-        else {
-          // here, we build an iframe element and put it into the dom
-          var url = document.location.protocol + "//maps.google.com/maps?hl=enl&q=" + encodeURIComponent(address) + "&ie=UTF8&hq=&hnear=" + encodeURIComponent(address) + "&output=embed";
-          var html = '<iframe src="' + url;
-          html += '" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"" width="100%" height="100%">';
-          parms.dom.innerHTML = html;
-        }
-      }
-    },
-    "visibility": function(parms) {
-      
-      if (!parms.design) {
-      
-        var iframe = parms.dom.getElementsByTagName("iframe");
-        if (iframe && iframe.length == 1) {
-      
-          iframe = iframe[0];
-          if (parms.value == "hidden") {
-          
-            iframe.style.visibility = "hidden";
-            iframe.style.display = "none";
-          
-          }
-          else {
-          
-            iframe.style.visibility = "";
-            iframe.style.display = "";
-          
-          }
-        
-        }
-      
-      }
-    } 
-  }
-  
-});
-
-
-// the widget will already have prebuilt standard properties relating to css attributes, js events, etc.
-// here, we can add additional custom properties
-pui.addCustomProperty({
-  // property name
-  name: "google maps address", 
-  
-  // optional type of input
-  // "long" specifies that the text can be long, and an exta text area prompt box is added
-  // other types include: "color", "boolean", "image", "list", "js", "file", and "field"
-  type: "long", 
-  
-  // help text appears at the bottom of the properties window
-  help: "Specifies the full address to be mapped within Google Maps.", 
-  
-  // array of widget elements that this property is applicable to
-  controls: ["google maps"],
-  
-  // properties are categorized in the properties window
-  // if the specified category doesn't already exist, it will be created
-  category: "Field Settings"
-});
-
-
-// Now, we add an entry to the left-hand side Widgets Toolbox
-// More than one entry can be added for the same base widget - this would makes sense if we vary default properties
-pui.toolbox.add({
-  // specifies category - this can be an existing category or a new one
-  // if the category does not exist, it is created on the fly
-  category: "Custom Widgets",
-  
-  widget: "google maps",
-  text: "Google Maps Widget",
-  icon: "/profoundui/proddata/images/icons/google_maps.png",
-  
-  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
-  proxyHeight: 302,
-  proxyWidth: 402,
-  proxyHTML: '<img src="/profoundui/proddata/images/GoogleMaps.jpg" style="width: 400px; height: 300px;">',
-
-  
-  // additional default property values can be specified here
-  defaults: {
-  }  
-  
-});
-
-
+
+
+// Example - creating a custom widget
+
+pui.widgets.add({
+  // widget name - this is placed into the standard "field type" property
+  name: "google maps",
+  
+  // the default id prefix - used to assign id's when the element is first created
+  newId: "Map",
+  
+  // pull-down menu name
+  menuName: "Google Maps Widget",
+  
+  // default properties for the widget
+  defaults: {
+    "width": "400px",
+    "height": "300px",
+    "z index": "25",
+    "background color": "#FFFFFF"
+  },
+  
+  // property setter functions
+  propertySetters: {
+  
+    // this will fire when the field type property is set to "google maps" 
+    // initialization code for the element should go here
+    "field type": function(parms) {
+      if (parms.design) {
+        // design mode content creation code goes here
+        // add preview image
+        var img = document.createElement("img");
+        img.src = "/profoundui/proddata/images/GoogleMaps.jpg";
+        img.style.position = "absolute";
+        img.style.left = "0px";
+        img.style.top = "0px";
+        //img.style.width = parms.dom.style.width;
+        //img.style.height = parms.dom.style.height;
+        img.style.width = "100%";
+        img.style.height = "100%";
+        parms.dom.appendChild(img);
+        parms.dom.style.overflow = "hidden";
+      }
+      else {
+        // runtime content creation code goes here
+        // clear
+        parms.dom.innerHTML = "";
+        // get url property - evalProperty will evaluate any js expressions that may have been used to build the property
+        address = parms.evalProperty("google maps address");
+        // populate the widget's dom element 
+        if (address == null || address == "") {
+          parms.dom.innerHTML = "Google Maps Address property not specified.";
+        }
+        else {
+          // here, we build an iframe element and put it into the dom
+          var url = document.location.protocol + "//maps.google.com/maps?hl=enl&amp;q=" + encodeURIComponent(address) + "&amp;ie=UTF8&amp;hq=&amp;hnear=" + encodeURIComponent(address) + "&amp;output=embed";
+          var html = '<iframe src="' + url;
+          html += '" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"" width="100%" height="100%">';
+          parms.dom.innerHTML = html;
+        }
+      }
+    },
+    "visibility": function(parms) {
+      
+      if (!parms.design) {
+      
+        var iframe = parms.dom.getElementsByTagName("iframe");
+        if (iframe && iframe.length == 1) {
+      
+          iframe = iframe[0];
+          if (parms.value == "hidden") {
+          
+            iframe.style.visibility = "hidden";
+            iframe.style.display = "none";
+          
+          }
+          else {
+          
+            iframe.style.visibility = "";
+            iframe.style.display = "";
+          
+          }
+        
+        }
+      
+      }
+    } 
+  }
+  
+});
+
+
+// the widget will already have prebuilt standard properties relating to css attributes, js events, etc.
+// here, we can add additional custom properties
+pui.addCustomProperty({
+  // property name
+  name: "google maps address", 
+  
+  // optional type of input
+  // "long" specifies that the text can be long, and an exta text area prompt box is added
+  // other types include: "color", "boolean", "image", "list", "js", "file", and "field"
+  type: "long", 
+  
+  // help text appears at the bottom of the properties window
+  help: "Specifies the full address to be mapped within Google Maps.", 
+  
+  // array of widget elements that this property is applicable to
+  controls: ["google maps"],
+  
+  // properties are categorized in the properties window
+  // if the specified category doesn't already exist, it will be created
+  category: "Field Settings"
+});
+
+
+// Now, we add an entry to the left-hand side Widgets Toolbox
+// More than one entry can be added for the same base widget - this would makes sense if we vary default properties
+pui.toolbox.add({
+  // specifies category - this can be an existing category or a new one
+  // if the category does not exist, it is created on the fly
+  category: "Custom Widgets",
+  
+  widget: "google maps",
+  text: "Google Maps Widget",
+  icon: "/profoundui/proddata/images/icons/google_maps.png",
+  
+  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
+  proxyHeight: 302,
+  proxyWidth: 402,
+  proxyHTML: '<img src="/profoundui/proddata/images/GoogleMaps.jpg" style="width: 400px; height: 300px;">',
+
+  
+  // additional default property values can be specified here
+  defaults: {
+  }  
+  
+});
+
+

package/htdocs/profoundui/userdata/custom/widgets/listbox.js

@@ -1,37 +1,37 @@
-
-
-// Example - creating a custom widget based on an existing one
-// In this example, we create a list box ("select box" field type) with modified default properties
-
-
-// Add an entry to the Widgets Toolbox
-pui.toolbox.add({
-  // specifies category - this can be an existing category or a new one
-  // if the category does not exist, it is created on the fly
-  category: "Custom Widgets",
-  
-  // the widget parameter determines the "field type" property of an element
-  widget: "select box",
-  
-  text: "Custom List Box",
-  icon: "/profoundui/proddata/images/icons/list_box.png",
-  
-  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
-  // in this case, an image of the tab panel is used
-  proxyHeight: 86,
-  proxyWidth: 150,
-  proxyHTML: '<select size="5" style="font-family: Sans-Serif; width: 150px; color: #666666; background-color: #FAE4AA; font-size: 12px"><option>Choice 1</option><option>Choice 2</option><option>Choice 3</option><option>Choice 4</option><option>Choice 5</option></select>',
-  
-  // any property of a "select box" can be specified here
-  defaults: {
-    "select box height": "5",
-    "width": "150px",
-    "color": "#666666",
-    "background color": "#FAE4AA",
-    "choices": "Choice 1,Choice 2,Choice 3,Choice 4,Choice 5",
-    "font family": "Sans-Serif",
-    "font size": "12px"
-  }  
-  
-});
-
+
+
+// Example - creating a custom widget based on an existing one
+// In this example, we create a list box ("select box" field type) with modified default properties
+
+
+// Add an entry to the Widgets Toolbox
+pui.toolbox.add({
+  // specifies category - this can be an existing category or a new one
+  // if the category does not exist, it is created on the fly
+  category: "Custom Widgets",
+  
+  // the widget parameter determines the "field type" property of an element
+  widget: "select box",
+  
+  text: "Custom List Box",
+  icon: "/profoundui/proddata/images/icons/list_box.png",
+  
+  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
+  // in this case, an image of the tab panel is used
+  proxyHeight: 86,
+  proxyWidth: 150,
+  proxyHTML: '<select size="5" style="font-family: Sans-Serif; width: 150px; color: #666666; background-color: #FAE4AA; font-size: 12px"><option>Choice 1</option><option>Choice 2</option><option>Choice 3</option><option>Choice 4</option><option>Choice 5</option></select>',
+  
+  // any property of a "select box" can be specified here
+  defaults: {
+    "select box height": "5",
+    "width": "150px",
+    "color": "#666666",
+    "background color": "#FAE4AA",
+    "choices": "Choice 1,Choice 2,Choice 3,Choice 4,Choice 5",
+    "font family": "Sans-Serif",
+    "font size": "12px"
+  }  
+  
+});
+

package/htdocs/profoundui/userdata/custom/widgets/panel.js

@@ -1,74 +1,74 @@
-
-
-// Example - creating a custom panel or dialog
-
-// Note: panels and dialogs are the same type of element
-//       dialogs use a different set of corner/border images to make them look like a dialog
-
-
-// Add a new panel style
-// This will appear as an option in the "tab panel style" property of a panel
-pui.widgets.panelStyles["Custom Panel"] = {
-  // width of the left side of the panel (should match the width of the images provided in the /images/panels/ folder)
-  left: 10,
-  
-  // width of the right side of the panel (should match the width of the images provided in the /images/panels/ folder)
-  right: 10,
-  
-  // height of the top side of the panel, including title bar if this is a dialog (should match the height of the images provided in the /images/panels/ folder)
-  top: 33,
-  
-  // height of the bottom side of the panel (should match the height of the images provided in the /images/panels/ folder)
-  bottom: 9,
-  
-  // panel's background color
-  background: "#f0b310",
-  
-  // panel title font color
-  textColor: "#000000",
-  
-  // background color of the panel title edit box in the designer
-  textBackground: "#f6d47a",
-  
-  // top padding in pixels for the panel title
-  textTopPadding: "7px"
-  
-  
-  // optional parameters...
-  //textAlign:         // title alignment
-  //fontSize:          // title font size
-  //noTitle:           // true or false
-  //width:             // override default width
-  //height:            // override default height
-  //dialog:            // true or false  
-}
-
-
-
-
-// Now, add an entry to the Widgets Toolbox
-pui.toolbox.add({
-  // specifies category - this can be an existing category or a new one
-  // if the category does not exist, it is created on the fly
-  category: "Custom Widgets",
-  
-  widget: "panel",
-  text: "Custom Panel",
-  icon: "/profoundui/proddata/images/panels/Custom Panel/icon.png",
-  
-  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
-  proxyHeight: 100,
-  proxyWidth: 200,
-  proxyHTML: function(defaults) {
-    return pui.widgets.getPanelProxy(defaults);
-  },
-  
-  // additional default property values can be specified here
-  defaults: {
-    "panel style": "Custom Panel",
-    "color": "#000000"
-  }  
-  
-});
-
-
+
+
+// Example - creating a custom panel or dialog
+
+// Note: panels and dialogs are the same type of element
+//       dialogs use a different set of corner/border images to make them look like a dialog
+
+
+// Add a new panel style
+// This will appear as an option in the "tab panel style" property of a panel
+pui.widgets.panelStyles["Custom Panel"] = {
+  // width of the left side of the panel (should match the width of the images provided in the /images/panels/ folder)
+  left: 10,
+  
+  // width of the right side of the panel (should match the width of the images provided in the /images/panels/ folder)
+  right: 10,
+  
+  // height of the top side of the panel, including title bar if this is a dialog (should match the height of the images provided in the /images/panels/ folder)
+  top: 33,
+  
+  // height of the bottom side of the panel (should match the height of the images provided in the /images/panels/ folder)
+  bottom: 9,
+  
+  // panel's background color
+  background: "#f0b310",
+  
+  // panel title font color
+  textColor: "#000000",
+  
+  // background color of the panel title edit box in the designer
+  textBackground: "#f6d47a",
+  
+  // top padding in pixels for the panel title
+  textTopPadding: "7px"
+  
+  
+  // optional parameters...
+  //textAlign:         // title alignment
+  //fontSize:          // title font size
+  //noTitle:           // true or false
+  //width:             // override default width
+  //height:            // override default height
+  //dialog:            // true or false  
+}
+
+
+
+
+// Now, add an entry to the Widgets Toolbox
+pui.toolbox.add({
+  // specifies category - this can be an existing category or a new one
+  // if the category does not exist, it is created on the fly
+  category: "Custom Widgets",
+  
+  widget: "panel",
+  text: "Custom Panel",
+  icon: "/profoundui/proddata/images/panels/Custom Panel/icon.png",
+  
+  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
+  proxyHeight: 100,
+  proxyWidth: 200,
+  proxyHTML: function(defaults) {
+    return pui.widgets.getPanelProxy(defaults);
+  },
+  
+  // additional default property values can be specified here
+  defaults: {
+    "panel style": "Custom Panel",
+    "color": "#000000"
+  }  
+  
+});
+
+

package/htdocs/profoundui/userdata/custom/widgets/styled_button.js

@@ -1,71 +1,71 @@
-
-
-// Example - creating a gradient / styled button
-
-// Add a new button style
-// This will appear as an option in the "button style" property of a styled button
-
-pui.widgets.buttonStyles["Custom Button"] = {
-
-  // width of the left side of the button (should match the width of the images provided in the /images/buttons/ folder)
-  left: 23,
-  
-  // width of the right side of the button (should match the width of the images provided in the /images/buttons/ folder)  
-  right: 23,
-  
-  // height of the top side of the button (should match the height of the images provided in the /images/buttons/ folder)
-  top: 10,
-  
-  // height of the bottom side of the button (should match the height of the images provided in the /images/buttons/ folder)
-  bottom: 10,
-  
-  // determines if the button has a separate set of images for when the user hovers the mouse over it
-  hasOverState: false,
-  
-  // determines if the button has a separate set of images for when the user clicks it
-  hasClickState: false,
-  
-  // color of text within the button
-  textColor: "#000000",
-  
-  // edit box background color used in inline editing within the visual designer    
-  editBackgroundColor: "#eca430",
-  
-  // default button width
-  width: 125
-  
-  // optional parameters...
-  //clickStateIsNormalState:    // set to true if the click state images are the same as the normal state images 
-  //hiColor:                    // highlight color
-}
-
-
-
-
-// Now, add an entry to the Widgets Toolbox
-pui.toolbox.add({
-  // specifies category - this can be an existing category or a new one
-  // if the category does not exist, it is created on the fly
-  category: "Custom Widgets",
-  
-  widget: "styled button",
-  text: "Custom Styled Button",
-  icon: "/profoundui/proddata/images/buttons/Custom Button/icon.png",
-  
-  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
-  proxyHeight: 23,
-  proxyWidth: 125,
-  proxyHTML: function(defaults) {
-    return pui.widgets.getStyledButtonProxy(defaults);
-  },
-  
-  // additional default property values can be specified here
-  defaults: {
-    "button style": "Custom Button",
-    "width": "125px",
-    "color": "#000000"
-  }  
-  
-});
-
-
+
+
+// Example - creating a gradient / styled button
+
+// Add a new button style
+// This will appear as an option in the "button style" property of a styled button
+
+pui.widgets.buttonStyles["Custom Button"] = {
+
+  // width of the left side of the button (should match the width of the images provided in the /images/buttons/ folder)
+  left: 23,
+  
+  // width of the right side of the button (should match the width of the images provided in the /images/buttons/ folder)  
+  right: 23,
+  
+  // height of the top side of the button (should match the height of the images provided in the /images/buttons/ folder)
+  top: 10,
+  
+  // height of the bottom side of the button (should match the height of the images provided in the /images/buttons/ folder)
+  bottom: 10,
+  
+  // determines if the button has a separate set of images for when the user hovers the mouse over it
+  hasOverState: false,
+  
+  // determines if the button has a separate set of images for when the user clicks it
+  hasClickState: false,
+  
+  // color of text within the button
+  textColor: "#000000",
+  
+  // edit box background color used in inline editing within the visual designer    
+  editBackgroundColor: "#eca430",
+  
+  // default button width
+  width: 125
+  
+  // optional parameters...
+  //clickStateIsNormalState:    // set to true if the click state images are the same as the normal state images 
+  //hiColor:                    // highlight color
+}
+
+
+
+
+// Now, add an entry to the Widgets Toolbox
+pui.toolbox.add({
+  // specifies category - this can be an existing category or a new one
+  // if the category does not exist, it is created on the fly
+  category: "Custom Widgets",
+  
+  widget: "styled button",
+  text: "Custom Styled Button",
+  icon: "/profoundui/proddata/images/buttons/Custom Button/icon.png",
+  
+  // this determines the look of the drag/drop proxy as we drag the widget element off the toolbox
+  proxyHeight: 23,
+  proxyWidth: 125,
+  proxyHTML: function(defaults) {
+    return pui.widgets.getStyledButtonProxy(defaults);
+  },
+  
+  // additional default property values can be specified here
+  defaults: {
+    "button style": "Custom Button",
+    "width": "125px",
+    "color": "#000000"
+  }  
+  
+});
+
+