tag:blogger.com,1999:blog-34035888999767301422024-02-08T11:56:37.113-08:00Doug EstepLessons learned from over 20 years of software development mixed with a bit of useless dribble and ramblings along the way. Doug Estephttp://www.blogger.com/profile/09384201692326862714noreply@blogger.comBlogger2125tag:blogger.com,1999:blog-3403588899976730142.post-16109970651291724212017-11-16T06:06:00.000-08:002017-11-16T06:11:21.680-08:00Java Class Labs<br />
<h2>
<br class="Apple-interchange-newline" />Lab 1</h2>
<h2>
<div style="font-size: medium; font-weight: normal;">
1) Create a method that accepts an int parameter. Within the method add 1 to the int parameter and print the value.</div>
<div style="font-size: medium; font-weight: normal;">
<br /></div>
<div style="font-size: medium; font-weight: normal;">
<span style="font-family: "courier new" , "courier" , monospace;">private static void bumpOneByValue(int number) {</span></div>
<div style="font-size: medium; font-weight: normal;">
<span style="font-family: "courier new" , "courier" , monospace;"> // TODO add one to the value and print it</span></div>
<div style="font-size: medium; font-weight: normal;">
<span style="font-family: "courier new" , "courier" , monospace;">}</span></div>
</h2>
<h2>
<div style="font-size: medium; font-weight: normal;">
2) Create a method that accepts an int[] parameter. Within the method add 1 to the first element in the array and print the first element.</div>
</h2>
<h2>
<div style="font-size: medium; font-weight: normal;">
<span style="font-family: "courier new" , "courier" , monospace;">private static void bumpOneByReference(int[] numbers) {</span></div>
<div style="font-size: medium; font-weight: normal;">
<span style="font-family: "courier new" , "courier" , monospace;"> // TODO add one to the first element in the array and print the element</span></div>
<div style="font-size: medium; font-weight: normal;">
<span style="font-family: "courier new" , "courier" , monospace;">}</span></div>
</h2>
<h2>
<div style="font-size: medium; font-weight: normal;">
</div>
<div style="font-size: medium; font-weight: normal;">
3) Within the public static void main method, add the following:</div>
<div style="font-size: medium; font-weight: normal;">
<br /></div>
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;">public static void main(String[] args) {</span></span><br />
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;"> int number = 51;</span></span><br />
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;"> bumpOneByValue(number);</span></span><br />
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;"> System.out.println("By value return from method call = " + number);</span></span><br />
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;"><br /></span></span>
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;"> int[] numbers = { 51 };</span></span><br />
<span style="font-family: "courier new" , "courier" , monospace;"><span style="font-size: small;"><span style="font-weight: normal;"> bumpOneByReference(</span></span><span style="font-size: small; font-weight: normal;">numbers</span><span style="font-size: small;"><span style="font-weight: normal;">);</span></span></span><br />
<span style="font-family: "courier new" , "courier" , monospace;"><span style="font-size: small;"><span style="font-weight: normal;"> System.out.println("By reference return from method call = " + </span></span><span style="font-size: small; font-weight: normal;">numbers</span><span style="font-size: small;"><span style="font-weight: normal;">[0]);</span></span></span><br />
<span style="font-family: "courier new" , "courier" , monospace; font-size: small;"><span style="font-weight: normal;">}</span></span><br />
<br />
<span style="font-size: small;"><span style="font-weight: normal;">Run the lab. You should see the original 51 number stay the same after the call to bumpOneByValue. You should see the original 51 go to 52 after the call to bumpOneByReference.</span></span><br />
<div>
<h2 style="-webkit-text-stroke-width: 0px; color: black; font-family: Times; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; letter-spacing: normal; orphans: 2; text-align: start; text-decoration-color: initial; text-decoration-style: initial; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">
</h2>
</div>
</h2>
<div>
<span style="font-size: small;"><span style="font-weight: normal;"><br /></span></span></div>
<h2 style="-webkit-text-stroke-width: 0px; color: black; font-family: Times; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; letter-spacing: normal; orphans: 2; text-align: start; text-decoration-color: initial; text-decoration-style: initial; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">
Lab 2</h2>
<br />
<span style="font-family: "courier new" , "courier" , monospace;">String[] states = {"California", "Wyoming", "West Virginia", "Virginia", "Alaska", "Colorado", "Connecticut", "Delaware", "Florida", "Georgia", "Hawaii", "Idaho", "Illinois", "Indiana", "Iowa", "Kansas", "Kentucky", "Louisiana", "Maine", "Maryland", "Massachusetts", "Michigan", "Minnesota", "Mississippi", "Missouri", "Montana", "Nebraska", "Nevada", "New Hampshire", "New Jersey", "New Mexico", "New York", "North Carolina", "North Dakota", "Ohio", "Oklahoma", "Oregon", "Pennsylvania", "Rhode Island", "South Carolina", "South Dakota", "Tennessee", "Texas", "Utah", "Vermont", "Arizona", "Washington", "Arkansas ", "Wisconsin", "Alabama" };</span><br />
<br />
1) Write a program that uses a for loop to loop through the states array and print each state to the console. Put this print logic in its own method.<br />
<br />
2) Sort the array using the Arrays.sort method. See ( https://docs.oracle.com/javase/8/docs/api/java/util/Arrays.html ).<br />
<br />
3) Print the sorted array calling the print method you wrote in the first step.<br />
<br />
<br />
<h2>
Lab 3</h2>
1) Prompt the user to input a state.<br />
<br />
<span style="font-family: "courier new" , "courier" , monospace;">Scanner scanner = new Scanner(System.in);</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">String state = scanner.next();</span><br />
<div>
<br /></div>
2) Search the array using the Collections.binarySearch() method and print the returned index.<br />
<br />
- The Collections.binarySearch() method returns the index within the array where the state is located. If the input is not found in the array, then Collections.binarySearch() prints a negative value. Print the output from Collections.binarySearch().<br />
<br />
<b>- YOU MUST</b> sort your array before calling the binary search.<br />
<br />
- The binary search method expects a Collection to supplied to it (not an array). Because of this, you can use the Arrays.asList() method to convert your array to a Collection.<br />
<br />
<span style="font-family: "courier new" , "courier" , monospace;">// states is the array containing the state names</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">// state is the state name inputed by the user</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">int index = Collections.binarySearch(Arrays.asList(states), state);</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">System.out.println(index);</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">if (index < 0) {</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"> System.out.println("Not found");</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">} else {</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"> System.out.println("Found at " + index + ". " + states[index]);</span><br />
<span style="font-family: "courier new" , "courier" , monospace;">}</span><br />
<div>
<br /></div>
<br />
<br />
<br />Doug Estephttp://www.blogger.com/profile/09384201692326862714noreply@blogger.com0tag:blogger.com,1999:blog-3403588899976730142.post-45560112907109499692013-01-27T10:40:00.000-08:002013-01-27T10:40:04.447-08:00How to Fully Disable Page Content using jQueryYou may think that disabling elements on an HTML page is as simple as assigning <code>disabled=”true”</code> to every element or by invoking a jQuery selector such as <code>$(“input”).attr(“disabled”,”true”);</code>, but it’s not that simple. What about links or click events assigned to elements inside the content being disabled? When disabling content on a page, you may not want those links or clickable elements to function anymore. This post will review what is needed to disable all input elements within a container (such as a DIV) so that nothing can be entered or clicked.<br />
<h2>
Selecting Elements to Disable</h2>
In order to disable every element contained within a container, including events, you need to recursively selected all elements inside the container, iterate through each selected element, and disable each element. To do so, you will need to use the jQuery <code>find()</code> method to select all elements. Taken from the jQuery API page, <i>“Given a jQuery object that represents a set of DOM elements, the .find() method allows us to search through the descendants of these elements in the DOM tree and construct a new jQuery object from the matching elements.”</i>. Use the <code>find()</code> method with caution. Using the <code>find()</code> method to recursively traverse very busy DOM’s can result in poor performance.<br />
Assuming you are disabling all elements inside a <code>DIV</code> identified by “myData”, the following jQuery code will select all elements in the <code>DIV</code>. If you are not interested in disabling everything, you can limit your search by providing the appropriate selector to the <code>find()</code> method. For example, <code>find(“:input,:button”)</code> selects only <code>INPUT</code> type elements and button elements.
<br />
<pre><code>
// selects all elements inside the DIV
$(“div#myData”).find(“*”).each(function(index) {
// each iteration in the loop will find
// one element to disable
var inp = $(this);
…
});
</code></pre>
<h2>
Disabling Each Element within the Loop</h2>
Not all elements are disabled in the same manner. Some elements are disabled by simply adding the attribute, <code>disabled=”true”</code>, and others require additional logic to prevent any event assigned to the element from firing.
<br />
The first thing to do is determine what the type of element that is being disabled. To do so, the <code>type</code> attribute is retrieved from the element. If the element has a value for the <code>type</code> element, then use the <code>tagName</code> value on the <code>type</code> element as the type of element.
<br />
<pre><code>
// for each iteration in the loop will find one
// element to disable
var inp = $(this);
// determine the type of element being disabled.
var type = inp.attr("type");
if (type == undefined) {
if (inp[0] == undefined) {
type = "";
} else {
type = inp[0].tagName.toLowerCase();
}
}
</code></pre>
<b>Anchors</b>
<br />
For anchors, we need to remove all events and prevent anything from happening when the user clicks the link. In order to enable the element successfully in a future action, we need to save the events before removing them. Finally, we style the anchor to look disabled. For this article, I’ll use the CSS class offered by the jQuery UI themes. The contents of the <code>ui-state-disabled</code> CSS class can be found at the bottom of this article.
<br />
<pre><code>
// disable all events (see function below)
disableEvents(inp);
var href = inp.attr("href");
if (href != undefined) {
// save the HREF attribute value and remove the value
inp.data(“disabler-anchor-href”, href);
inp.attr("href", "#");
}
// a click event which performs no action
inp.on("click", function(e) {
e.preventDefault();
});
// make the anchor look disabled
inp.addClass(“ui-state-disabled”);
</code></pre>
Disabling the events requires us to retrieve the array of events associated to the element. jQuery adds an “events” data map attribute on the element when the first event is registered. One event can have many handlers. For each event defined on the element, loop through each handler and save the event and handler in order to be re-applied if the element is enabled in a future action. Finally, remove the event by unbinding it.
<br />
In order to facilitate reuse, I made this into a function.<br />
<pre><code>
function disableEvents(inp) {
// jQuery adds an "events" data attribute on the
// element when events are registered
var events = inp.data("events");
if (events != undefined) {
var savedEvents = [];
// loop through each event found on the element...
$.each(events, function(eventName, handlers) {
$.each(handlers, function(index) {
var handler = handlers[index];
if (handler != undefined) {
// save the event and handler
var eventObj = {
'eventName' : eventName,
'handler' : handler
};
// save the event
savedEvents.push(eventObj);
// remove the event from the element
inp.unbind(eventName);
}
});
});
// store the saved events as a data attribute
// on the element
inp.data(“disabler-saved-events”, savedEvents);
}
}
</code></pre>
<b>Submit buttons and Button Elements</b>
<br />
For input elements of type button and button elements, simply adding the attribute disabled=”true” will disable the element and prevent the element from being clicked.
<br />
<pre><code>
if (type == "submit" || type=="button") {
inp.attr("disabled", "true");
}
</code></pre>
<b>Labels</b>
<br />
Since label elements is just text, simply assigning a CSS class to make the label look disabled will suffice.
<br />
<pre><code>
else if (type == "label") {
inp.addClass("ui-state-disabled");
}
</code></pre>
<b>Select Element, Check Boxes, and Radio Buttons</b>
<br />
For HTML select boxes, check boxes, and radio buttons, all events need to be removed (like was done with anchors) and we need to add the disabled=”true” attribute.
<br />
<pre><code>
else if (type == "select" || type == "checkbox"
|| type == "radio") {
disableEvents(inp);
inp.attr("disabled", "true");
}
</code></pre>
<b>Input (type=”text”) and TextArea boxes</b>
<br />
For input and textarea elements, add the disabled=”true” and readonly=”readonly” attributes.
<br />
<pre><code>
else if (type == "text" || type == "textarea") {
inp.attr("disabled", "true");
inp.attr("readonly", "readonly");
}
</code></pre>
<b>All Other Elements</b>
<br />
For all other elements, simply remove all events.<br />
<pre><code>
else {
disableEvents(inp);
}
</code></pre>
<h1>
How to Enable the Content that was disabled</h1>
To enable content that was previously disabled by the method described in this article, select all elements in the same manner that was applied when the elements were disabled and essentially reverse what we did when we disabled the element.
<br />
<pre><code>
$(“div#myData”).find(“*”).each(function(index) {
var inp = $(this);
…
});
</code></pre>
<h2>
Anchors</h2>
Unbind the event put on the element when the element was disabled (which prevented any action when clicked).<br />
<pre><code>
// unbind event put on by disable function
inp.unbind();
</code></pre>
Restore the events that were saved off when disabled. In order to facilitate reuse, I made this into a function.
<br />
<pre><code>
// put back all events removed when disabled
enableEvents(inp);
</code></pre>
Restore the HREF removed when disabled.
<br />
<pre><code>
// put back the HREF removed when disabled
var href = inp.data(“disabler-anchor-href”);
if (href != undefined) {
inp.attr("href", href);
inp.removeData(“disabler-anchor-href”);
}
</code></pre>
Remove the CSS class which makes the anchor look disabled.<br />
<pre><code>
inp.removeClass(“ui-state-disabled”);
</code></pre>
Loop through all events saved on the element before disabled. For each saved event, add the event back to the element.
<br />
<pre><code>
function enableEvents(inp) {
var savedEvents = inp.data(“disabler-saved-events”);
if (savedEvents != undefined) {
// loop through each saved event and register
// events on the element.
$.each(savedEvents, function(index) {
var savedEvent = savedEvents[index];
var eventName = savedEvent.eventName;
var handler = savedEvent.handler;
inp.on(eventName, handler);
});
}
}
</code></pre>
<b>Submit buttons and Buttons</b>
<br />
For input elements of type button and button elements, remove the disabled attribute.
<br />
<pre><code>
if (type == "submit" || type=="button") {
inp.removeAttr("disabled");
}
</code></pre>
<b>Labels</b>
<br />
Remove the CSS class which makes the label look disabled.<br />
<pre><code>
else if (type == "label") {
inp.removeClass("ui-state-disabled");
}
</code></pre>
<b>Select Element, Check Boxes, and Radio Button Elements</b>
<br />
For HTML select boxes, check boxes, and radio buttons, restore all events that were removed and remove the CSS class which makes the element look disabled.
<br />
<pre><code>
else if (type == "select" || type == "checkbox"
|| type == "radio") {
enableEvents(inp);
inp.removeAttr("disabled”);
}
</code></pre>
<b>Input (type=”text”) and textarea boxes</b>
<br />
For HTML select boxes, check boxes, and radio buttons, restore all events that were removed and remove the CSS class which makes the element look disabled.
<br />
<pre><code>
else if (type == "text" || type == "textarea") {
inp.removeAttr("disabled");
inp.removeAttr("readonly");
}
</code></pre>
<b>All Other Elements</b>
<br />
For all other elements, restore all events that were removed when disabled.<br />
<pre><code>
else {
enableEvents(inp);
}
</code></pre>
<h1>
CSS</h1>
You can use the CSS values for making an element looked disabled.
<br />
<pre><code>
.ui-state-disabled {
cursor: default !important;
opacity: .35;
filter:Alpha(Opacity=35);
background-image: none;
}
</code></pre>
<h1>
jQuery Disabler</h1>
If this seems like a lot, you’re in luck. I created a jQuery plugin that can completely disable or present a read-only view of the content on your page. The plugin uses the code outlined and described in this article. You are free to use it as-is or take the code and use the code in your scripts.
<br />
With Disabler, your code will be as simple as this…
<br />
<pre><code>
$("div#myData").disabler({
disable : true
});
</code></pre>
You can find Disabler on the jQuery plugins site<br />
( <a href="http://plugins.jquery.com/disabler">http://plugins.jquery.com/disabler</a> ) or directly on my site at <br />
( <a href="http://dougestep.com/dme/jquery-disabler-widget">http://dougestep.com/dme/jquery-disabler-widget</a> ).
Doug Estephttp://www.blogger.com/profile/09384201692326862714noreply@blogger.com0