From static frames to animation – JavaScript, Java & Processing; coding Art ….

As part of my research, I endeavored to build a frame and tile itevenly…as you would a column in a upscale restaurant, or as Billy-Buster tiled his lesser-known below-ground pool in the hilltop paradise above San Simeon. Drawing squares, keeping track of their quantity, position and spacing proved unweildy. So back to the drawing board I turned. The first task was to completely fill a window with squares, evenly spaced, uniformed – no holes. My first breakthrough was a rectangular grid – from the drawing board I found that instead of looping to keep track of the squares (their origins in CGI coordinates space, their quantity, when to drop down a row, when to stop building them…) oy! I located a KISS-simple solution in the following functions and abstract data types:

Click to see it transform.
Some tweaks to a nested-for loop, appropriate “pops” nee popMatrix(); and the careful application of a “random” number generator to produce cool-colored tiles —but not TOO cool — experiment yielded a random range in Green and Blue to give the tiles a watery sheen, sans magenta, indigo, dark purple and the like. For personal intersest and further research I added a mouse event that slows down the animation, eliminates the thin black borders on each tile and zooms in on the whole operation.
At long last “Random dynamic & cool tiles” is up for public consumption:
I could see a pool in Laguna, LA, Vegas or Laughlin with swanky, swarthy, light-up tiles in a pool or on a wall of it’s club …. Bill R. Hearst would be pleased…I like to think so.
Next – I thought about Neil Degrasse Tyson. He says that the “snow” we see on the “TV channels in-between TV channels,” (something our Millennial friends may never fully appreciate…) is ACTUALLY a visual representation of the background radiation that’s permeated the Universe since the Big Bang. UHF & VHF cathode-ray displays pick up this noise and spit out the “ssshhhhhhhh” and the black, white & gray snow we may’ve found on Channel 1 or 3. Mostly, it was annoying and caused us to quickly dial up to CBS, PBS, NBC, FOX or ABC to see what was cookin’….but in the context of nostalgia, the scientific implication of looking back seven trillion years; this “snow” is worth an emulation. Using similar logic I fashioned version 1. The snow doesn’t dance around the screen, but the small circular “flakes” and the way they appear to move based on random gray-scale shadings is a nice start. It looks like they move – kinda.
^^^^I slowed the frame rate down to avoid headaches.
After random “cool” I had to attempt random “warm” –this graphic reminds me of a HollyWood or Vegas marquee. Bright lights seize attention; underscoring the glitz and glamour purported to be found within. The difference is that I think the bulbs this animation emulates are controlled in strict, looping sequences as opposed to my random flashes of “bright” colors controlled by logic.
This animation reminds me of the “Sushi”scene from “Defending Your Life” — Albert Brooks’ barmate proudly states that his life accomplishment was coining the phrase “All Nude. (You know those strip clubs out by LAX? ….“) You needn’t be a fan of his quirky brand of humor to get huge kick out this classic.
That said, I FINALLY got the computer graphic programs to not only display but animate! The “random- (random number generators are not TRULY random, but they are close)-ness” of the algorithms give the displays a kind of innate ability for the computers to create something of THEIR OWN — MY LOGIC & Design—> the computers’ brushstrokes.
All of the “sketches” (as they call them) on my new OpenProcessing Profile are completely original – designed, built, tested, tweaked and deployed by this writer. If you visit my new page & graphics, the source code is easily visible. Feel free to reproduce it yourself, or make changes/improvements to it. You will find that all of them are optimized –nee “code-golfed.” I designed these algorithms to use the fewest lines of code, fewest commands and simplest logic to add a layer of mathematical elegance to the aesthetic of each sketch. Please feel free to download my source code…just plz note that all of them are intellectual property- if you plan to use them in a public/educational or commercial setting…just ask! chris@tapper7.com
More coming soon….plus a litany of fresh podcasts – “I swear it by the old gods & the new.” -t []

More fun with Java 1.8 -ASCII “Art” 101 using Arrays….

This is the type of assignment I would hand out to first year programming students. After introducing the idea of lists, I implore them to solve the following:
Use a list to build an ASCII pyramid using the character of your choice and make it: a) appear “pyramidal” that is, no leaning, no right-angles at the base and give it some semblance of aesthetic quality b) your logic should generate EVERY level of the pyramid, that is, no coding “special cases” for the top, middle or bottom rows. The logic must hold sound to construct the entire pyramid as a stand-alone algorithm. c) print your src (source code) and the output of your program to prove to peers that it works.

    This task requires careful dissection of the elements involved:

  • variable number of rows
  • each row knows how many spaces to print and how many characters
  • this involves logical analysis for the left spaces, the chars AND the right spaces
  • The algorithm must know when to “endline”/”newline”/
  • Careful analysis and monitoring (QA/QC) of the variables during runtime may be needed

For the seasoned programmer this is fairly basic, but involves core mathematical concepts, an element of basic aesthetic design and a good grip on list variable storage; how they are both computed and sent to an output stream (System.out in this case) This is the rough equivalent of “cout <<” for you C/C++ guys

    For extra credit:

  • Add a user-interface to ask the user how big to build the pyramid. Include exception-handling for pyramid sizes that are not technically “pyramids” (height = 1 is not a pyramid) heights too large will lose their aesthetic, or their pyramidal structure entirely if built too large or too impractical for the user’s display. (I capped mine at 50 rows) – add warnings depending on the user interface).
  • Decorate the pyramid with one or more random characters in addition to your “foundation” block (I used hashtags for my foundation block).
  • Invert the pyramid.
  • Stack the pyramid atop the inverted one to make a diamond shape…make sure it lines up evenly. No bumps or other strangeness in the middle.

Here is a sample solution; note that I carefully tracked line size, space, building-block-count, row-count & the storage of each…this is crucial to accuracy and QC testing during development time.
This is an acceptable output:

a snap of the pyramid program in-process using the Netbeans IDE
seen w/in the Netbeans Integrated Development Environment. “I design them.”

 

Here is the source code – note brevity in my solution– ~20 lines-ungolfed!:
/*
author: Chris "Tapper" Welke
This program generates an ASCII-art 50 row pyramid using hashtags as a building block.
Solution provided for instructional/informational purposes in the areas of lists,
integers, type-casting, dynamic memory allocation, and open-source programming. If you
are new to Java, this is an excellent trial pgm to get you started.
Dist. under the GNU Public License. Free to distribute: please attribute though, ok?:
Last Stable Build: 5/23/15 at Tapper7.com and Self-Similarity Studios courtesy
The Netbeans (Netbeans.org) IDE, Java 1.8 and the std. javac compiler
OS: Win 8.1, Chipset by Intel. Laptop by Hewlett-Packard. Website provided by Media Temple
*/
package learn;
import java.util.Arrays;
public class HashTagASCIIPyramid{
protected static int charlinelength = 100;
public static void main(String[] arg){
float[] asciiStorage = new float[HashTagASCIIPyramid.charlinelength];
int totalHashtags = 1; //initialize builing block total
int charCount = 0; //count building blocks for QC testing
int[] cclist = new int[100]; //record the char generation as it happens
int leftspaces = (int)asciiStorage.length/2;
int rightspaces = (int)asciiStorage.length/2;
int height = 1;
for(int i = 0; i < asciiStorage.length/2; i++){
for (int l = 0; l < leftspaces; l++){
System.out.print(" "); charCount++;
}
for (int t = 0; t < totalHashtags; t++){
System.out.print("#"); charCount++;
}
for (int r = 0; r < rightspaces; r++){
System.out.print(" "); charCount++;
}
System.out.print('\n');
/*QC Tracking: height++; cclist[i] = charCount;*/
leftspaces--; totalHashtags +=2;rightspaces--;
}//end mn loop
}//end mn
}//end class #asciipyramid

Hints: I used space-fillers for the spaces (” “); – left and right brackets plus lots of variable outputs to see what was going on during run-time, my initial design yielded the following output:
run:
pyramid test1
WHOOPS!
Heh…so clearly there were multiple logic faults, (and I started with tildas, not hashtags….) but it was easy to track the movement of the left and right brackets that debugged the left and right SPACES and not shown are my debugging outputs that checked the length of each row for consistency(it was going over and under 100 – keeping the length of each row equivalent was key to my particular legitimate solution)— also that my iterators and arrays were misplaced and thus not controlling and the output correctly.

    Keys to victory:

  1. increment blocks by TWO; not one
  2. decrement spaces and increment blocks OUTSIDE the main loop rightSpaces--;leftSpaces--totalHashtags+=2;

Coming soon: Bill’s adventures at Los Alamos, More Netbeans experiments, tutorials and anything interesting that happens when I have my camera on me.

Lots of great ideas in the works…and let us not forget: Summer is Coming …. Go Santa Clara and Concord! Support your local drum corps by playing bingo, going to shows, donating your time, tailgating at shows and screaming your lungs out when corps brings you to it on the Field of Honor. All signs point to a another stellar season for Red and Blue Banners both; and I wouldn’t have it any other way (scratch that….I’d resurrect Bridgemen, Suncoast, Big 27, Star, Kingsmen, The Freelancers and The Velvet Knights) THEN it’d be roll-out time.
Under the circumstances, putting all politics aside; Thank God for Rosemont, Rockford, Madison, Garfield, Bloooooo, SCV/BD, Cru, Spirit and all other remamining “Big Time DCI” corps still in the hunt, still rockin’ it…gettin ready for the only kickoff I really care about: Memorial Day Weekend. A trial by fire where those who make it through will be ready for the best summer of their lives. Hang in there kids, you got this!
Music, Tech, Art, Love and Life; find it all right here at The SoCal Picayune. Your LA/OC home for Drum Corps, Culture, tech-security, experiments and solutions, the occasional off-color joke, scam-hunting, YT highlights and the best (and worst) direct from the minds of this writer, Tapper and Bill Feynman.
Maybe a Memorial Day Anecdote will inspire itself as we begin the approach. hmmmmm…..
[] Support my sponsors! All are reviewed regularly for legitimacy by the Senior Ethics Auditor: moi

Adverts.js test -or- How to fix truncated Javascript in WP.

A picture of the www.goto.com logo

Subtitle: How to fix a WP crash remotely using FTP.

synban: script keeeps truncating right half of .js embedded content. **Update 12/14 – fixed.**
***Update Dec. 2014*** PHP Flush did the trick…thx Cuz.***

Start by dumping that theme you love so much: bad news…like me you had a few OCD breaks w/ reality and overdid the CSS/JS/HTML4-5 editing to “pretty it up” it’s ok I did it too

1. Choose a new and dressed-down theme.
2. Crack a book on CSS or goto the only free tutorial sponsored by the w3c: and use their CSS Roadmap.
3. Backup your WP data, I suggest an FTP client. You may need to contact your host-server for admin and file-swapNswitch capabilities.
4. Backup your current themes/fxns/data and style before you tear it up. One pHp syntax error and it’s CURTAINS-then you WILL need FTP to get it back up n runnin’
5. If you are not qualified; have your kid do it.

***I owe it to my sponsors to make sure they have access to all of Google’s std lib. of adTypes, so you’ll see mostly ads in this post. This is only a test but the sponsor data displayed is no less relevant.****

***Update Dec. 2014 – 728px exceeds width oftext box. WIP***
Sponsor .js test Horizontal Basic 728×90 follows:
**UPDATE**  dec2014a : 728×90 no good for posts, footer/header only. Ad removed.

Btw after all that shit Content ID put me through for no reason?
May as well fire back:
If you know how to use t0awr@ntz…script:
Xsh%>run \t ^^^^^
Xsh%>browser “HYPTXXfercntrlPrtcll// the(Yarrrrrr!!!!)DOTessee”
Xsh%>inject pr0n.getName || flick.getName || whatevuhz
Xsh%>queryDB
Xsh%>hash etz string[]* argvector V
DO: Raise middle finger in the direction of your choice.

Synchronous Advertisement Test 320×100 follows:


Asynchronous Advertisement Test 320×100 follows: 
**TEST TBC…** Special shoutout to our generous and well-respected advertisers….check ’em out…they were designed FOR you WHEN you visit MY site. The algorithm was written by Goto.com a decade ago, still in use and as close to an AI (Artificially Intelligent) program I have seen to date. GoTo retired on the settlement $ w/ Google. Plz scope out their site; I used it quite often in college.

Credit where credit is due: visit GoTo for searches and to find a nice gift for loved one.goto.com is Tapper7 approved safe, secure, honest and NOT a scam – just legit and hyper-talented webdevs.