Mike Richards Photography Blog

Web Site and Gallery Update

Mike — Thu, 16 Feb 2012 20:12:11 +0000

We are working on another site update as part of which I’m planning on moving away from SimpleViewer and SWFAddress. There has been a lot of hate on Flash lately I have mixed feelings on the issue and part of me hates joining in on that hate. I’m a big fan of open source, open format and web standards and I really like having the option to be able to customize code and not have that code limited as to where it will run. However most of the flash applications out there just seem so much more refined than their open JavaScript/HTML/CSS counter parts. I have had a heck of a time finding a gallery that would fit my needs, on several occasions came very close to coding my own, but for now have settled on Galleria and History.js for deep linking. Galleria’s code is a bit bloated, but I have a hard time criticizing open source software. Actions before words right? We’ll see if I can find time to make the changes I would like when it already functional now.

The redesign of the site is mostly done and will hopefully be up in the next couple of weeks. Until then you can always see new photos at my 500px account.

The Noise about SOPA

Mike — Wed, 18 Jan 2012 20:35:44 +0000

Short and sweet – I don’t know that there is much that can be said about the Stop Online Piracy Act (SOPA) at this point that isn’t just adding to the noise. So I will simply join in solidarity with the movement to stop its passage, voice to that I think SOPA is going about what needs to be done, copyright reform, the wrong way and leave it at that for now.

Google Plus pages.

Mike — Wed, 09 Nov 2011 22:12:34 +0000

Not sure yet the value of a Google+ page vs a normal Google+ account for Photographers, but that may come as they develop the service.

One thing I have notice while looking into pages is a bunch of people talking about “ERROR CHANGING MEMBERSHIP” problems, if you take a look at Google’s tips for the new pages feature you will find this:

“2. No Google+ Page Can Follow You Until You Follow Them

We want Google+ to be a place you love to share. Pages cannot circle you until you follow them first…”

So if you have a Google plus page and you are trying to follow someone and see “ERROR CHANGING MEMBERSHIP” remember they have to follow you first.

Creating a Google Plus Thumbnail Panorama Template.

Mike — Wed, 26 Oct 2011 05:55:43 +0000

I have seen several templates for creating a Google Plus Thumbnail Panorama, but they seem to over-complicate what has to be done. If we go back to the dawn of Photoshop there is a tool that does all the work for us: the slice tool. Using the slice tool to create a thumbnail panorama is as easy as downloading my PSD template – or creating your own PSD that is 670px by 134px with 5 square 134px slices – adding your image (resizing and positioning as needed) and saving for the web.

g+ pano template.psd

Gimp:
You can also use the PSD template with the free, open source image editor Gimp. The process does not seem to be as automated, but someone who uses Gimp regularly may be able to correct me on that. Once you open the PSD and add your image to the template, in Gimp’s image menu choose transform and then Guillotine.

Value of Art

Mike — Mon, 03 Oct 2011 20:03:07 +0000

Three memorable experiences with the pricing of art left it as one of my takeaways from the Alternative Press Expo (APE) in San Francisco this weekend.

1) I found it interesting that one of the artists that we bought a print from had a quasi pay what you like pricing structure, for example some of the pieces were priced $10 – $20. When I first asked how much the piece was he said something about knowing the economy is bad and he wants to work with people. And later after we were purchasing the item I asked from him one artist to another how the pricing structure was working for him. He seemed embarrassed, said that he guessed that it averages out to somewhere in between, but he didn’t track his sales and then sheepishly mumbled that he is still not making it.

2) I was kind of shocked that another piece we bought was only $5 and I had expected the artist to at least be charging between $20 and $40 for the it.

3) Conversely we went to a talk in which an interview with Alexander Calder was paraphrased as “Your work is worth the time you put into it plus everything it took you to get to this point in your career, thus a 60 sec sketch can be worth $200,000.”

Pay what you want / pay what you think the work is worth seems to be the hip thing to do these days, at least in the music world. MP3 downloads are easy to sell at volume and volume and averaging out allow this to succeed, but does it really work for the rest of the art world? Is work taken as seriously when it has a flexible or undervalued price? How does this affect other artists? Is this the answer to selling art in a slow economy?

Traditionally art and entertainment tend to continue to do well during periods of economic trouble, people need to feel entertained. Above all if you are going to experiment with pricing make sure you track your sales, otherwise you wont know if it is working or bankrupting you. If you are worried about not getting sales because of the economy, I think a better route is to provide a few different items at different price points, than to experiment or undervalue your work. As to the third stance, while I appreciate and think that it is important to remember not to undervalue your work, not everyone can afford pay or can justify charging $200,000 for a piece of art. There has to be a balance here. Remember that how we value our work affects how others value both your work and the work of other artists.

Now out of the San Francisco Bay Area.

Mike — Sun, 01 May 2011 19:49:45 +0000

Quick update I just moved from the Boston area back to the San Francisco Bay Area.

SimpleViewer 2 and Fotomoto

Mike — Mon, 13 Sep 2010 18:03:18 +0000

Currently SimpleViewer 2 does not provide a method for clicking an image and running a function. You can however get around this short coming by embedding the simpleviewer.swf into another swf and placing a transparent button over your image area. Note you wont be able to use the image overlay navigation and you will need to make your gallery size static. The other option is to create normal purchase button that calls the purchaseImage function.

The basic setup is as follows, you then need to turn on the SimpleViewer API, add an event listener that calls purchaseImage when the transparent button is clicked and add svAPI.addEventListener(“svImageChange”,checkImage); to onGalleryLoaded. You can find an example of embeding SimpleViewer into a swf and using the API in the examples\flash_embed folder of the Pro download. Finally add the following code to your ActionScript and gallery HTML page.

ActionScript:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

var svAPI:Object; //svAPI is the object to call API methods on

function onGalleryLoaded(e:Event):void{
svAPI = Object(svLoader.content).api;
svAPI.addEventListener("svImageChange",checkImage);
}

function checkImage(e:Event):void {
var imageInfo:Object = svAPI.getImageInfo(svAPI.getImageIndex());
var imgURL:String = imageInfo.imageURL;
ExternalInterface.call('fmCheckImage',imgURL);
}

function purchaseImage(e:Event):void {
var imageInfo:Object = svAPI.getImageInfo(svAPI.getImageIndex());
var imgURL:String = imageInfo.imageURL;
ExternalInterface.call('fmWindow',imgURL);
}

Add this JavaScript to your gallery html making sure to correct _yourFotoMotoID_

1
2
3
4
5
6
7
8
9
10
11
12
13

To use the following example you will need to change the fotomoto id and add your SimpleViewer Pro swf to the folder.
simpleviewer_fotomoto.zip

You can also see it working in my gallery.

The MIT License

Copyright (c) 2010 Michael Richards – mikerichardsphotography.com

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the “Software”), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.

Long over due post/gallery update

Mike — Mon, 30 Aug 2010 18:04:37 +0000

Been busy and it looks like that trend is going to carry on for the foreseeable future. I have updated all of my galleries with the exception of Oceans adding 16 new images, primarily to Abstractions 2. I have a review halfway written for RadioPopper’s JrX STUDIO flash triggers which I will try to have up soon.

Some new hardware and software “toys” and site updats…

Mike — Thu, 11 Mar 2010 21:10:00 +0000

Steve Chapman’s (panocamera.com) Nintendo DS Camera Controller which I purchased awhile ago has been open sourced as Open Camera Control.

Palm has released the beta version of the native Plug-in Developer Kit (PDK) for the Palm Pre, though unfortunately they don’t have support for Linux yet.

I finally got around to completing the assembly of the Camera Axe I got for Christmas.

Seems like I’m constantly tinkering with site updates I added 29 new images to my galleries and Fotomoto released their API last month which I integrated with SimpleViewer.

How To: SimpleViewer 2 and SWFAddress.

Mike — Thu, 28 Jan 2010 18:07:54 +0000

As this is an update to an existing post I will dispense with a basic introduction. The major difference between this post and the previous is that the new version uses Actionscript 3. Here is the deep linking example of SimpleViewer 2 and SWFAddress 2.4.

What you will need to download:

SimpleViewer Pro 2.0.1
SWFAddress 2.4
If you don’t have it Adobe Flash Professional

Make a new folder on your desktop – you can call it whatever you would like, for the tutorial I’m going to call mine gallery.

Extract the file you download from the SimpleViwer site, simpleviewer-pro.zip.

Copy all of the files in the flash_embed folder into your gallery folder. You will find the Flash Embed example in the SimpleViewer folder you created when you extracted the simpleviewer-pro.zip under simpleviewer-pro2_1/examples/flash_embed.

Rename simpleviewer_flash_embed.fla to simpleviewer_swfaddress.fla, delete simpleviewer_flash_embed.swf and simpleviewer_flash_embed.html.

Unzip swfaddress-2.4zip

Copy the asual folder found in swfaddress-2.4\dist\as\3\com\ to gallery\com\.

Copy swfaddress.js from swfaddress-2.4\dist\js to the gallery folder.

In the gallery folder right click new>text document. Rename the text file to index.html.

You should now have all of the files you need in the gallery folder:

com folder
images folder
thumbs folder
gallery_1.xml
gallery_2.xml
index.html
simpleviewer_swfaddress.fla
simpleviewer.swf
swfaddress.js

In your gallery folder open index.html and copy the following code into index.html:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Simpleviewer Gallery with SWFAdress</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript" src="swfaddress.js"></script>
<script type="text/javascript">
var flashvars = {};
var params = {};
params.scale = "noscale";
params.allowfullscreen = "true";
params.allowScriptAccess = "sameDomain";
swfobject.embedSWF("simpleviewer_swfaddress.swf", "galleryContent", "900", "670", "10.0.0", false, flashvars, params);
</script>
<style type="text/css" media="screen">
object {
outline:none;
}
body {
margin:0;
padding:0;
}
</style>
</head>
<body>
<div id="galleryContent">
<p>In order to view these galleries you must have <a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Adobe Flash Player</a> installed.
If you know that you have Flash installed, then please ensure JavaScript and/or Active Content are enabled.</p>
</div>
</body>
</html>

In your gallery folder open simpleviewer_swfaddress.fla with Adobe Flash Professional. Delete all the buttons and the text box, with the exception of the Load Gallery 1 and 2 buttons. (Feel free to change the background color so it’s not so hard to look at.)

Now select the code layer’s Actions – Frame within the simpleviewer_swfaddress.fla document and replace the existing code with the following:

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
132
133
134
135
136
137
138
139
140
141

//Mike Rchards - mikerichardsphotography.com
//This code is provided free without guarantee and is "AS IS".

//import required classes
import flash.display.*;
import flash.net.URLRequest;
import com.asual.swfaddress.*;

//turn off stage auto resizing
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;

//Init variables
var svAPI:Object; //svAPI is the object to call API methods on
var swfLoaded:Boolean = false;
var galleryURL:String; //used when switching between galleries
var imageIndex:Number;
var svLoader:Loader = new Loader(); //loader to load SimpleViewer swf into
var galleryShowing:Boolean = true;

//the default galleryname should be the same as the name of the xml minus .xml
var defaulGallery:String = "gallery_1";
var currentGalName:String ="";

//add svLoader to the "mcLoader" stage movieclip on the main timeline
mcLoader.addChild(svLoader);

//listen for SWF loaded
svLoader.contentLoaderInfo.addEventListener(Event.INIT, onViewerInit);
SWFAddress.addEventListener(SWFAddressEvent.EXTERNAL_CHANGE, handleSWFAddressExt);
SWFAddress.addEventListener(SWFAddressEvent.INTERNAL_CHANGE, handleSWFAddressInt);

/*
* This function runs on external change - URL, Link, Back/Forward Button
**/
function handleSWFAddressExt(e:SWFAddressEvent):void {

var path:String = e.path;
var arr:Array = path.split("/");
var galName:String = arr[1];
var imgId:Number = parseInt(arr[2], 10);
// If the gallery name is empty set to the default gallery.
if (galName == "" || galName == "unknown") {galName = defaulGallery;}
// If the image number is not a number set it to the first image.
if (isNaN(imgId)) {imgId =0;}
imageIndex = imgId - 1;

// If the galName is the currentGalName load the new image.
if(galName == currentGalName){
svAPI.showImage(imgId);
}else{// If the galName is not the currentGalName load the new gallery.
loadGallery(galName, imgId);
//Adds just the gallery name to the browser title bar. The title is taken from the gallery XML title.
SWFAddress.setTitle('Simpleviewer With SWFAdress : ' + galName);
}
}

/**
* This function runs on internal change - clicking a thumbnail, autoplay
**/
function handleSWFAddressInt(e:SWFAddressEvent):void {
var path:String = e.path;
var arr:Array = path.split("/");
var imgId:Number = parseInt(arr[2], 10);
imageIndex = imgId - 1;
}

/**
* This function loads the SimpleViewer SWF
*/
function loadGallery(galName:String, imgId:Number){

currentGalName = galName;
galleryURL = galName + ".xml"; //url;

//unload previous simpleviewer instance
if (svAPI != null ) svAPI.dispose();
svAPI = null;
//flash 9 - unload
if (swfLoaded) svLoader.unload();
//Flash 10 - unloadAndStop
//if (_viewerLoaded) svLoader.unloadAndStop();

SWFAddress.setValue('/'+galName+'/'+ imgId +'/');

//load simpleviewer swf
var urlReq:URLRequest = new URLRequest("simpleviewer.swf");
svLoader.load(urlReq);
swfLoaded = true;
}

function updateGalleryUrl(e:Object){
var path = SWFAddress.getValue();
var arr:Array = path.split("/");
var galName = arr[1];
//We are disregarding arr[2] because we are being
//passed the new image id, e.data, and don't need the current one.
var imgId:Number = e.data + 1
// SWFAddress.setValue updates the address bar and calls handleChange(event:SWFAddressEvent)
SWFAddress.setValue('/'+galName+'/'+imgId+'/');
}

/**
* Fired when preloader is available
* Can set flashvars at this point
*/
function onViewerInit(e:Event):void{
trace("onViewerInit");

//listen for
Object(svLoader.content).addEventListener("svComplete", onGalleryLoaded);
trace("setViewerFlashVars");
var options:Object = Object(svLoader.content).embedOptions;

//set gallery.xml url based on current galleryId
options.galleryURL = galleryURL;
options.firstImageIndex = imageIndex;
}

/**
* Fired when gallery has completly loaded (SWF + XML)
* API is now available.
*/
function onGalleryLoaded(e:Event):void{
svAPI = Object(svLoader.content).api;
//Init Event Listeners
svAPI.addEventListener("svImageChange",updateGalleryUrl);
}

//Init Button Click Handlers
mcButton1.addEventListener(MouseEvent.CLICK,loadGallery1);
mcButton2.addEventListener(MouseEvent.CLICK,loadGallery2);

//Button Click Handlers
function loadGallery1(e:Event){
loadGallery("gallery_1",1);
}

function loadGallery2(e:Event){
loadGallery("gallery_2",1);
}

Save (Crtl + S) simpleviewer_swfaddress.fla.

Export (Crtl + Alt + Shift + S) simpleviewer_swfaddress.fla as simpleviewer_swfaddress.swf into your gallery folder.

To test you must upload the files to your server.

Make sure to upload all of the following files and folders:

images folder
thumbs folder
gallery_1.xml
gallery_2.xml
index.html
simpleviewer_swfaddress.swf
simpleviewer.swf
swfaddress.js

The browser history is updated every time you click a thumbnail, thus enabling the browser back button. You can now link to any image via a nice URL and as you click on thumbnails you can watch the address bar change. You can also directly link to an image.

To use the following example you will need to add your SimpleViewer Pro swf to the folder and upload it to a server. SV2swfaddress.zip

The MIT License

Copyright (c) 2010 Michael Richards – mikerichardsphotography.com

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the “Software”), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.