{"id":1110,"date":"2016-11-02T22:23:00","date_gmt":"2016-11-03T03:23:00","guid":{"rendered":"http:\/\/rpchurchill.com\/?p=1110"},"modified":"2017-02-03T14:29:31","modified_gmt":"2017-02-03T19:29:31","slug":"a-simple-discrete-event-simulation-part-35","status":"publish","type":"post","link":"https:\/\/rpchurchill.com\/wordpress\/posts\/2016\/11\/02\/a-simple-discrete-event-simulation-part-35\/","title":{"rendered":"A Simple Discrete-Event Simulation: Part 35"},"content":{"rendered":"<p>Today I finished mods to the DisplayGroup object that allows it to be set up to hide itself a set amount of time after one or more displayed variables change.<\/p>\n<p>We begin with the code that now includes the requisite timing mechanisms.  The <code>turnOn<\/code> method makes the display visible when it is invoked following a change in a displayed value.  The <code>turnOff<\/code> method sets the visibility back to false unless a more recent timer has been started.  The <code>setVisibility<\/code> method allows the visibility to be initialized to false (the default is true).<\/p>\n<pre class=\"toolbar-overlay:false wrap:false height-set:true lang:default decode:true \">\r\n    function DisplayGroup(label,x,y,vw,lc,vc,bc,displayDelay) {\r\n      this.label = label;\r\n      this.xLocation = x;\r\n      this.yLocation = y;\r\n      this.valueWidth = vw;\r\n      this.labelColor = lc;\r\n      this.valueColor = vc;\r\n      this.borderColor = bc;\r\n      this.displayDelay = displayDelay;\r\n      if (this.label.length > 0) {\r\n        this.labelHeight = 12;\r\n      } else {\r\n        this.labelHeight = 0;\r\n      }\r\n      this.visible = true;\r\n      this.endDisplayTime = 0.0;\r\n      this.turnOn = function() {\r\n        this.visible = true;\r\n        this.endDisplayTime = globalSimClock + this.displayDelay;\r\n        feq.newItem(this.endDisplayTime,this,\"turnOff\");\r\n      };\r\n      this.turnOff = function() {\r\n        if (globalSimClock >= this.endDisplayTime) {\r\n          this.visible = false;\r\n        }  \/\/else a more recent value is in play and waiting to time out\r\n      };\r\n      this.setVisibility = function(visible) {\r\n        this.visible = visible;\r\n      };\r\n      this.maxLabelWidth = 0;\r\n      this.valueCount = 0;\r\n      this.valueList = []; \/\/new Array();\r\n      this.define = function(label,x,y,vw,lc,vc,bc) {\r\n        \/\/used to define outside of an object\r\n        this.label = label;\r\n        this.xLocation = x;\r\n        this.yLocation = y;\r\n        this.valueWidth = vw;\r\n        this.labelColor = lc;\r\n        this.valueColor = vc;\r\n        this.borderColor = bc;\r\n        if (this.label.length > 0) {\r\n          this.labelHeight = 12;\r\n        } else {\r\n          this.labelHeight = 0;\r\n        }\r\n      };\r\n      this.addValue = function(value,label,format,places) {\r\n        var tempValue = '';\r\n        if (typeof value === \"function\") {\r\n          tempValue = value.call(tempValue);\r\n        } else {\r\n          tempValue = value;\r\n        }\r\n        var v = new DisplayValue(tempValue,label,format,places);\r\n        this.valueList.push(v);\r\n        this.valueCount++;\r\n        globalCTX.font = \"12px Arial\";\r\n        var w = v.getWidth();\r\n        if (w > this.maxLabelWidth) {\r\n          this.maxLabelWidth = w;\r\n        }\r\n      };\r\n      this.drawBasic = function() {\r\n        if (this.visible) {\r\n          this.height = (this.valueCount * 12) + this.labelHeight + 3;\r\n          this.width = this.maxLabelWidth + this.valueWidth + 8;\r\n          globalCTX.strokeStyle = this.borderColor;\r\n          globalCTX.beginPath();\r\n          globalCTX.moveTo(this.xLocation+0.5,this.yLocation+0.5);\r\n          globalCTX.lineTo(this.xLocation+this.width+0.5,this.yLocation+0.5);\r\n          globalCTX.lineTo(this.xLocation+this.width+0.5,this.yLocation+this.height+0.5);\r\n          globalCTX.lineTo(this.xLocation+0.5,this.yLocation+this.height+0.5);\r\n          globalCTX.lineTo(this.xLocation+0.5,this.yLocation+0.5);\r\n          globalCTX.stroke();\r\n          globalCTX.font = \"12px Arial\";\r\n          globalCTX.fillStyle = this.labelColor;\r\n          if (this.label.length > 0) {\r\n            globalCTX.textAlign = \"center\";\r\n            globalCTX.fillText(this.label,this.xLocation+(this.width*0.5),this.yLocation+12);\r\n          }\r\n          globalCTX.textAlign = \"right\";\r\n          for (var i=0; i<this.valueCount; i++) {\r\n            var l = this.valueList[i].label;\r\n            var x = this.xLocation+this.maxLabelWidth+5;\r\n            var y = this.yLocation+(i*12)+this.labelHeight+12;\r\n            \/\/globalCTX.fillText(valueList[i].label,this.xLocation+this.maxLabelWidth+3,this.yLocation+(i*12)+12);\r\n            globalCTX.fillText(l,x,y);\r\n          }\r\n          globalCTX.fillStyle = this.valueColor;\r\n          globalCTX.textAlign = \"left\";\r\n          for (i=0; i<this.valueCount; i++) {\r\n            this.valueList[i].drawValue(this.xLocation+this.maxLabelWidth+8,this.yLocation+(i*12)+this.labelHeight+12);\r\n          }\r\n        }\r\n      };\r\n      this.activate = function(nextState) {\r\n        if (nextState == \"turnOn\") {\r\n          this.turnOn();\r\n        } else if (nextState == \"turnOff\") {\r\n          this.turnOff();\r\n        } else {\r\n          errorUndefinedAdvanceState(this.entityID,this.nextState);\r\n        }      \r\n      };  \/\/this.activate\r\n    }  \/\/DisplayGroup\r\n<\/pre>\n<p>Here is the code used to initialize a display object in timing mode.  This setup makes use of the fact that the <code>updateValue<\/code> methods for the individual display items can detect whether the values they point to have changed.  Note that we can choose which variables can drive visibility changes when they are modified.<\/p>\n<pre class=\"toolbar-overlay:false wrap:false height-set:true lang:default decode:true \">\r\n    var queue1DataGroupEntry = new DisplayGroup(\"\",175,118,80,\"#00FFFF\",\"#FF0000\",\"#FFFF00\",2.0);\r\n    queue1DataGroupEntry.setVisibility(false);\r\n    gtemp = queue1.getEntryEntityID();\r\n    queue1DataGroupEntry.addValue(gtemp,\"Entry ID\",\"integer\");\r\n    gtemp = queue1.getEntryTime();\r\n    queue1DataGroupEntry.addValue(gtemp,\"Entry Time\",\"numdec\",5);\r\n    function queue1DataGroupEntryUpdate() {\r\n      var temp = queue1.getEntryEntityID();\r\n      var updated0 = queue1DataGroupEntry.valueList[0].updateValue(temp);\r\n      var temp = queue1.getEntryTime();\r\n      var updated1 = queue1DataGroupEntry.valueList[1].updateValue(temp);\r\n      if (updated0 || updated1) {\r\n        queue1DataGroupEntry.turnOn();\r\n      }\r\n    }\r\n<\/pre>\n<p>Finally, here's how the updates are called in the main event loop.<\/p>\n<pre class=\"toolbar-overlay:false wrap:false height-set:true lang:default decode:true \">\r\n      queue1DataGroupEntryUpdate();\r\n      queue1DataGroupEntry.drawBasic();\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Today I finished mods to the DisplayGroup object that allows it to be set up to hide itself a set amount of time after one or more displayed variables change. We begin with the code that now includes the requisite &hellip; <a href=\"https:\/\/rpchurchill.com\/wordpress\/posts\/2016\/11\/02\/a-simple-discrete-event-simulation-part-35\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[60],"tags":[121,49],"_links":{"self":[{"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/posts\/1110"}],"collection":[{"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/comments?post=1110"}],"version-history":[{"count":1,"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/posts\/1110\/revisions"}],"predecessor-version":[{"id":1112,"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/posts\/1110\/revisions\/1112"}],"wp:attachment":[{"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/media?parent=1110"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/categories?post=1110"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rpchurchill.com\/wordpress\/wp-json\/wp\/v2\/tags?post=1110"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}