1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
|
<!doctype html><html lang=en-us><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><link href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL69vf8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAv76+/8LBwQkAAAAAAAAAAAAAAAC+vb3/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL+9vf/Bv78JAAAAAAAAAAAAAAAAu7q6/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC7ubr/vr29CAAAAAAAAAAAy8nJAZ6foP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnqGj/6GipAoAAAAAHLjU/xcXHf/BwsL/I8XY/yPK3v8XGiD/IbjL/yPF2f8XGiD/Fxkf/yLF2f8gnK3/Fxog/62ztv8fwNf/FRcd/x271v8mz93/GRsi/xkXHf8p097/GiIp/xobIv8p0t3/KdPe/xocIv8fYmr/KNPe/xoZH/8aHCL/J87c/xy81/8VFxz/IsPZ/8zS0/8XGiD/Ir/R/yPH2/8XGiD/Fxkf/yPH2/8dd4T/GBog/yPJ3f8jyNr/uru9/xcUGv8cudb/EhITDKi5vRKlvMP/RUpOERwcHRAdOj4QHTk8EBwdHRAdNTgQHTo/EBwcHRAcHB0QSGduEKW4vf+koqQfHzg+EBqz0ewSFRv7EyMr/xq51vsTERb7ExUb+xq41fsau9j7ExUb+xiPp/sZudb7ExUb+xMVG/sZuNX/GKvI/BIUGfMdvdn/IrfL/xcaIP8n1eb/J9Dh/xkcIf8ZGR7/J8/f/xxCSv8ZGyH/J9Dg/ybQ4P8ZHCL/FSQs/yPK3/8UExj/GE1b/ybS5P8ZGB7/Ghwj/ynW5P8p2Ob/Ghwi/yWrtv8p1eH/Ghwi/xocIv8p1uT/J8XT/xkcIv8m1un/Hb7d/xUYH/8hzOr/HtHu/xcaIf8XGB//I8vi/xgxOv8XGSD/I8rg/yPK4P8XGiD/GUFL/yPP6f8SERj/Fhkh/x3A4f8AAAAAJ2f9/ydr//8mZPH/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlYu38J2v//ydo/f8AAAAAAAAAAAd8/fkFqf//Iob8sAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMY39awWr//8FfP3/AAAAAAAAAAAFm/7/SfD//wR+/f8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOB/f9B7v//BaX+/wAAAAAAAAAAQ878SAyZ/v9n1v4KAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADu9v8DDJb+/z3N/XgAAAAA3/sAAN/7AADf+wAA3/sAAAAAAAAAAAAAAAAAAN/7AAAAAAAAAAAAAAAAAAAAAAAAj/EAAI/5AACP8QAA3/sAAA==" rel=icon type=image/x-icon><title>Wireless Application Protocol and the mobile web before the web</title><meta name=description content="A little stroll down the history laneAbout two weeks ago, I watched this outstanding documentary on YouTubeSpringboard: the secret history of the first realsmartphone about the history ofsmartphones and phones in general."><link rel=alternate type=application/rss+xml title="Mitja Felicijan's posts" href=https://mitjafelicijan.com/index.xml><link rel=alternate type=application/rss+xml title="Mitja Felicijan's notes" href=https://mitjafelicijan.com/notes.xml><style>body{padding:1rem;max-width:760px;background:#fff;font-family:sans-serif;line-height:1.35rem;font-size:16px;margin:0 auto}hr{margin-block-start:1.5rem}h1,h2,h3{line-height:initial}h1{font-size:xx-large}footer{margin-block-start:2rem}cap{text-transform:capitalize}table{max-width:100%;width:100%;border-collapse:separate;border-spacing:2px;border:1px solid #000;border-left:1px solid #999;border-top:1px solid #999}blockquote{font-style:italic}table thead{background:#eee}ul.list li{padding:.2em 0}ul{line-height:1.4em}td,th{border:1px solid #000;padding:4px;border-right:1px solid #999;border-bottom:1px solid #999;text-align:left}pre{text-wrap:nowrap;overflow-x:auto;padding:0 1em;border:1px solid #dcdcdc}code{padding:0 3px;font-size:14px;border:0}pre code{line-height:1.3em}pre,code,pre *,code *{font-family:monospace}figure{margin-inline-start:0;margin-inline-end:0}figcaption{text-align:center}figcaption p{margin:.3em 0 0}img,video,audio{max-width:100%}header{display:flex;flex-direction:row;gap:3rem}nav{display:flex;gap:.75rem}nav.main{flex-grow:1}.pstatus-orange{background:gold}.pstatus-green{background:#9acd32}.pstatus-red{background:#cd5c5c}@media only screen and (max-width:600px){body{padding:15px}header{flex-direction:column;gap:1rem}a{word-wrap:break-word}}</style><header><nav class=main itemscope itemtype=http://schema.org/SiteNavigationElement role=toolbar><a href=/>Home</a>
<a href=/vault.html>Vault</a>
<a href=/mitjafelicijan.pgp.pub.txt target=_blank>PGP</a>
<a href=/curriculum-vitae.html>CV</a>
<a href=/index.xml target=_blank>RSS</a></nav></header><main role=main><article itemtype=http://schema.org/Article><h1 itemtype=headline>Wireless Application Protocol and the mobile web before the web</h1><p><cap>post</cap>, Dec 30, 2021 on <a href=https://mitjafelicijan.com>Mitja Felicijan's blog</a><div><h2 id=a-little-stroll-down-the-history-lane>A little stroll down the history lane</h2><p>About two weeks ago, I watched this outstanding documentary on YouTube
<a href="https://www.youtube.com/watch?v=b9_Vh9h3Ohw">Springboard: the secret history of the first real
smartphone</a> about the history of
smartphones and phones in general. It brought back so many memories. I never had
an actual smartphone before the Android. The closest to smartphone was <a href=https://www.gsmarena.com/sony_ericsson_p1-1982.php>Sony
Ericsson P1</a>. A fantastic
phone and I broke it in Prague after a party and that was one of those rare
occasions where I was actually mad at myself. But nevertheless, after that
phone, the next one was an Android one.<p>Before that, I only owned normal phones from Nokia and Siemens etc. Nothing
special, actually. These are the phones we are talking about. Before 2007.
Apple and Android phones didn't exist yet.<p>These phones were rocking:<ul><li>No selfie cameras.<li>~2 inch displays.<li>~120 MHz beast CPU's.<li>144p main cameras.<li>But they had a headphone jack.</ul><p>Let's take a look at these beauties.<figure><img src=/posts/wap/phones.gif alt="Old phones"></figure><h2 id=wap---wireless-application-protocol>WAP - Wireless Application Protocol</h2><p>Not that one! We are talking about Wireless Application Protocol and not Cardi
B's song 😃<p>WAP stands for Wireless Application Protocol. It is a protocol designed for
micro-browsers, and it enables the access of internet in the mobile devices. It
uses the mark-up language WML (Wireless Markup Language and not HTML), WML is
defined as XML 1.0 application. Furthermore, it enables creating web
applications for mobile devices. In 1998, WAP Forum was founded by Ericson,
Motorola, Nokia and Unwired Planet whose aim was to standardize the various
wireless technologies via protocols.
<a href=https://www.geeksforgeeks.org/wireless-application-protocol/>(source)</a><p>WAP protocol was resulted by the joint efforts of the various members of WAP
Forum. In 2002, WAP forum was merged with various other forums of the industry,
resulting in the formation of Open Mobile Alliance (OMA).
<a href=https://www.geeksforgeeks.org/wireless-application-protocol/>(source)</a><p>These were some wild times. Devices had tiny screens and data transmission rates
were abominable. But they were capable of rendering WML (Wireless Markup
Language). This was very similar to HTML, actually. It is a markup language,
after all.<p>These pages could be served by <a href=https://apache.org/>Apache</a> and could be
generated by CGI scripts on the backend. The only difference was the limited
markup language.<h2 id=wml---wireless-markup-language>WML - Wireless Markup Language</h2><p>Just like web browsers use HTML for content structure, older mobile device
browsers use WML - if you need to support really old mobile phones using WML
browsers, you will need to know about it. WML is XML-based (an XML vocabulary
just like XHTML and MathML, but not HTML) and does not use the same metaphor as
HTML. HTML is a single document with some metadata packed away in the head, and
a body encapsulating the visible page. With WML, the metaphor does not envisage
a page, but rather a deck of cards. A WML file might have several pages or cards
contained within it.
<a href=https://www.w3.org/wiki/Introduction_to_mobile_web>(source)</a><pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:#00f><?xml version="1.0"?></span>
</span></span><span style=display:flex><span><span style=color:#00f><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"></span>
</span></span><span style=display:flex><span><wml>
</span></span><span style=display:flex><span> <card id=<span style=color:#a31515>"home"</span> title=<span style=color:#a31515>"Example Homepage"</span>>
</span></span><span style=display:flex><span> <p>Welcome to the Example homepage</p>
</span></span><span style=display:flex><span> </card>
</span></span><span style=display:flex><span></wml>
</span></span></code></pre><p>There is an amazing tutorial on <a href=https://www.tutorialspoint.com/wml/index.htm>Tutorialpoint about
WML</a>.<h2 id=converting-digg-to-wml>Converting Digg to WML</h2><p>This task is completely useless and not really feasible nowadays, but I had to
give it a try for old-time sake. Since the data is already there in a form of
RSS feed, I could take this feed and parse it and create a WML version of the
homepage.<p>We will need:<ul><li>Python3 + Pip<li>ImageMagick<li>feedparser and mako templating</ul><pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:green># for fedora 35</span>
</span></span><span style=display:flex><span>sudo dnf install ImageMagick python3-pip
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span><span style=color:green># tempalting engine for python</span>
</span></span><span style=display:flex><span>pip install mako --user
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span><span style=color:green># for parsing rss feeds</span>
</span></span><span style=display:flex><span>pip install feedparser --user
</span></span></code></pre><p>Project folder structure should look like the following.<pre><code>12:43:53 m@khan wap → tree -L 1
.
├── generate.py
└── template.wml
</code></pre><p>After that, I created a small template for the homepage.<pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:#00f><?xml version="1.0"?></span>
</span></span><span style=display:flex><span><span style=color:#00f><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml_1.2.xml"></span>
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span><wml>
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span> <card title=<span style=color:#a31515>"Digg - What the Internet is talking about right now"</span>>
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span> % for item in entries:
</span></span><span style=display:flex><span> <p><img src=<span style=color:#a31515>"/images/${item.id}.jpg"</span> width=<span style=color:#a31515>"175"</span> height=<span style=color:#a31515>"95"</span> alt=<span style=color:#a31515>"${item.title}"</span> /></p>
</span></span><span style=display:flex><span> <p><small>${item.kicker}</small></p>
</span></span><span style=display:flex><span> <p><big><b>${item.title}</b></big></p>
</span></span><span style=display:flex><span> <p>${item.description}</p>
</span></span><span style=display:flex><span> % endfor
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span> </card>
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span></wml>
</span></span></code></pre><p>And the parser that parses RSS feed looks like this.<pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:#00f>import</span> os
</span></span><span style=display:flex><span><span style=color:#00f>import</span> feedparser
</span></span><span style=display:flex><span><span style=color:#00f>from</span> mako.template <span style=color:#00f>import</span> Template
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span>os.system(<span style=color:#a31515>'mkdir -p www/images'</span>)
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span>template = Template(filename=<span style=color:#a31515>'template.wml'</span>)
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span>feed = feedparser.parse(<span style=color:#a31515>'https://digg.com/rss/top.xml'</span>)
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span>entries = feed.entries[:15]
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span><span style=color:#00f>for</span> entry <span style=color:#00f>in</span> entries:
</span></span><span style=display:flex><span> print(<span style=color:#a31515>'Processing image with id </span><span style=color:#a31515>{}</span><span style=color:#a31515>'</span>.format(entry.id))
</span></span><span style=display:flex><span> os.system(<span style=color:#a31515>'wget -q -O www/images/</span><span style=color:#a31515>{}</span><span style=color:#a31515>.jpg "</span><span style=color:#a31515>{}</span><span style=color:#a31515>"'</span>.format(entry.id, entry.links[1].href))
</span></span><span style=display:flex><span> os.system(<span style=color:#a31515>'convert www/images/</span><span style=color:#a31515>{}</span><span style=color:#a31515>.jpg -type Grayscale -resize 175x -depth 3 -quality 30 www/images/</span><span style=color:#a31515>{}</span><span style=color:#a31515>.jpg'</span>.format(entry.id, entry.id))
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span>html = template.render(entries = entries)
</span></span><span style=display:flex><span>
</span></span><span style=display:flex><span><span style=color:#00f>with</span> open(<span style=color:#a31515>'www/index.wml'</span>, <span style=color:#a31515>'w+'</span>) <span style=color:#00f>as</span> fp:
</span></span><span style=display:flex><span> fp.write(html)
</span></span></code></pre><p>This script will create a folder <code>www</code> and in the folder <code>www/images</code> for
storing resized images.<blockquote><p>Be sure you don't use SSL and use just normal HTTP for serving the content.
These old phones will have problems with TLS 1.3 etc.</blockquote><p>If you look at the python file, I convert all the images into tiny B&W images.
They should be WBMP (Wireless BitMaP) but I choose JPEGs for this, and it seems
to work properly.<p>Because I currently don't have a phone old enough to test it on, I used an
emulator. And it was really hard to find one. I found <a href=http://wap-proof.sharewarejunction.com/>WAP
Proof</a> on shareware junction, and it
did the job well enough. I will try to find and actual device to test it on.<p><video src=/posts/wap/emulator.mp4 controls></video><p>If you are using Nginx to serve the contents, add a directive to the hosts file
that will automatically server <code>index.wml</code> file.<pre tabindex=0 style=background-color:#fff><code><span style=display:flex><span><span style=color:#00f>server</span> {
</span></span><span style=display:flex><span> <span style=color:#00f>index</span> <span style=color:#a31515>index.wml</span> <span style=color:#a31515>index.html</span> <span style=color:#a31515>index.htm</span> <span style=color:#a31515>index.nginx-debian.html</span>;
</span></span><span style=display:flex><span>}
</span></span></code></pre><h2 id=conclusion>Conclusion</h2><p>Well, this was pointless, but very fun! I hope you enjoyed it as much as I did.
I will try to find an old phone to test it on. If you have any questions, feel
free to ask in the comments.</div></article></main><section><hr><h2>Posts from blogs I follow around the net</h2><ul><li><a href=https://chotrin.org/writing/2023-10-29.html target=_blank rel=noopener>even more bike things.</a><div>I wrote about all sorts of biking and not-biking things in my life this week. — <a href=https://chotrin.org>chötrin's wiki.</a><li><a href="http://offbeatpursuit.com:80/blog/?id=25" target=_blank rel=noopener>A fix by any other name</a><div>tags:
i2c, plan9
Another month, another file system.
Well, if you can’t fix it in software, fix it in hardware (looking at
you, bme680, we’re not
done yet). The show mu… — <a href=http://offbeatpursuit.com:80/blog/>WLOG - blog</a><li><a href=https://mirzapandzo.com/next-image-url-parameter-is-valid-but-upstream-response-is-invalid target=_blank rel=noopener>Next/Image "url" parameter is valid but upstream response is invalid</a><div>Getting "url" parameter is valid but upstream response is invalid error with Next/Image on WSL2 — <a href=https://mirzapandzo.com/>Mirza Pandzo's Blog</a><li><a href=https://drewdevault.com/2023/10/13/Going-off-script.html target=_blank rel=noopener>Going off-script</a><div>There is a phenomenon in society which I find quite bizarre. Upon our entry to
this mortal coil, we are endowed with self-awareness, agency, and free will.
Each of th… — <a href=https://drewdevault.com>Drew DeVault's blog</a><li><a href=https://solar.lowtechmagazine.com/2023/10/thematic-book-series-how-to-downsize-a-transport-network/ target=_blank rel=noopener>Thematic Book Series: How to Downsize a Transport Network?</a><div>Image: Book cover. [How to downsize a transport network?](https://www.lulu.com/shop/kris-de-decker/how-to-downsize-a-transport-network/paperback/product-42n4p7.htm… — <a href=https://solar.lowtechmagazine.com/posts/>LOW←TECH MAGAZINE English</a><li><a href=https://neil.computer/notes/chart-of-accounts-for-startups-and-saas-companies/ target=_blank rel=noopener>Chart of Accounts for Startups and SaaS Companies</a><div>Accounting is fundamental to starting a business. You need to have a basic understanding of accounting principles and essential bookkeeping. I had to learn it. Ther… — <a href=https://neil.computer/>Neil Panchal</a><li><a href=https://journal.valeriansaliou.name/deploy-a-nomad-cluster-on-alpine-linux-with-vultr/ target=_blank rel=noopener>Deploy a Nomad Cluster on Alpine Linux with Vultr</a><div>After spending countless hours trying to understand how to deploy my apps on Kubernetes for the first time to host Mirage, an AI API service that I run, I ended up … — <a href=https://journal.valeriansaliou.name/>Valerian Saliou</a><li><a href=https://jcs.org/2023/10/25/wifi_da target=_blank rel=noopener>BlueSCSI Wi-Fi Desk Accessory 1.0 Released</a><div>BlueSCSI Wi-Fi Desk Accessory
1.0 has been released:
wifi_da-1.0.sit
(StuffIt 3 archive)
SHA256: ccfc9d27dd5da7412d10cef73b81119a1fec3848e4d1d88ff652a07ffdc6a69aSHA1:… — <a href=https://jcs.org/>joshua stein</a></ul><p><a href=https://git.sr.ht/~sircmpwn/openring>Generated with openring.</a></section><footer><hr><p><big><strong>Want to comment or have something to add?</strong></big><p>You can write me an email
at <a href=mailto:mitja.felicijan@gmail.com>mitja.felicijan@gmail.com</a> or
catch up with me <a href=https://telegram.me/mitjafelicijan target=_blank>on Telegram</a>.<hr><p>This website does not track you. Content is made available under
the <a href=https://creativecommons.org/licenses/by/4.0/ target=_blank rel=noreferrer>CC BY 4.0 license</a> unless specified
otherwise. Blog is also available as <a href=/index.xml target=_blank>RSS feed</a>.</footer><script>
window.va = window.va || function () { (window.vaq = window.vaq || []).push(arguments); };
</script><script defer src=/_vercel/insights/script.js></script>
|
