Programming, graphics, games, media, C++, Windows, Internet and more...
Entries for tag "webdev", ordered from most recent. Entry count: 18.
# Further improvements on my website
Sat
12
Oct 2019
Have you noticed any changes on my website? Probably not - and that’s the whole point. I’ve made few improvements on the technical side of it, but it’s still working as usual. Here is a brief story of the development of my home page...
I was never a passionate web developer, but I learned a bit of some languages and technologies needed to make a web page. When I started this one in 2004, the word “blog” was already in use, but there was no “cloud”, no Node.js or Ruby on Rails. I could either buy a hosting account with PHP scripting and MySQL database on the back end, or a Linux shell account with full SSH access, which would be much more expensive. Surely I chose the first option. Besides that, there was HTML 4.01 and CSS 1 on the client’s side.
Over time, I introduced gradual improvements to my home page, including:
<table>s to more modern based on <div>s and CSS formatting. Started using HTML5. (See Changes on My Website.)For some time I thought maybe I should rewrite this whole website from scratch. Then there would be a difficult question to answer: What technology to use? I don’t know web technologies well, but I know there are many of them. I could just install WordPress or some other blogging system and somehow move all the existing content there. I could rewrite all the scripts using more modern PHP 7 or a more trendy language, like Ruby, server-side JavaScript. I could even make it all static HTML content, which would be enough for the things I have here. Then I could use some offline tool to generate those pages, or write my own. I could also use Amazon S3 to host those pages. The possibilities are endless...
Then I recalled the rule that “if it ain’t broke, don’t fix it” and thought the hosting service I now use at Domenomania.pl company is quite good with a low price for WWW + PHP + MySQL + FTP + e-mail account. I decided eventually just to improve the existing solution. Here is what I’ve changed recently:
If you have any suggestions about my website, whether its looks or technical details, please leave a comment.
Comments | #homepage #webdev Share
# Changes on My Website
Mon
28
Aug 2017
I've dedicated my free time last week to improving this website. I made it myself from scratch more than 10 years ago, using some old version of PHP, MySQL, and HTML 4.01, so it definitely needed some refresh. I introduced many changes to the code, most notably:
<div> instead of <table> and applying rules of "responsive design". By the way, I also limited maximum width of the page to make it more convenient to read on big screens.There are still things to do. The website, as well as database, still uses ISO-8859-2 codepage instead of UTF-8 (it was a standard for encoding Polish characters before Unicode became popular). The scripts still generate the page using lots of print()-s instead of some template system. But maybe I will fix that next time :)
# How to Restrict Access to Apache Server to Local Machine?
Tue
22
Aug 2017
I wanted to do some web development locally, so I installed Apache 2.2, PHP, and MySQL on my Windows 10 machine. When configuring it, I wanted to restrict access to the Apache server to two machines only - local one and another one in my local network.
The way to do it is to enable and use mod_authz_host module. In file C:\Apache2\conf\httpd.conf I needed to make sure that following line is not commented:
LoadModule authz_host_module modules/mod_authz_host.so
Then I could add appropriate directives to <Directory ...> section of this file, or alternatively use them in .htaccess file located next to files of my website.
To deny access from all addresses except my two computers, I started from this:
Order deny,allow
Deny from all
Allow from 192.168.0.21
Allow from 192.168.0.23
After restarting Apache (needed to apply any changes in configuration), I found out that I could access my website from the other computer, but not from the local one. I quickly recalled that connections to the same machine go through special loopback interface and use special address: localhost, which has IP 127.0.0.1. So I changed my configuration to this:
Order deny,allow
Deny from all
Allow from 192.168.0.21
Allow from 192.168.0.23
Allow from 127.0.0.1
It didn't work either. That's when I started to search for address where the local connection comes from, using Process Hacker - Network tab, as well as Apache log in file C:\Apache2\logs\access.log. What I found out is that the loopback connection uses IPv6, where address of localhost is: "::1" - however strange it may seem. Explanation of this format can be found here: IPv6 at Wikipedia.
Apache accepts this form of address, so following configuration finally allowed me to connect from my local computer, as well as the other computer from my network:
Order deny,allow
Deny from all
Allow from 192.168.0.21
Allow from 192.168.0.23
Allow from 127.0.0.1
Allow from ::1
Comments | #webdev #networking Share
# Nearest-Neighbor Filtering in HTML
Wed
05
Dec 2012
In 3D graphics programming, when a texture is enlarged, sampler performs filtering to interpolate between texture pixels. That's also what happens by default when an image is resized on HTML page - browser does some interpolation (e.g. bilinear or bicubic), which makes the image blurry.
What if you have a small pixel-art image and you want to show it on a web page as pixelated, not blurred? It turns out there are nonstandard CSS attributes for this. I found these two - first one is for Internet Explorer and the second one works in Firefox.
-ms-interpolation-mode: nearest-neighbor;
image-rendering: -moz-crisp-edges;
Comments | #webdev #css #html Share
# Improved RSS Feed
Sat
28
Jan 2012
I improved the script for generating news feed for my website. It now shows entire contents of my blog posts, including HTML formatting. So if you visit my blog sometimes and haven't done it yet, subscribe to my...
using some desktop or online reader, like the popular Google Reader. I use this one for some time and I like it a lot. RSS/Atom is really good technology. With it you can see unread updates from dozens of your favourite blogs in a single place and read them all without actually visiting the website.
Comments | #homepage #webdev #web Share
# Resizing Images to Generate Thumbnails in PHP
Fri
06
Jan 2012
Some time ago I came across a problem of calculating an image size for automatically generated thumbnail for gallery script coded in PHP. It required a moment's thought, so I'd like to share this algorithm. In fact there will be two algorithms.
First code scales the image down with following rules: Destination size will not exceed given thumbnail size, but the width or height can be smaller to always preserve aspect ratio. Images smaller than thumbnail size are not magnified.
Inputs:
$src_size_x, $src_size_y - Source image size.
THUMBNAIL_SIZE_X, THUMBNAIL_SIZE_Y - Constants defining thumbnail size.
Outputs:
$dst_size_x, $dst_size_y - Destination thumbnail size.
RSS Feedif( $src_size_x <= THUMBNAIL_SIZE_X && $src_size_y <= THUMBNAIL_SIZE_Y )
{
$dst_size_x = $src_size_x;
$dst_size_y = $src_size_y;
}
else
{
$dst_size_x = THUMBNAIL_SIZE_X;
$dst_size_y = (int)( $src_size_y * THUMBNAIL_SIZE_X / $src_size_x );
if( $dst_size_y > THUMBNAIL_SIZE_Y )
{
$dst_size_x = (int)( $src_size_x * THUMBNAIL_SIZE_Y / $src_size_y );
$dst_size_y = THUMBNAIL_SIZE_Y;
}
}
Second algorithm also helps with generating image thumbnails, but works differently. It assumes that destination image will always be of size (THUMBNAIL_SIZE_X, THUMBNAIL_SIZE_Y), while source iamge can be cropped to select only the center of the image if it has different aspect ratio than the thumbnail.
Inputs to this algorithm are the same, while outputs are:
$src_x, $src_y - Offset in the source image to begin copying from.
$src_w, $src_h - Size of the rectangle to select from cropped source image.
The code that uses this algorithm should then select from the source image a rectangle with left-top position ($src_x, $src_y), size ($src_w, $src_h) and copy it, with scaling and resampling, to the destination image with the size exactly (THUMBNAIL_SIZE_X, THUMBNAIL_SIZE_Y). That's what imagecopyresampled function from GD library can do. This algorithm does not handle cases where source image is smaller than thumbnail.
$src_h = $src_size_y;
$src_w = (int)( $src_h * THUMBNAIL_SIZE_X / THUMBNAIL_SIZE_Y );
if( $src_w <= $src_size_x )
{
$src_x = ( $src_size_x - $src_w ) / 2;
$src_y = 0;
}
else
{
$src_w = $src_size_x;
$src_h = (int)( $src_w * THUMBNAIL_SIZE_Y / THUMBNAIL_SIZE_X );
$src_x = 0;
$src_y = ( $src_size_y - $src_h ) / 2;
}
Comments | #webdev #algorithms #php Share
# DevMeeting and Demoscene Night
Sun
24
Jul 2011
Yesterday I attended two events related to my interests. First was about collision detection in JavaScript games, organized by Marek Pawłowski from devmeetings.pl. During this almost 12-hour workshop we could learn about JavaScript, as well as some theory of 2D collision detection and space partitioning techniques. Nothing new for me, but I liked formula of this workshop. We could learn some theory from slides, but most of the time we had some tasks to code on our laptops - first to implement a simple library for aspects in JavaScript and then to code Asteroids game, including precise collision detection and QuadTree. Most of the code for this game was ready - we were given a framework, as well as libraries with math and a class for QuadTree. Our task was to just to connect it together. I think it's a good way of teaching programming in practice.
Web technologies are not my main interest, but I like JavaScript. I even think it's the most beautiful scripting language in terms of syntax. Being able to freely draw 2D (using HTML Canvas) as well as 3D graphics (using WebGL) makes it a good technology for learning and prototyping geometry or gameplay algorithms. Marek also pointed on the DevMeeting an interesting conclusion that it's very easy to port algorithms from C/C++ to JavaScript. But on the other hand, Dab reminded me today that Lua is a scripting language with very similar features, but faster and more lightweight interpreter, so it's still better choice as a scripting language embedded in high-performance software like games.
Second event was Noc z Demosceną - Demoscene Night. It took place in Fabryka Kotłów club (former No Mercy). During that night we could see some olschool, as well as newschool demos presented on a a big screen and, what is most important, meet some nice people there. Thanks Voyager for organizing this event! It was great especially because the 3-day demoscene party RiverWash, which took place here in Warsaw in last 2 years, this year is in Łódź and I can't attend it. This night was very inspiring and now I feel like developing a technology to make a demo :)
Comments | #demoscene #webdev #javascript #math #events Share
# Hakaton - HTML5 Programming Event
Sat
16
Apr 2011
Today I was on Hakaton - a full day event organized by Google at Warsaw University of Technology. It was actually a contest in HTML5 programming. I had no previous experience in HTML5, but as a team with two other participants we scored 2nd place out of 17, won nice backpacks and books on web design :)
The theme was "Creative Science", but as always in such contests, participants just coded different stuff. Our entry is a simulation game where creatures of different species (red, green and blue) move around and do different things. Red creatures are predators - they have to eat blue ones or else they die from starvation. Blue ones try to avoid reds, eat green plants and form couples to generate offspring. Finally, green creatures do not move - they are plants, they just grow by generating new elements. Interesting situations can emerge from such simple rules. For example, sometimes only plants remain and grow infinitely, but sometimes blue creatures consume all plants and breed to a large number. We even managed to make it interactive - you can put new creatures on the map with mouse clicks. The game is coded in HTML5 and JavaScript using <canvas>. It requires a modern web browser with support for these technologies. You can play our game online here:
What I also liked was extensive use of Twitter during the party. #hakaton was second most popular hashtag in Poland today! Some screenshots:
