Hey all.
Trying to join the script i use to display my stuff with thumbnails and another one that i downloaded from the web which sorts thumbnails by category. Unfortunately both scripts are very dissimilar from each other in terms of how they read the XML file. I'm pretty much stuck because i just want the script to sort my thumbnails but don't know how to do it.
here is an example of the xml for my thumbnails
Code:
<menu>
<menuitems>
<item type="website">
<itemTitle>Kilden Helse</itemTitle>
<itemDesc>
<![CDATA[Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - Item 1]]>
</itemDesc>
<itemUrl>www.kildenhelse.no</itemUrl>
<itemThumb>images/thumb/1.jpg</itemThumb>
<itemImage>images/image/1.jpg</itemImage>
</menuitems>
</menu>
and this script reads and displays my thumbnails:
Code:
function CreateMenu(menu_xml){
// start with the first item in the XML
var items = menu_xml.firstChild.firstChild.childNodes; // menu -> menuitems -> child nodes array
for (var i=0; i<items.length; i++) {
// only continue if the type of this item is = showItemType
if (items[i].attributes.type == showItemType) {
// create variables for our elements
var itemTitle = items[i].firstChild; // same as items[i].childNodes[0]
var itemDesc = items[i].childNodes[1]; // second childNode
var itemUrl = items[i].childNodes[2]; // third childNode
var itemThumb = items[i].childNodes[3]; // fourth childNode
var itemImage = items[i].childNodes[4]; // fifth childNode
var nCat:String = items[i].childNodes[5];
// Create a menu item movie clip in the menu_mc instance on the main timeline
// for each item element offsetting each additional further down the screen
var item_mc = menu_mc.attachMovie("menu_item","item"+item_count, item_count);
item_mc._y = item_count * item_spacing;
item_mc._x = i%4*109;
item_mc._y = Math.floor(i/4)*87
item_count++;
// assign text using nodeValue to get the text
// from the text nodes and CDATA sections
item_mc.itemTitle_txt.text = itemTitle.firstChild.nodeValue;
item_mc.main_btn.itemTitle_text = itemTitle.firstChild.nodeValue;
item_mc.main_btn.itemDesc_text = itemDesc.firstChild.nodeValue;
item_mc.main_btn.itemUrl_text = itemUrl.firstChild.nodeValue;
item_mc.main_btn.itemThumb_txt = itemThumb.firstChild.nodeValue;
item_mc.main_btn.itemImage_text = itemImage.firstChild.nodeValue;
//item_mc.thumb_mc.loadMovie(itemThumb.firstChild.nodeValue);
loadThumbs(item_mc, itemThumb.firstChild.nodeValue);
// set the onRelease of the item button to the DisplayInfo function
item_mc.main_btn.onRelease = DisplayInfo;
}
}
}
function loadThumbs (mc, thumb)
{
var mcL = new MovieClipLoader();
var listener = new Object();
listener.onLoadInit = function ()
{
mcL.removeListener(listener);
}
listener.onLoadProgress = function (target, loaded, total)
{
mc.itemTitle_txt.text = Math.round(loaded / total * 100);
}
mcL.addListener(listener);
mcL.loadClip(thumb, mc.thumb_mc);
}
// manage XML
// create new XML object instance, remembering to ignore white space
var squirrel_xml = new XML();
squirrel_xml.ignoreWhite = true;
// define an onLoad to create our itemDesc menu when the XML has successfully loaded.
squirrel_xml.onLoad = function(success){
if (success) CreateMenu(this);
else trace("Error loading XML file"); // no success? trace error (wont be seen on web)
}
// load the xml file!
squirrel_xml.load("portfolio.xml");
now an example of the xml which feeds the sorting script's thumbnails:
Code:
<xml>
<data Default="show all images" m_up_color="0x000000" m_down_color="0x0033ff" txt_up_color="0xffffff" txt_down_color="0xffffff">
<item thumb="birds/1.jpg" cat="birds" />
<item thumb="butterflies/1.jpg" cat="butterflies" />
<item thumb="dogs/1.jpg" cat="dogs" />
</xml>
and finally the script which sorts. I really don't know how to take this thing apart because it's all so cluttered.
Code:
import mx.transitions.Tween;
import mx.transitions.easing.*;
Stage.scaleMode = "noScale";
var catArray:Array = new Array();
var cat_t_array:Array = new Array();
var nav_mc:Array;
var _items:Number;
var m_up_color:Number;
var m_down_color:Number;
var catNum:Number;
var currCat:String;
var cat_btn_id:Number;
var w:Number = 80;
var h:Number = 60;
var s:Number = 5;
var rows:Number;
var cols:Number;
var txt_up_color:Number;
var txt_down_color:Number;
var menu:MovieClip = this.createEmptyMovieClip("menu", 1);
var xmlObj:XML = new XML();
xmlObj.ignoreWhite = true;
xmlObj.onLoad = function(success:Boolean):Void {
if (success) {
_items = this.firstChild.childNodes[0].childNodes.length;
m_up_color = this.firstChild.childNodes[0].attributes.m_up_color;
m_down_color = this.firstChild.childNodes[0].attributes.m_down_color;
txt_up_color = this.firstChild.childNodes[0].attributes.txt_up_color;
txt_down_color = this.firstChild.childNodes[0].attributes.txt_down_color;
for (var i:Number = 0; i<_items; i++) {
var cat:String = this.firstChild.childNodes[0].childNodes[i].attributes.cat;
if (catArray.toString().indexOf(this.firstChild.childNodes[0].childNodes[i].attributes.cat)<0) {
catArray.push(this.firstChild.childNodes[0].childNodes[i].attributes.cat);
}
if (i == _items-1) {
catArray.push(this.firstChild.childNodes[0].attributes.Default);
initMenu();
}
}
}
};
xmlObj.load("sort.xml");
var sL:Object = new Object();
sL.onResize = function():Void {
menu._x = Math.round(Stage.width/2-menu._width/2);
container._x = menu._x;
};
Stage.addListener(sL);
var menuButton:MovieClip;
var catNum:Number;
function initMenu():Void {
catNum = catArray.length;
for (var c:Number = 0; c<catNum; c++) {
var Title:String = catArray[c];
menuButton = menu.attachMovie("menu_btn", "menu_btn"+c, c);
menuButton._alpha = 0;
menuButton._x = menu["menu_btn"+(c-1)]._x+menu["menu_btn"+(c-1)]._width+1;
menuButton.txt.autoSize = true;
menuButton.txt.text = Title;
menuButton.title_bg._width = Math.round(menuButton.txt._width+61);
menuButton.title_bg._height = Math.round(menuButton.txt._height+1);
menuButton.txt._x = Math.round(menuButton.title_bg._width/2-menuButton.txt._width/2);
menuButton.txt._y = Math.round(menuButton.title_bg._height/2-menuButton.txt._height/2);
menuButton.c = c;
menuButton.Title = Title;
new Tween(menuButton, "_alpha", Regular.easeOut, menuButton._alpha, 100, .1*c+.1, true);
if (Title.toLowerCase() == "show all images") {
var nc:Color = new Color(menuButton.title_bg);
nc.setRGB(m_down_color);
var nc_txt:Color = new Color(menuButton.txt);
nc_txt.setRGB(txt_down_color);
} else {
var nc:Color = new Color(menuButton.title_bg);
nc.setRGB(m_up_color);
var nc_txt:Color = new Color(menuButton.txt);
nc_txt.setRGB(txt_up_color);
}
menuButton.onRelease = menuRelease;
}
menu._x = Math.round(Stage.width/2-menu._width/2);
loadGrid();
}
function menuRelease():Void {
nav_mc = new Array();
var tw:Tween;
currCat = this.Title;
cat_btn_id = this.c;
for (var c = 0; c<catNum; c++) {
var menuButton:MovieClip = menu["menu_btn"+c];
if (c !== cat_btn_id) {
var nc:Color = new Color(menuButton.title_bg);
nc.setRGB(m_up_color);
var nc_txt:Color = new Color(menuButton.txt);
nc_txt.setRGB(txt_up_color);
} else {
var nc:Color = new Color(menuButton.title_bg);
nc.setRGB(m_down_color);
var nc_txt:Color = new Color(menuButton.txt);
nc_txt.setRGB(txt_down_color);
}
}
if (this.Title.toLowerCase() == "show all images") {
for (var i = 0; i<_items; i++) {
thumbHolder = container["thumbHolder"+i];
tw = new Tween(thumbHolder, "_alpha", Strong.easeOut, thumbHolder._alpha, 100, 2, true);
nav_mc.push(thumbHolder);
}
sort();
} else {
for (var i = 0; i<_items; i++) {
thumbHolder = container["thumbHolder"+i];
if (thumbHolder.nCat !== currCat) {
new Tween(thumbHolder, "_alpha", Strong.easeOut, thumbHolder._alpha, 0, 2, true);
} else {
tw = new Tween(thumbHolder, "_alpha", Strong.easeOut, thumbHolder._alpha, 100, 2, true);
nav_mc.push(thumbHolder);
}
}
sort();
}
}
var thumbHolder:MovieClip;
var thumbClip:MovieClip;
var container:MovieClip = this.createEmptyMovieClip("container", 2);
function loadGrid():Void {
cols = Math.round(menu._width/(w+s));
rows = Math.ceil(_items/cols);
container._x = menu._x;
container._y = menu._y+menu._height+20;
for (var i:Number = 0; i<_items; i++) {
for (var r:Number = 0; r<rows; r++) {
for (var c:Number = 0; c<cols; c++) {
var thumb:String = xmlObj.firstChild.childNodes[0].childNodes[i].attributes.thumb;
var nCat:String = xmlObj.firstChild.childNodes[0].childNodes[i].attributes.cat;
thumbHolder = container.createEmptyMovieClip("thumbHolder"+i, i);
thumbClip = thumbHolder.createEmptyMovieClip("thumbClip"+i, i);
thumbClip.loadMovie(thumb);
thumbHolder._x = Math.round((w+s)*c);
thumbHolder._y = Math.round((h+s)*r);
thumbHolder.i = i;
thumbHolder.nCat = nCat;
i++;
}
}
}
}
function sort():Void {
rows = Math.ceil(nav_mc.length/cols);
for (var i = 0; i<nav_mc.length; i++) {
for (var r = 0; r<rows; r++) {
for (var c = 0; c<cols; c++) {
thumbHolder = nav_mc[i];
new Tween(thumbHolder, "_x", Back.easeOut, thumbHolder._x, Math.round((w+s)*c), .5, true);
new Tween(thumbHolder, "_y", Back.easeOut, thumbHolder._y, Math.round((h+s)*r), .5, true);
i++;
}
}
}
}
Anyone got an idea? I'm really really stuck here. Resources/Information on sorting XML stuff is very very rare on the nets. I hope some pro whill know something.
Thanks a lot in advance!
Do you serve a purpose, or purposely serve?