User:Eleanorg/1.2/Forbidden Pixels: Difference between revisions

From XPUB & Lens-Based wiki
(Created page with "Experimenting with breaking down illicit content - whether obscene or pirated - into the smallest possible visual units, in order to question where exactly its criminality lies. ...")
 
 
(24 intermediate revisions by the same user not shown)
Line 1: Line 1:
Experimenting with breaking down illicit content - whether obscene or pirated - into the smallest possible visual units, in order to question where exactly its criminality lies.
Experimenting with breaking down illicit content - whether obscene or pirated - into the smallest possible visual units.


==Code trials==
==Code trials==
===First html grid===
===Scraping & Using remotely hosted pixel data===
This script prints an html doc with a grid of empty span elements and associated empty css rules, corresponding to a 10 x 20 pixel detail of an illicit image, to be filled in with the hexadecimal codes of each corresponding pixel:
* [[User:Eleanorg/1.2/Forbidden Pixels/scraping pixel data | scraping pixel data]]
<source lang="python">
* [[User:Eleanorg/1.2/Forbidden Pixels/Receiving URL where data is hosted | Receiving URL where data is hosted]]
print """
* [[User:Eleanorg/1.2/Forbidden Pixels/writing string to text file | writing string to text file]]
<!DOCTYPE html>
* [[User:Eleanorg/1.2/Forbidden Pixels/composing image with ImageMagick | composing image with ImageMagick]]
<html>
  <head>
    <title>Forbidden Pixels: Trial #1</title>
    <style type="text/css">
      #header {
        width: 200px;
        height: 1000px;
        float:left;
        padding-left: 10px;
        padding-top: 10px;
        padding-right: 20px;
        border-right: 1px solid #000;
        background-color: #fff;
        font-family: sans-serif;
       
      }
      .inner {
        width: 1000px;
        margin-top: 20px;
        float:left;
        margin-left: 30px;
       
     
        background-color: #aaa;
      }
      .pixel {
        min-width: 50px;
        min-height: 50px;
        float: left;
        border: 0px #000 solid;
        padding: none;
        margin: none;
      }"""
     
# prints empty css rules for each pixel
n = 1
while n < 201:
    print """
      #pixel_""" + str(n) + """ { background-color: #; }"""
    n = n + 1


print """
===User interface===
    </style>
Will probably be an html image map over the image, with jQuery allowing ppl to browse through the pixels.
  </head>
* [[User:Eleanorg/1.2/Forbidden Pixels/Html image map | Html image map]]
 
* [[User:Eleanorg/1.2/Forbidden Pixels/using jQuery to access co-ordinate & colour of each cell | using jQuery to access co-ordinate & colour of each cell]]
<body>
* [[User:Eleanorg/1.2/Forbidden_Pixels/Browsable image with CSS & jQuery | First Browsable image w/ css & jQuery]]
  <div id="header">
    <h1>Forbidden Pixels</h1>
    <p>A 20 x 10 pixel section of a censored photograph</p>
  </div>
 
  <div class="inner">"""
 
# prints out a grid of square spans
x = 1
while x < 201:
    print """
    <span class="pixel" id="pixel_""" + str(x) + """"></span>"""
    x = x + 1
   
print """
 
  </div>
</body>
</html>"""
   


</source>
===Printing an empty html grid===
An image is processed with ImageMagick, so each pixel's coordinate & color is extracted. A visibly empty html grid is printed, with each cell in the grid assigned one pixel's coodinate & color. Eventual aim: each cell has a unique id string, which can be embedded on other websites. Those sites are then scraped, turning the co-ordinate & colour within the string into html which displays the pixel.
* [[User:Eleanorg/1.2/Forbidden Pixels/storing RGB values in nested lists | storing RGB values in nested lists]]
* [[User:Eleanorg/1.2/Forbidden Pixels/printing html grid from nested list values | printing html grid from nested list values]]
* [[User:Eleanorg/1.2/Forbidden Pixels/assigning each td a meaningful id | assigning each td a meaningful id ]]
 
 
===Reproducing an image as html===
An image is processed with ImageMagick, so each pixel's coordinate & color is extracted, then reproduced using only html/css, so it's no longer an image.
* [[User:Eleanorg/1.2/Forbidden Pixels/html grid reproducing a section of banned photo | html grid reproducing a section of banned photo]] >> [http://pzwart3.wdka.hro.nl/~egreenhalgh/forbiddenPixels/forbiddenPixelsGrid1.html View output]
* [[User:Eleanorg/1.2/Forbidden Pixels/RGB values stored in an array | storing RGB values in an array]]
* [[User:Eleanorg/1.2/Forbidden Pixels/trying to print html grid with colours | html grid with rgb values from system command]]
* [[User:Eleanorg/1.2/Forbidden Pixels/first html grid | first html grid]]
* [[User:Eleanorg/1.2/Forbidden Pixels/extracting pixel colours | extracting pixel colours]]

Latest revision as of 16:38, 26 March 2012

Experimenting with breaking down illicit content - whether obscene or pirated - into the smallest possible visual units.

Code trials

Scraping & Using remotely hosted pixel data

User interface

Will probably be an html image map over the image, with jQuery allowing ppl to browse through the pixels.

Printing an empty html grid

An image is processed with ImageMagick, so each pixel's coordinate & color is extracted. A visibly empty html grid is printed, with each cell in the grid assigned one pixel's coodinate & color. Eventual aim: each cell has a unique id string, which can be embedded on other websites. Those sites are then scraped, turning the co-ordinate & colour within the string into html which displays the pixel.


Reproducing an image as html

An image is processed with ImageMagick, so each pixel's coordinate & color is extracted, then reproduced using only html/css, so it's no longer an image.