Posts

A Very Un-Bootstrapy Navigation

    Sometimes you have to create something against your own principles but this isn't too much of a bad design its just that doesn't have a place in the modern web. I took this code from the https://getmdl.io/ website and removed all the code not related to this feature. Also just to be clear I didn't use bootstrap to style this, the point is that this design goes against bootstrap's guidelines. However it does solve a problem for me when project managers won't listen to my suggestions. Later I will come back with angular directive on this. Solution:  https://github.com/fassetar/blog-examples/tree/gh-pages/horizontal-collapse-nav Resources https://docs.angularjs.org/api/ng/function/angular.element http://stackoverflow.com/questions/27576643/finished-loading-of-ng-include-in-angular-js https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft

Web/Game Development - Math Isn't going to be a Problem

    When I was in college I wondered how much math I would need to become a game developer. Just for one of my associate degrees I had to take calc 2 which honestly wasn't that bad, I think the physics based calc was more of a challenge but that's in the past now. The real work begins is in my career and a lot of times my math isn't what it needs to be to create a proper solution. When I was building penguins-rising I didn't have any problems with coding just solving some algebra. So I went out of my way after that project to study what I could. Terms & Studies Geometrics Orientation (vector space) Making a Rotation Matrix From Scratch - YouTube Textures Phong reflection model http://cs.jsu.edu/~leathrum/Mathlets/parapath.html created by a student that shows how graphs can be modified . Fuzzy set Algebra (of course) Vertices Vectors? Just going off my knowledge with C++ This is just a few things I've come across over the years as a devel

CSS3 Vertical Scrolling Text

    Initially I created two separate ways of implementing, both used css3. The solutions I landed on was the one that allowed me to reposition the starting point for the scrolling text. I couldn't remember the more popular name for this type of feature but it doesn't matter the title kinda explains it better. It's sorta like when I'm looking for an autocomplete feature in bootstrap and keep forgetting that its called typeahead, since my first introduction was with jquery-ui. On a final note I did create a directive in angular to handle creating the content but its not necessary for the solution. Modified someone's  code to work the way I wanted, but later I will be using this for one of my projects. Solution: https://codepen.io/anon/pen/yJqbjV Resources http://www.html.am/html-codes/marquees/css-slide-in-text.cfm Infinite loop http://stackoverflow.com/a/13309775/1265036

UI-Bootstrap Collapsible Sticky Footer

    I could have done this a lot of ways and ultimately I made it work with javascript modifying the class names. I also had to create multiple class names which I didn't like to much, I might come back and improve this but for now this is was I got. Also I call bootstrap+angularjs = ui-bootstrap, not sure if that's common sense but thought I should include it somewhere in my notes. Working Example: http://plnkr.co/edit/2N9ENlbw3bSvg1W9n0ch?p=preview This little css was key to prevent any kind of animation on the collapse, which would result in a scrollbar appearing on the body. A scrollbar can appear when the content's too long but not on the sticky foot duh! .no-animate { transition-duration: 0.0125s; } Research Angular-UI Bootstrap Collapse without animation - Stack Overflow http://jsfiddle.net/paulalexandru/Z2Lu5/  - Was looking at this to see if I could reuse it but I ended but just doing my own thing. Another way which I've seen Using a sticky

My Patco Now Runs on Firebase

   Over the past two months I've do to made a critical decision due to costs and completely redid the backend for mypatco. Of course there was breaking changes but that wasn't related to the bad reviews that came in (caused by another developer). Instead of using azure now the app is hosted on firebase which everything I need starts out for free. Key Features Free Https Later needed for Geolocations Free use of Custom Domain  *Databasing (real-time) Json type database greatly reduces time for developing with api's Static Hosting Plugins for Angular with Database Authentication The first two really sold me on the idea but the static hosting had me worried since a lot of my data was handle at the middle tier level. Pretty soon though I had my data flatten and it just made sense but the process of updating my database is still in the works luckily though not all my code had to be scraped. To get the database corrected I still have my azure code to handle th

D3js Pie Chart with Toggle for 3D/2D View

   I found an example that does this already out there however I found it on accident after playing around with the code. I know that any examples with a 3D pie-chart would help to get me started but I didn't think any example would just have a straight shot answer. Here are links to both the used example and my example to play around with the chart. Even got a cool toggle button going on! The trick is to play with the inner radius parameter in the Donut3D js file. Solution:  https://github.com/fassetar/blog-examples/tree/gh-pages/toggle-dimension-d3 Research http://bl.ocks.org/NPashaP/9994181

A Better Material UI/UX SwipeRefreshLayout Style

Image
    When I was thinking of the designs for mypatco, I decided to use a pulling down gesture to handle user requests for updating train schedules. If your not familiar with android's UI/UX jump to what the images to get what I mean. Default UI/UX The Issue with my design     At first this is what I did and where I ran into trouble with is when I was loading in the data I would use a second spinner. The pull to refresh spinner would disappear but for a split moment both spinners would be in the user's view. This was a design fail in implementation, and I didn't better design for fixing this. Material Up version   I don't like this version of the pull to refresh but I wanted to include it because I think its interesting it combines what I would call the old style of Google's spinner with a "pull to refresh" gesture. The correct way would be to use the material progress bar. The spinner used in this image is too large for its parent container an

Popular posts from this blog

UI-Bootstrap Collapsible Sticky Footer

Aspetcore: NLog with Postgresql

Installing Windows on Acer chromebook 15 cb3-532