http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Designer/html-template/history/history.js ---------------------------------------------------------------------- diff --git a/Radii8Designer/html-template/history/history.js b/Radii8Designer/html-template/history/history.js new file mode 100644 index 0000000..2cb34f8 --- /dev/null +++ b/Radii8Designer/html-template/history/history.js @@ -0,0 +1,696 @@ +/* + * + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ +BrowserHistoryUtils = { + addEvent: function(elm, evType, fn, useCapture) { + useCapture = useCapture || false; + if (elm.addEventListener) { + elm.addEventListener(evType, fn, useCapture); + return true; + } + else if (elm.attachEvent) { + var r = elm.attachEvent('on' + evType, fn); + return r; + } + else { + elm['on' + evType] = fn; + } + } +} + +BrowserHistory = (function() { + // type of browser + var browser = { + ie: false, + ie8: false, + firefox: false, + safari: false, + opera: false, + version: -1 + }; + + // Default app state URL to use when no fragment ID present + var defaultHash = ''; + + // Last-known app state URL + var currentHref = document.location.href; + + // Initial URL (used only by IE) + var initialHref = document.location.href; + + // Initial URL (used only by IE) + var initialHash = document.location.hash; + + // History frame source URL prefix (used only by IE) + var historyFrameSourcePrefix = 'history/historyFrame.html?'; + + // History maintenance (used only by Safari) + var currentHistoryLength = -1; + + // Flag to denote the existence of onhashchange + var browserHasHashChange = false; + + var historyHash = []; + + var initialState = createState(initialHref, initialHref + '#' + initialHash, initialHash); + + var backStack = []; + var forwardStack = []; + + var currentObjectId = null; + + //UserAgent detection + var useragent = navigator.userAgent.toLowerCase(); + + if (useragent.indexOf("opera") != -1) { + browser.opera = true; + } else if (useragent.indexOf("msie") != -1) { + browser.ie = true; + browser.version = parseFloat(useragent.substring(useragent.indexOf('msie') + 4)); + if (browser.version == 8) + { + browser.ie = false; + browser.ie8 = true; + } + } else if (useragent.indexOf("safari") != -1) { + browser.safari = true; + browser.version = parseFloat(useragent.substring(useragent.indexOf('safari') + 7)); + } else if (useragent.indexOf("gecko") != -1) { + browser.firefox = true; + } + + if (browser.ie == true && browser.version == 7) { + window["_ie_firstload"] = false; + } + + function hashChangeHandler() + { + currentHref = document.location.href; + var flexAppUrl = getHash(); + //ADR: to fix multiple + if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { + var pl = getPlayers(); + for (var i = 0; i < pl.length; i++) { + pl[i].browserURLChange(flexAppUrl); + } + } else { + getPlayer().browserURLChange(flexAppUrl); + } + } + + // Accessor functions for obtaining specific elements of the page. + function getHistoryFrame() + { + return document.getElementById('ie_historyFrame'); + } + + function getFormElement() + { + return document.getElementById('safari_formDiv'); + } + + function getRememberElement() + { + return document.getElementById("safari_remember_field"); + } + + // Get the Flash player object for performing ExternalInterface callbacks. + // Updated for changes to SWFObject2. + function getPlayer(id) { + var i; + + if (id && document.getElementById(id)) { + var r = document.getElementById(id); + if (typeof r.SetVariable != "undefined") { + return r; + } + else { + var o = r.getElementsByTagName("object"); + var e = r.getElementsByTagName("embed"); + for (i = 0; i < o.length; i++) { + if (typeof o[i].browserURLChange != "undefined") + return o[i]; + } + for (i = 0; i < e.length; i++) { + if (typeof e[i].browserURLChange != "undefined") + return e[i]; + } + } + } + else { + var o = document.getElementsByTagName("object"); + var e = document.getElementsByTagName("embed"); + for (i = 0; i < e.length; i++) { + if (typeof e[i].browserURLChange != "undefined") + { + return e[i]; + } + } + for (i = 0; i < o.length; i++) { + if (typeof o[i].browserURLChange != "undefined") + { + return o[i]; + } + } + } + return undefined; + } + + function getPlayers() { + var i; + var players = []; + if (players.length == 0) { + var tmp = document.getElementsByTagName('object'); + for (i = 0; i < tmp.length; i++) + { + if (typeof tmp[i].browserURLChange != "undefined") + players.push(tmp[i]); + } + } + if (players.length == 0 || players[0].object == null) { + var tmp = document.getElementsByTagName('embed'); + for (i = 0; i < tmp.length; i++) + { + if (typeof tmp[i].browserURLChange != "undefined") + players.push(tmp[i]); + } + } + return players; + } + + function getIframeHash() { + var doc = getHistoryFrame().contentWindow.document; + var hash = String(doc.location.search); + if (hash.length == 1 && hash.charAt(0) == "?") { + hash = ""; + } + else if (hash.length >= 2 && hash.charAt(0) == "?") { + hash = hash.substring(1); + } + return hash; + } + + /* Get the current location hash excluding the '#' symbol. */ + function getHash() { + // It would be nice if we could use document.location.hash here, + // but it's faulty sometimes. + var idx = document.location.href.indexOf('#'); + return (idx >= 0) ? document.location.href.substr(idx+1) : ''; + } + + /* Get the current location hash excluding the '#' symbol. */ + function setHash(hash) { + // It would be nice if we could use document.location.hash here, + // but it's faulty sometimes. + if (hash == '') hash = '#' + document.location.hash = hash; + } + + function createState(baseUrl, newUrl, flexAppUrl) { + return { 'baseUrl': baseUrl, 'newUrl': newUrl, 'flexAppUrl': flexAppUrl, 'title': null }; + } + + /* Add a history entry to the browser. + * baseUrl: the portion of the location prior to the '#' + * newUrl: the entire new URL, including '#' and following fragment + * flexAppUrl: the portion of the location following the '#' only + */ + function addHistoryEntry(baseUrl, newUrl, flexAppUrl) { + + //delete all the history entries + forwardStack = []; + + if (browser.ie) { + //Check to see if we are being asked to do a navigate for the first + //history entry, and if so ignore, because it's coming from the creation + //of the history iframe + if (flexAppUrl == defaultHash && document.location.href == initialHref && window['_ie_firstload']) { + currentHref = initialHref; + return; + } + if ((!flexAppUrl || flexAppUrl == defaultHash) && window['_ie_firstload']) { + newUrl = baseUrl + '#' + defaultHash; + flexAppUrl = defaultHash; + } else { + // for IE, tell the history frame to go somewhere without a '#' + // in order to get this entry into the browser history. + getHistoryFrame().src = historyFrameSourcePrefix + flexAppUrl; + } + setHash(flexAppUrl); + } else { + + //ADR + if (backStack.length == 0 && initialState.flexAppUrl == flexAppUrl) { + initialState = createState(baseUrl, newUrl, flexAppUrl); + } else if(backStack.length > 0 && backStack[backStack.length - 1].flexAppUrl == flexAppUrl) { + backStack[backStack.length - 1] = createState(baseUrl, newUrl, flexAppUrl); + } + + if (browser.safari && !browserHasHashChange) { + // for Safari, submit a form whose action points to the desired URL + if (browser.version <= 419.3) { + var file = window.location.pathname.toString(); + file = file.substring(file.lastIndexOf("/")+1); + getFormElement().innerHTML = '<form name="historyForm" action="'+file+'#' + flexAppUrl + '" method="GET"></form>'; + //get the current elements and add them to the form + var qs = window.location.search.substring(1); + var qs_arr = qs.split("&"); + for (var i = 0; i < qs_arr.length; i++) { + var tmp = qs_arr[i].split("="); + var elem = document.createElement("input"); + elem.type = "hidden"; + elem.name = tmp[0]; + elem.value = tmp[1]; + document.forms.historyForm.appendChild(elem); + } + document.forms.historyForm.submit(); + } else { + top.location.hash = flexAppUrl; + } + // We also have to maintain the history by hand for Safari + historyHash[history.length] = flexAppUrl; + _storeStates(); + } else { + // Otherwise, just tell the browser to go there + setHash(flexAppUrl); + } + } + backStack.push(createState(baseUrl, newUrl, flexAppUrl)); + } + + function _storeStates() { + if (browser.safari) { + getRememberElement().value = historyHash.join(","); + } + } + + function handleBackButton() { + //The "current" page is always at the top of the history stack. + var current = backStack.pop(); + if (!current) { return; } + var last = backStack[backStack.length - 1]; + if (!last && backStack.length == 0){ + last = initialState; + } + forwardStack.push(current); + } + + function handleForwardButton() { + //summary: private method. Do not call this directly. + + var last = forwardStack.pop(); + if (!last) { return; } + backStack.push(last); + } + + function handleArbitraryUrl() { + //delete all the history entries + forwardStack = []; + } + + /* Called periodically to poll to see if we need to detect navigation that has occurred */ + function checkForUrlChange() { + + if (browser.ie) { + if (currentHref != document.location.href && currentHref + '#' != document.location.href) { + //This occurs when the user has navigated to a specific URL + //within the app, and didn't use browser back/forward + //IE seems to have a bug where it stops updating the URL it + //shows the end-user at this point, but programatically it + //appears to be correct. Do a full app reload to get around + //this issue. + if (browser.version < 7) { + currentHref = document.location.href; + document.location.reload(); + } else { + if (getHash() != getIframeHash()) { + // this.iframe.src = this.blankURL + hash; + var sourceToSet = historyFrameSourcePrefix + getHash(); + getHistoryFrame().src = sourceToSet; + currentHref = document.location.href; + } + } + } + } + + if (browser.safari && !browserHasHashChange) { + // For Safari, we have to check to see if history.length changed. + if (currentHistoryLength >= 0 && history.length != currentHistoryLength) { + //alert("did change: " + history.length + ", " + historyHash.length + "|" + historyHash[history.length] + "|>" + historyHash.join("|")); + var flexAppUrl = getHash(); + if (browser.version < 528.16 /* Anything earlier than Safari 4.0 */) + { + // If it did change and we're running Safari 3.x or earlier, + // then we have to look the old state up in our hand-maintained + // array since document.location.hash won't have changed, + // then call back into BrowserManager. + currentHistoryLength = history.length; + flexAppUrl = historyHash[currentHistoryLength]; + } + + //ADR: to fix multiple + if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { + var pl = getPlayers(); + for (var i = 0; i < pl.length; i++) { + pl[i].browserURLChange(flexAppUrl); + } + } else { + getPlayer().browserURLChange(flexAppUrl); + } + _storeStates(); + } + } + if (browser.firefox && !browserHasHashChange) { + if (currentHref != document.location.href) { + var bsl = backStack.length; + + var urlActions = { + back: false, + forward: false, + set: false + } + + if ((window.location.hash == initialHash || window.location.href == initialHref) && (bsl == 1)) { + urlActions.back = true; + // FIXME: could this ever be a forward button? + // we can't clear it because we still need to check for forwards. Ugg. + // clearInterval(this.locationTimer); + handleBackButton(); + } + + // first check to see if we could have gone forward. We always halt on + // a no-hash item. + if (forwardStack.length > 0) { + if (forwardStack[forwardStack.length-1].flexAppUrl == getHash()) { + urlActions.forward = true; + handleForwardButton(); + } + } + + // ok, that didn't work, try someplace back in the history stack + if ((bsl >= 2) && (backStack[bsl - 2])) { + if (backStack[bsl - 2].flexAppUrl == getHash()) { + urlActions.back = true; + handleBackButton(); + } + } + + if (!urlActions.back && !urlActions.forward) { + var foundInStacks = { + back: -1, + forward: -1 + } + + for (var i = 0; i < backStack.length; i++) { + if (backStack[i].flexAppUrl == getHash() && i != (bsl - 2)) { + arbitraryUrl = true; + foundInStacks.back = i; + } + } + for (var i = 0; i < forwardStack.length; i++) { + if (forwardStack[i].flexAppUrl == getHash() && i != (bsl - 2)) { + arbitraryUrl = true; + foundInStacks.forward = i; + } + } + handleArbitraryUrl(); + } + + // Firefox changed; do a callback into BrowserManager to tell it. + currentHref = document.location.href; + var flexAppUrl = getHash(); + //ADR: to fix multiple + if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { + var pl = getPlayers(); + for (var i = 0; i < pl.length; i++) { + pl[i].browserURLChange(flexAppUrl); + } + } else { + getPlayer().browserURLChange(flexAppUrl); + } + } + } + } + + var _initialize = function () { + + browserHasHashChange = ("onhashchange" in document.body); + + if (browser.ie) + { + var scripts = document.getElementsByTagName('script'); + for (var i = 0, s; s = scripts[i]; i++) { + if (s.src.indexOf("history.js") > -1) { + var iframe_location = (new String(s.src)).replace("history.js", "historyFrame.html"); + } + } + historyFrameSourcePrefix = iframe_location + "?"; + var src = historyFrameSourcePrefix; + + var iframe = document.createElement("iframe"); + iframe.id = 'ie_historyFrame'; + iframe.name = 'ie_historyFrame'; + iframe.src = 'javascript:false;'; + + try { + document.body.appendChild(iframe); + } catch(e) { + setTimeout(function() { + document.body.appendChild(iframe); + }, 0); + } + } + + if (browser.safari && !browserHasHashChange) + { + var rememberDiv = document.createElement("div"); + rememberDiv.id = 'safari_rememberDiv'; + document.body.appendChild(rememberDiv); + rememberDiv.innerHTML = '<input type="text" id="safari_remember_field" style="width: 500px;">'; + + var formDiv = document.createElement("div"); + formDiv.id = 'safari_formDiv'; + document.body.appendChild(formDiv); + + var reloader_content = document.createElement('div'); + reloader_content.id = 'safarireloader'; + var scripts = document.getElementsByTagName('script'); + for (var i = 0, s; s = scripts[i]; i++) { + if (s.src.indexOf("history.js") > -1) { + html = (new String(s.src)).replace(".js", ".html"); + } + } + reloader_content.innerHTML = '<iframe id="safarireloader-iframe" src="about:blank" frameborder="no" scrolling="no"></iframe>'; + document.body.appendChild(reloader_content); + reloader_content.style.position = 'absolute'; + reloader_content.style.left = reloader_content.style.top = '-9999px'; + iframe = reloader_content.getElementsByTagName('iframe')[0]; + + if (document.getElementById("safari_remember_field").value != "" ) { + historyHash = document.getElementById("safari_remember_field").value.split(","); + } + } + + if (browserHasHashChange) + document.body.onhashchange = hashChangeHandler; + } + + return { + historyHash: historyHash, + backStack: function() { return backStack; }, + forwardStack: function() { return forwardStack }, + getPlayer: getPlayer, + initialize: function(src) { + _initialize(src); + }, + setURL: function(url) { + document.location.href = url; + }, + getURL: function() { + return document.location.href; + }, + getTitle: function() { + return document.title; + }, + setTitle: function(title) { + try { + backStack[backStack.length - 1].title = title; + } catch(e) { } + //if on safari, set the title to be the empty string. + if (browser.safari) { + if (title == "") { + try { + var tmp = window.location.href.toString(); + title = tmp.substring((tmp.lastIndexOf("/")+1), tmp.lastIndexOf("#")); + } catch(e) { + title = ""; + } + } + } + document.title = title; + }, + setDefaultURL: function(def) + { + defaultHash = def; + def = getHash(); + //trailing ? is important else an extra frame gets added to the history + //when navigating back to the first page. Alternatively could check + //in history frame navigation to compare # and ?. + if (browser.ie) + { + window['_ie_firstload'] = true; + var sourceToSet = historyFrameSourcePrefix + def; + var func = function() { + getHistoryFrame().src = sourceToSet; + window.location.replace("#" + def); + setInterval(checkForUrlChange, 50); + } + try { + func(); + } catch(e) { + window.setTimeout(function() { func(); }, 0); + } + } + + if (browser.safari) + { + currentHistoryLength = history.length; + if (historyHash.length == 0) { + historyHash[currentHistoryLength] = def; + var newloc = "#" + def; + window.location.replace(newloc); + } else { + //alert(historyHash[historyHash.length-1]); + } + setInterval(checkForUrlChange, 50); + } + + + if (browser.firefox || browser.opera) + { + var reg = new RegExp("#" + def + "$"); + if (window.location.toString().match(reg)) { + } else { + var newloc ="#" + def; + window.location.replace(newloc); + } + setInterval(checkForUrlChange, 50); + } + + }, + + /* Set the current browser URL; called from inside BrowserManager to propagate + * the application state out to the container. + */ + setBrowserURL: function(flexAppUrl, objectId) { + if (browser.ie && typeof objectId != "undefined") { + currentObjectId = objectId; + } + //fromIframe = fromIframe || false; + //fromFlex = fromFlex || false; + //alert("setBrowserURL: " + flexAppUrl); + //flexAppUrl = (flexAppUrl == "") ? defaultHash : flexAppUrl ; + + var pos = document.location.href.indexOf('#'); + var baseUrl = pos != -1 ? document.location.href.substr(0, pos) : document.location.href; + var newUrl = baseUrl + '#' + flexAppUrl; + + if (document.location.href != newUrl && document.location.href + '#' != newUrl) { + currentHref = newUrl; + addHistoryEntry(baseUrl, newUrl, flexAppUrl); + currentHistoryLength = history.length; + } + }, + + browserURLChange: function(flexAppUrl) { + var objectId = null; + if (browser.ie && currentObjectId != null) { + objectId = currentObjectId; + } + + if (typeof BrowserHistory_multiple != "undefined" && BrowserHistory_multiple == true) { + var pl = getPlayers(); + for (var i = 0; i < pl.length; i++) { + try { + pl[i].browserURLChange(flexAppUrl); + } catch(e) { } + } + } else { + try { + getPlayer(objectId).browserURLChange(flexAppUrl); + } catch(e) { } + } + + currentObjectId = null; + }, + getUserAgent: function() { + return navigator.userAgent; + }, + getPlatform: function() { + return navigator.platform; + } + + } + +})(); + +// Initialization + +// Automated unit testing and other diagnostics + +function setURL(url) +{ + document.location.href = url; +} + +function backButton() +{ + history.back(); +} + +function forwardButton() +{ + history.forward(); +} + +function goForwardOrBackInHistory(step) +{ + history.go(step); +} + +//BrowserHistoryUtils.addEvent(window, "load", function() { BrowserHistory.initialize(); }); +(function(i) { + var u =navigator.userAgent;var e=/*@cc_on!@*/false; + var st = setTimeout; + if(/webkit/i.test(u)){ + st(function(){ + var dr=document.readyState; + if(dr=="loaded"||dr=="complete"){i()} + else{st(arguments.callee,10);}},10); + } else if((/mozilla/i.test(u)&&!/(compati)/.test(u)) || (/opera/i.test(u))){ + document.addEventListener("DOMContentLoaded",i,false); + } else if(e){ + (function(){ + var t=document.createElement('doc:rdy'); + try{t.doScroll('left'); + i();t=null; + }catch(e){st(arguments.callee,0);}})(); + } else{ + window.onload=i; + } +})( function() {BrowserHistory.initialize();} );
http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Designer/html-template/history/historyFrame.html ---------------------------------------------------------------------- diff --git a/Radii8Designer/html-template/history/historyFrame.html b/Radii8Designer/html-template/history/historyFrame.html new file mode 100644 index 0000000..63bdd3e --- /dev/null +++ b/Radii8Designer/html-template/history/historyFrame.html @@ -0,0 +1,45 @@ +<!-- + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<html> + <head> + <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> + <META HTTP-EQUIV="Expires" CONTENT="-1"> + </head> + <body> + <script> + function processUrl() + { + + var pos = url.indexOf("?"); + url = pos != -1 ? url.substr(pos + 1) : ""; + if (!parent._ie_firstload) { + parent.BrowserHistory.setBrowserURL(url); + try { + parent.BrowserHistory.browserURLChange(url); + } catch(e) { } + } else { + parent._ie_firstload = false; + } + } + + var url = document.location.href; + processUrl(); + document.write(encodeURIComponent(url)); + </script> + Hidden frame for Browser History support. + </body> +</html> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Designer/html-template/index.template.html ---------------------------------------------------------------------- diff --git a/Radii8Designer/html-template/index.template.html b/Radii8Designer/html-template/index.template.html new file mode 100644 index 0000000..8a09ab1 --- /dev/null +++ b/Radii8Designer/html-template/index.template.html @@ -0,0 +1,158 @@ +<!-- + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> +<!-- saved from url=(0014)about:internet --> +<html xmlns="http://www.w3.org/1999/xhtml"; lang="en" xml:lang="en"> + <!-- + Smart developers always View Source. + + This application was built using Apache Flex, an open source framework + for building rich Internet applications that get delivered via the + Flash Player or to desktops and mobile phones via Adobe AIR. + + Learn more about Flex at http://flex.apache.org + // --> + <head> + <title>${title}</title> + <meta name="google" value="notranslate" /> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> + <!-- Include CSS to eliminate any default margins/padding and set the height of the html element and + the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as + the percentage of the height of its parent container, which has to be set explicitly. Fix for + Firefox 3.6 focus border issues. Initially, don't display flashContent div so it won't show + if JavaScript disabled. + --> + <style type="text/css" media="screen"> + html, body { height:100%; } + body { margin:0; padding:0; overflow:auto; text-align:center; + background-color: ${bgcolor}; } + object:focus { outline:none; } + #flashContent { display:none; } + </style> + + + <!-- NORMALIZE --> + <link rel="stylesheet" href="css/normalize/2.1.2/normalize.css"/> + + <!-- ACE editor --> + <script src="../src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script> + + <!-- RADII8 --> + <script src="js/Radiate.js" type="text/javascript" charset="utf-8"></script> + + <!-- USE BROWSER LOGIN --> + <script src="js/StoreLogin.js" type="text/javascript" charset="utf-8"></script> + + <script> + + function onloadHandler() { + radiate = Radiate.getInstance(); + //console.log("radiate: " + radiate); + window.onbeforeunload = radiate.beforeUnloadHandler; + } + + </script> + + <!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens --> + <!-- BEGIN Browser History required section ${useBrowserHistory}> + <link rel="stylesheet" type="text/css" href="history/history.css" /> + <script type="text/javascript" src="history/history.js"></script> + <!${useBrowserHistory} END Browser History required section --> + + <script type="text/javascript" src="swfobject.js"></script> + <script type="text/javascript"> + // For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. + var swfVersionStr = "${version_major}.${version_minor}.${version_revision}"; + // To use express install, set to playerProductInstall.swf, otherwise the empty string. + var xiSwfUrlStr = "${expressInstallSwf}"; + var flashvars = {}; + var params = {}; + params.quality = "high"; + params.bgcolor = "${bgcolor}"; + params.allowscriptaccess = "always"; + params.allowfullscreen = "true"; + var attributes = {}; + attributes.id = "${application}"; + attributes.name = "${application}"; + attributes.align = "middle"; + attributes.wmode = "opaque"; + swfobject.embedSWF( + "${swf}.swf", "flashContent", + "${width}", "${height}", + swfVersionStr, xiSwfUrlStr, + flashvars, params, attributes); + // JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. + swfobject.createCSS("#flashContent", "display:block;text-align:left;"); + </script> + </head> + + <body onload="onloadHandler()"> + <!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough + JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show + when JavaScript is disabled. + --> + <div id="flashContent"> + <p> + To view this page ensure that Adobe Flash Player version + ${version_major}.${version_minor}.${version_revision} or greater is installed. + </p> + <script type="text/javascript"> + var pageHost = ((document.location.protocol == "https:") ? "https://"; : "http://";); + document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" + + "get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); + </script> + </div> + + + <form id="bridgeForm" action="#" target="loginframe" autocomplete="on" style="display:none" method="post"> + <input type="text" name="username" id="username" /> + <input type="password" name="password" id="password"/> + </form> + <iframe id="loginframe" name="loginframe" src="blankpage.html" style="display:none"></iframe> + + <noscript> + <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="${width}" height="${height}" id="${application}"> + <param name="movie" value="${swf}.swf" /> + <param name="quality" value="high" /> + <param name="bgcolor" value="${bgcolor}" /> + <param name="allowScriptAccess" value="always" /> + <param name="allowFullScreen" value="true" /> + <param name="wmode" value="opaque" /> + <!--[if !IE]>--> + <object type="application/x-shockwave-flash" data="${swf}.swf" width="${width}" height="${height}"> + <param name="quality" value="high" /> + <param name="bgcolor" value="${bgcolor}" /> + <param name="allowScriptAccess" value="always" /> + <param name="allowFullScreen" value="true" /> + <param name="wmode" value="opaque" /> + <!--<![endif]--> + <!--[if gte IE 6]>--> + <p> + Either scripts and active content are not permitted to run or Adobe Flash Player version + ${version_major}.${version_minor}.${version_revision} or greater is not installed. + </p> + <!--<![endif]--> + <a href="http://www.adobe.com/go/getflashplayer";> + <img src="get_flash_player.gif" alt="Get Adobe Flash Player" /> + </a> + <!--[if !IE]>--> + </object> + <!--<![endif]--> + </object> + </noscript> + </body> +</html> http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Designer/html-template/swfobject.js ---------------------------------------------------------------------- diff --git a/Radii8Designer/html-template/swfobject.js b/Radii8Designer/html-template/swfobject.js new file mode 100644 index 0000000..8eafe9d --- /dev/null +++ b/Radii8Designer/html-template/swfobject.js @@ -0,0 +1,4 @@ +/* SWFObject v2.2 <http://code.google.com/p/swfobject/> + is released under the MIT License <http://www.opensource.org/licenses/mit-license.php> +*/ +var swfobject=function(){var D="undefined",r="object",S="Shockwave Flash",W="ShockwaveFlash.ShockwaveFlash",q="application/x-shockwave-flash",R="SWFObjectExprInst",x="onreadystatechange",O=window,j=document,t=navigator,T=false,U=[h],o=[],N=[],I=[],l,Q,E,B,J=false,a=false,n,G,m=true,M=function(){var aa=typeof j.getElementById!=D&&typeof j.getElementsByTagName!=D&&typeof j.createElement!=D,ah=t.userAgent.toLowerCase(),Y=t.platform.toLowerCase(),ae=Y?/win/.test(Y):/win/.test(ah),ac=Y?/mac/.test(Y):/mac/.test(ah),af=/webkit/.test(ah)?parseFloat(ah.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,X=!+"\v1",ag=[0,0,0],ab=null;if(typeof t.plugins!=D&&typeof t.plugins[S]==r){ab=t.plugins[S].description;if(ab&&!(typeof t.mimeTypes!=D&&t.mimeTypes[q]&&!t.mimeTypes[q].enabledPlugin)){T=true;X=false;ab=ab.replace(/^.*\s+(\S+\s+\S+$)/,"$1");ag[0]=parseInt(ab.replace(/^(.*)\..*$/,"$1"),10);ag[1]=parseInt(ab.replace(/^.*\.(.*)\s.*$/,"$1"),10);ag[2]=/[a-zA-Z]/.test(ab)?parseInt(ab.replace(/^.*[a- zA-Z]+(.*)$/,"$1"),10):0}}else{if(typeof O.ActiveXObject!=D){try{var ad=new ActiveXObject(W);if(ad){ab=ad.GetVariable("$version");if(ab){X=true;ab=ab.split(" ")[1].split(",");ag=[parseInt(ab[0],10),parseInt(ab[1],10),parseInt(ab[2],10)]}}}catch(Z){}}}return{w3:aa,pv:ag,wk:af,ie:X,win:ae,mac:ac}}(),k=function(){if(!M.w3){return}if((typeof j.readyState!=D&&j.readyState=="complete")||(typeof j.readyState==D&&(j.getElementsByTagName("body")[0]||j.body))){f()}if(!J){if(typeof j.addEventListener!=D){j.addEventListener("DOMContentLoaded",f,false)}if(M.ie&&M.win){j.attachEvent(x,function(){if(j.readyState=="complete"){j.detachEvent(x,arguments.callee);f()}});if(O==top){(function(){if(J){return}try{j.documentElement.doScroll("left")}catch(X){setTimeout(arguments.callee,0);return}f()})()}}if(M.wk){(function(){if(J){return}if(!/loaded|complete/.test(j.readyState)){setTimeout(arguments.callee,0);return}f()})()}s(f)}}();function f(){if(J){return}try{var Z=j.getElementsByTagName("body")[0].append Child(C("span"));Z.parentNode.removeChild(Z)}catch(aa){return}J=true;var X=U.length;for(var Y=0;Y<X;Y++){U[Y]()}}function K(X){if(J){X()}else{U[U.length]=X}}function s(Y){if(typeof O.addEventListener!=D){O.addEventListener("load",Y,false)}else{if(typeof j.addEventListener!=D){j.addEventListener("load",Y,false)}else{if(typeof O.attachEvent!=D){i(O,"onload",Y)}else{if(typeof O.onload=="function"){var X=O.onload;O.onload=function(){X();Y()}}else{O.onload=Y}}}}}function h(){if(T){V()}else{H()}}function V(){var X=j.getElementsByTagName("body")[0];var aa=C(r);aa.setAttribute("type",q);var Z=X.appendChild(aa);if(Z){var Y=0;(function(){if(typeof Z.GetVariable!=D){var ab=Z.GetVariable("$version");if(ab){ab=ab.split(" ")[1].split(",");M.pv=[parseInt(ab[0],10),parseInt(ab[1],10),parseInt(ab[2],10)]}}else{if(Y<10){Y++;setTimeout(arguments.callee,10);return}}X.removeChild(aa);Z=null;H()})()}else{H()}}function H(){var ag=o.length;if(ag>0){for(var af=0;af<ag;af++){var Y=o[af].id;var ab=o[af].callb ackFn;var aa={success:false,id:Y};if(M.pv[0]>0){var ae=c(Y);if(ae){if(F(o[af].swfVersion)&&!(M.wk&&M.wk<312)){w(Y,true);if(ab){aa.success=true;aa.ref=z(Y);ab(aa)}}else{if(o[af].expressInstall&&A()){var ai={};ai.data=o[af].expressInstall;ai.width=ae.getAttribute("width")||"0";ai.height=ae.getAttribute("height")||"0";if(ae.getAttribute("class")){ai.styleclass=ae.getAttribute("class")}if(ae.getAttribute("align")){ai.align=ae.getAttribute("align")}var ah={};var X=ae.getElementsByTagName("param");var ac=X.length;for(var ad=0;ad<ac;ad++){if(X[ad].getAttribute("name").toLowerCase()!="movie"){ah[X[ad].getAttribute("name")]=X[ad].getAttribute("value")}}P(ai,ah,Y,ab)}else{p(ae);if(ab){ab(aa)}}}}}else{w(Y,true);if(ab){var Z=z(Y);if(Z&&typeof Z.SetVariable!=D){aa.success=true;aa.ref=Z}ab(aa)}}}}}function z(aa){var X=null;var Y=c(aa);if(Y&&Y.nodeName=="OBJECT"){if(typeof Y.SetVariable!=D){X=Y}else{var Z=Y.getElementsByTagName(r)[0];if(Z){X=Z}}}return X}function A(){return !a&&F("6.0.65")&&(M.win ||M.mac)&&!(M.wk&&M.wk<312)}function P(aa,ab,X,Z){a=true;E=Z||null;B={success:false,id:X};var ae=c(X);if(ae){if(ae.nodeName=="OBJECT"){l=g(ae);Q=null}else{l=ae;Q=X}aa.id=R;if(typeof aa.width==D||(!/%$/.test(aa.width)&&parseInt(aa.width,10)<310)){aa.width="310"}if(typeof aa.height==D||(!/%$/.test(aa.height)&&parseInt(aa.height,10)<137)){aa.height="137"}j.title=j.title.slice(0,47)+" - Flash Player Installation";var ad=M.ie&&M.win?"ActiveX":"PlugIn",ac="MMredirectURL="+O.location.toString().replace(/&/g,"%26")+"&MMplayerType="+ad+"&MMdoctitle="+j.title;if(typeof ab.flashvars!=D){ab.flashvars+="&"+ac}else{ab.flashvars=ac}if(M.ie&&M.win&&ae.readyState!=4){var Y=C("div");X+="SWFObjectNew";Y.setAttribute("id",X);ae.parentNode.insertBefore(Y,ae);ae.style.display="none";(function(){if(ae.readyState==4){ae.parentNode.removeChild(ae)}else{setTimeout(arguments.callee,10)}})()}u(aa,ab,X)}}function p(Y){if(M.ie&&M.win&&Y.readyState!=4){var X=C("div");Y.parentNode.insertBefore(X,Y);X.parentNode.re placeChild(g(Y),X);Y.style.display="none";(function(){if(Y.readyState==4){Y.parentNode.removeChild(Y)}else{setTimeout(arguments.callee,10)}})()}else{Y.parentNode.replaceChild(g(Y),Y)}}function g(ab){var aa=C("div");if(M.win&&M.ie){aa.innerHTML=ab.innerHTML}else{var Y=ab.getElementsByTagName(r)[0];if(Y){var ad=Y.childNodes;if(ad){var X=ad.length;for(var Z=0;Z<X;Z++){if(!(ad[Z].nodeType==1&&ad[Z].nodeName=="PARAM")&&!(ad[Z].nodeType==8)){aa.appendChild(ad[Z].cloneNode(true))}}}}}return aa}function u(ai,ag,Y){var X,aa=c(Y);if(M.wk&&M.wk<312){return X}if(aa){if(typeof ai.id==D){ai.id=Y}if(M.ie&&M.win){var ah="";for(var ae in ai){if(ai[ae]!=Object.prototype[ae]){if(ae.toLowerCase()=="data"){ag.movie=ai[ae]}else{if(ae.toLowerCase()=="styleclass"){ah+=' class="'+ai[ae]+'"'}else{if(ae.toLowerCase()!="classid"){ah+=" "+ae+'="'+ai[ae]+'"'}}}}}var af="";for(var ad in ag){if(ag[ad]!=Object.prototype[ad]){af+='<param name="'+ad+'" value="'+ag[ad]+'" />'}}aa.outerHTML='<object classid="clsid:D27C DB6E-AE6D-11cf-96B8-444553540000"'+ah+">"+af+"</object>";N[N.length]=ai.id;X=c(ai.id)}else{var Z=C(r);Z.setAttribute("type",q);for(var ac in ai){if(ai[ac]!=Object.prototype[ac]){if(ac.toLowerCase()=="styleclass"){Z.setAttribute("class",ai[ac])}else{if(ac.toLowerCase()!="classid"){Z.setAttribute(ac,ai[ac])}}}}for(var ab in ag){if(ag[ab]!=Object.prototype[ab]&&ab.toLowerCase()!="movie"){e(Z,ab,ag[ab])}}aa.parentNode.replaceChild(Z,aa);X=Z}}return X}function e(Z,X,Y){var aa=C("param");aa.setAttribute("name",X);aa.setAttribute("value",Y);Z.appendChild(aa)}function y(Y){var X=c(Y);if(X&&X.nodeName=="OBJECT"){if(M.ie&&M.win){X.style.display="none";(function(){if(X.readyState==4){b(Y)}else{setTimeout(arguments.callee,10)}})()}else{X.parentNode.removeChild(X)}}}function b(Z){var Y=c(Z);if(Y){for(var X in Y){if(typeof Y[X]=="function"){Y[X]=null}}Y.parentNode.removeChild(Y)}}function c(Z){var X=null;try{X=j.getElementById(Z)}catch(Y){}return X}function C(X){return j.createElement(X)}function i(Z,X,Y){Z.attachEvent(X,Y);I[I.length]=[Z,X,Y]}function F(Z){var Y=M.pv,X=Z.split(".");X[0]=parseInt(X[0],10);X[1]=parseInt(X[1],10)||0;X[2]=parseInt(X[2],10)||0;return(Y[0]>X[0]||(Y[0]==X[0]&&Y[1]>X[1])||(Y[0]==X[0]&&Y[1]==X[1]&&Y[2]>=X[2]))?true:false}function v(ac,Y,ad,ab){if(M.ie&&M.mac){return}var aa=j.getElementsByTagName("head")[0];if(!aa){return}var X=(ad&&typeof ad=="string")?ad:"screen";if(ab){n=null;G=null}if(!n||G!=X){var Z=C("style");Z.setAttribute("type","text/css");Z.setAttribute("media",X);n=aa.appendChild(Z);if(M.ie&&M.win&&typeof j.styleSheets!=D&&j.styleSheets.length>0){n=j.styleSheets[j.styleSheets.length-1]}G=X}if(M.ie&&M.win){if(n&&typeof n.addRule==r){n.addRule(ac,Y)}}else{if(n&&typeof j.createTextNode!=D){n.appendChild(j.createTextNode(ac+" {"+Y+"}"))}}}function w(Z,X){if(!m){return}var Y=X?"visible":"hidden";if(J&&c(Z)){c(Z).style.visibility=Y}else{v("#"+Z,"visibility:"+Y)}}function L(Y){var Z=/[\\\"<>\.;]/;var X=Z.exec(Y)!=null;return X&&typeof encodeURIC omponent!=D?encodeURIComponent(Y):Y}var d=function(){if(M.ie&&M.win){window.attachEvent("onunload",function(){var ac=I.length;for(var ab=0;ab<ac;ab++){I[ab][0].detachEvent(I[ab][1],I[ab][2])}var Z=N.length;for(var aa=0;aa<Z;aa++){y(N[aa])}for(var Y in M){M[Y]=null}M=null;for(var X in swfobject){swfobject[X]=null}swfobject=null})}}();return{registerObject:function(ab,X,aa,Z){if(M.w3&&ab&&X){var Y={};Y.id=ab;Y.swfVersion=X;Y.expressInstall=aa;Y.callbackFn=Z;o[o.length]=Y;w(ab,false)}else{if(Z){Z({success:false,id:ab})}}},getObjectById:function(X){if(M.w3){return z(X)}},embedSWF:function(ab,ah,ae,ag,Y,aa,Z,ad,af,ac){var X={success:false,id:ah};if(M.w3&&!(M.wk&&M.wk<312)&&ab&&ah&&ae&&ag&&Y){w(ah,false);K(function(){ae+="";ag+="";var aj={};if(af&&typeof af===r){for(var al in af){aj[al]=af[al]}}aj.data=ab;aj.width=ae;aj.height=ag;var am={};if(ad&&typeof ad===r){for(var ak in ad){am[ak]=ad[ak]}}if(Z&&typeof Z===r){for(var ai in Z){if(typeof am.flashvars!=D){am.flashvars+="&"+ai+"="+Z[ai]}e lse{am.flashvars=ai+"="+Z[ai]}}}if(F(Y)){var an=u(aj,am,ah);if(aj.id==ah){w(ah,true)}X.success=true;X.ref=an}else{if(aa&&A()){aj.data=aa;P(aj,am,ah,ac);return}else{w(ah,true)}}if(ac){ac(X)}})}else{if(ac){ac(X)}}},switchOffAutoHideShow:function(){m=false},ua:M,getFlashPlayerVersion:function(){return{major:M.pv[0],minor:M.pv[1],release:M.pv[2]}},hasFlashPlayerVersion:F,createSWF:function(Z,Y,X){if(M.w3){return u(Z,Y,X)}else{return undefined}},showExpressInstall:function(Z,aa,X,Y){if(M.w3&&A()){P(Z,aa,X,Y)}},removeSWF:function(X){if(M.w3){y(X)}},createCSS:function(aa,Z,Y,X){if(M.w3){v(aa,Z,Y,X)}},addDomLoadEvent:K,addLoadEvent:s,getQueryParamValue:function(aa){var Z=j.location.search||j.location.hash;if(Z){if(/\?/.test(Z)){Z=Z.split("?")[1]}if(aa==null){return L(Z)}var Y=Z.split("&");for(var X=0;X<Y.length;X++){if(Y[X].substring(0,Y[X].indexOf("="))==aa){return L(Y[X].substring((Y[X].indexOf("=")+1)))}}}return""},expressInstallCallback:function(){if(a){var X=c(R);if(X&&l){X.parentNode. replaceChild(l,X);if(Q){w(Q,true);if(M.ie&&M.win){l.style.display="block"}}if(E){E(B)}}a=false}}}}(); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-radii8/blob/f370bfcf/Radii8Designer/readme.txt ---------------------------------------------------------------------- diff --git a/Radii8Designer/readme.txt b/Radii8Designer/readme.txt new file mode 100644 index 0000000..a5406bd --- /dev/null +++ b/Radii8Designer/readme.txt @@ -0,0 +1,193 @@ + + THOUGHTS ON SUSTAINABILITY + + Quote from Digg, + "During beta, the Digg RSS reader is free. In a survey Digg published last month on its blog, + however, the company found that over 40 percent of respondents are + "willing to pay for a Google Reader replacement." The company noted alongside the finding + that, "Free products on the Internet don't have a great track record. They tend to disappear, + leaving users in a lurch. We need to build a product that people can rely on and trust will + always be there for them. We're not sure how pricing might work, but we do know that we'd + like our users to be our customers, not our product." + + + Readings for new developers + Thoughts on html design and development process and export + http://24ways.org/2009/make-your-mockup-in-markup/ + http://www.sitepoint.com/forums/showthread.php?869812-Exactly-How-To-make-pixel-perfect-HTML-CSS-from-PNG-PSD + http://elliotnash.me/why-designers-are-talking-about-the-wrong-thing?utm_source=buffer&utm_campaign=Buffer&utm_content=buffer970d2&utm_medium=twitter + http://lifehacker.com/5974605/learn-beginner-and-advanced-htmlcss-skills-for-free + http://learn.shayhowe.com/html-css/box-model + http://bradfrostweb.com/blog/post/development-is-design/?utm_source=buffer&utm_campaign=Buffer&utm_content=buffer27075&utm_medium=twitter + http://dizyne.net/40-best-html5-development-tools-save-time/ + + Design workflows + http://www.vanseodesign.com/blog/page/8/ + + + + DESIGN VIEW FEATURE REQUIREMENTS + + The design view is the most important part of the application. + It must support the following features: + + ⢠drag and drop - move + ⢠rotate + â¢Â resize - drag handles + â¢Â drag into group, drag out of group + ⢠zoom in and zoom out, other functions work while zoomed in and out + â¢Â drag item from off screen into screen + â¢Â support scrollbars + â¢Â select and work with components in the flex component tree (select tool) + â¢Â select and work with graphic primitives (direct selection tool?) + â¢Â support filters + ⢠remove listeners - so components don't react (button press doesn't change state, etc) + â¢Â states + â¢Â transitions + â¢Â measurement rulers + â¢Â alignment tools + â¢Â multiselection + â¢Â rich editable text on double click of text component + â¢Â overlay of image (for example iphone, ipad or layout grid or mock up image) + â¢Â snap to grid (while dragging) + â¢Â snap to other elements (while dragging) + ⢠snap to rulers + â¢Â background image (used to compare design spec as you work - onion skin) + + ADDITIONAL FEATURE REQUIREMENTS + â¢Â Templates - users can use their own MXML, HTML, PHP, etc templates and indicate locations for CSS, script includes, code blocks and layout + â¢Â Desktop environment - users can run on the desktop + â¢Â Compiler integration - users can compile using the mxmlc or Falcon + â¢Â Flex project support - users can connect to their Flex projects + â¢Â Wordpress integration - users can create their own theme. tokens can be used to repeat sections and get values. results are assembled on the server by a theme assembler + â¢Â Editors - users can create or edit text documents. using Ace editor or Moonshine to syntax highlight + â¢Â Append CSS - users can append CSS to add to element CSS block and override the generated CSS + ⢠Includes - a view exists of external scripts to include (for CSS, JavaScript, MXML script) + â¢Â Declarations - a view showing declared objects + â¢Â Publishing - users can publish to their server (using Wordpress) or add in FTP for desktop version + â¢Â ActionEffects - users can assemble actions based on ActionEffects and create different action paths + â¢Â AST - a syntax tree can be created for code completion, documentation and error handling + â¢Â Compiler integration - compiler can provide a problems panel (desktop only?) + â¢Â Import and Export plugins - new or improved import and export plugins can be added to the environment for better input and output + â¢Â Plugins - new and improved plugins can be added to the environment to add new or better feature sets + â¢Â Tools - new and improved tools can be added to the environment to add new or better feature sets + â¢Â Commands - can be added to the environment to add missing or necessary functionality + â¢Â Document types - new document types can be added for additional functionality. text, vector graphics editor + â¢Â State inheritance - users should be able to create states based on other states (this exists in Flex via basedOn property) this can be used for design templates exporting pages based on state + â¢Â Multi language support - users should be able to add and integrate server side code in the output. for example add PHP that wraps around an element or section of code + â¢Â Different work flows for output results - one is to generate code (one way), the other is create an AST from code (round trip), another is a mix of both including search and replace tokens and generated code in templates + ⢠Examples - starting points and examples should be included for partial and even full example sites and apps + â¢Â Previews - users should be able to preview in HTML or application (possibly in another browser or FP instance) + ⢠Import of PSD, AI files - users should be able to import PSD or AI. AS3 importers exist + â¢Â CSS view - show styles applied to component and inherited from containers + ⢠Vector graphics editor - users should be able to create and edit vector graphics and use as skins + â¢Â Animation timeline - users should be able to animate and trigger effects on elements (see ActionEffects) + ⢠Export options - panel for setting export options. for example, when converting to HTML, convert text element to an image option + + Document Classes + The document classes were made to support saving to local shared objects and remote save and retrieve to Wordpress were tacked on later. + Documents don't yet support the file system for read and write. They need to support data coming from anywhere + (dynamic instance, local shared object, file system, Wordpress API, database, etc). + There is always a question if undo and redo, save, load and open should be in the Document or the Radiate class. + I can't settle on one or the other but I'm leaning towards Document to have all the code and Radiate be a + wrapper that calls methods on the document class. They could be refactored. + + Runtime Design layers + http://sourceforge.net/adobe/flexsdk/wiki/Runtime%20Design%20Layers/ + + + Putting CSS in the head of the HTML page + https://medium.com/coding-design/24888fbbd2e2 + + ICONS and IMAGES + + This projects uses common icons from Eclipse, the Apache Flex SDK and default OS but may not be royalty free. + We need to check to see if any are copyrighted and replaced if need be before going live + http://www.arungudelli.com/free/best-free-social-media-icons/ + + + PEOPLE LOOKING FOR TUTORIALS + https://plus.google.com/103431617731538429495/posts/XeR8PAgqaeQ + https://plus.google.com/101488159983725354983/posts/Dxh5kQi4cjG + + http://www.floreysoft.com/en/products.html + + Other Reasons for doing this project + http://www.businessinsider.com/syndromes-drive-coders-crazy-2014-3 + http://startingdotneprogramming.blogspot.com/2013/04/i-knew-programmer-that-went-completely.html + + Flash Plugins + Adobe Flash Extension (Plugins) for Character Animation + + Flash Power Tools Animation + http://flash-powertools.com/ + + TrickOrScript + http://www.trickorscript.com/tricksandscripts.html + + CloudKid Tools + http://cloudkid.com/tools + + Ajar Productions + http://ajarproductions.com/blog/category/extensions/ + + Dave Logan's Extensions + http://www.animatordavelogan.com/extensions/ + + ToonMonkey Extensions + http://www.toonmonkey.com/extensions.html + + + JS BASE 64 Encode / Decode + http://jsbase64.codeplex.com/ + + + APPLICATION TYPES + + There are three main types of loaded sub-applications in Flex: + + Single-versioned applications + are guaranteed to have been compiled with the same version of the compiler as the main application. They have the greatest level of interoperability with the main application, but they also require that you have complete control over the source of the sub-applications. + + Multi-versioned applications + can be compiled with older versions of the Flex framework than the main application that loads them. Their interoperability with the main application and other sub-applications is more limited than single-versioned applications. + + Sandboxed applications + are loaded into their own security domains, and can be multi-versioned. Using sandboxed applications is the recommended practice for loading third-party applications. In addition, if your sub-applications use RPC or DataServices-related functionality, you should load them as sandboxed. + + When compiling each of these types of applications, you should include the MarshallingSupport class into the main application and sub-applications. You do this with the includes compiler argument, as the following example shows: + + -includes=mx.managers.systemClasses.MarshallingSupport + + We use an application as a design canvas for a few reasons. + + 1. To import a remote application and allow editing + 2. To sandbox styles with the style manager + 3. To sandbox the application importing components at runtime from the development environment + + + GOOGLE TEST PAGE IMPORT MXML + +<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:s="library://ns.adobe.com/flex/spark" > + <s:BorderContainer x="0" height="30" percentWidth="100" y="0" borderVisible="false" color="#CCCCCC" backgroundColor="#000000"> + <s:HGroup x="10" gap="16" y="5" fontWeight="bold"> + <s:Label x="99" y="128" text="+you"/> + <s:Label text="Search"/> + <s:Label text="Images"/> + <s:Label text="YouTube"/> + <s:Label text="Maps"/> + <s:Label text="etc"/> + </s:HGroup> + </s:BorderContainer> + <s:Image height="95" horizontalCenter="0" y="200" source="https://www.google.com/images/srpr/logo4w.png"; width="269"/> + <s:HGroup horizontalCenter="0" x="500" y="380"> + <s:Button label="Google Search" x="340" y="2"/> + <s:Button label="I'm Feeling Lucky" x="418" y="327"/> + </s:HGroup> + <s:TextInput horizontalCenter="0" x="292" percentWidth="50" y="330"/> + <s:Image x="1154" top="0" y="1" source=""/> +</s:Application> + + TEST COMPONENT BOUNDS + +<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:s="library://ns.adobe.com/flex/spark"> <s:BorderContainer x="205" y="324"/> <s:HGroup x="299" y="105"> <s:Spacer/> </s:HGroup> <s:LinkButton x="522" y="166"/> <s:RichText x="628" y="166"/> <s:TextArea x="470" y="326"/> <s:Button x="622" y="255"/> <s:CheckBox x="218" y="166"/> <s:Label x="11" y="19" text="TEST COMPONENT BOUNDS" fontSize="25"/> <s:Image x="561" y="255"/> <s:Label x="471" y="405" text="DataGrid"/> <s:Label x="560" y="237" text="Image"/> <s:RadioButton x="436" y="255"/> <s:Label x="739" y="150" text="VSlider"/> <s:ComboBox dataProvider="Item 1,Item 2,Item 3" x="22" y="166"/> <s:Label x="469" y="312" text="Text Area"/> <s:HSlider x="324" y="166"/> <s:Label x="622" y="237" text="Button"/> <s:Label x="206" y="312" text="Border Container"/> <s:VSlider x="749" y="167"/> <s:List dataProvider="Item 1,Item 2,Item 3" x="22" y="326"/> <s:Label x="22" y="310" text="List"/> <s:Label x="254" y="23 7" text="Drop Down List"/> <s:Label x="438" y="237" text="Radio Button"/> <s:Label x="531" y="150" text="Link"/> <s:ToggleButton x="164" y="255"/> <s:Label x="324" y="150" text="HSlider"/> <s:Label x="23" y="150" text="ComboBox"/> <s:DropDownList dataProvider="Item 1,Item 2,Item 3" x="253" y="255"/> <s:Label x="218" y="150" text="Checkbox"/> <s:Label x="164" y="237" text="Toggle"/> <s:Label x="22" y="237" text="Text Input"/> <s:DataGrid x="469" y="418"/> <s:TextInput x="22" y="255"/> <s:Label x="627" y="150" text="Rich Text"/> </s:Application>
![https://www.google.com/images/srpr/logo4w.png"](https://www.google.com/images/srpr/logo4w.png"){kind=link}