diff options
Diffstat (limited to 'contexts/data/lib/closure-library/closure/goog/ui/emoji/emojipicker_test.html')
| -rw-r--r-- | contexts/data/lib/closure-library/closure/goog/ui/emoji/emojipicker_test.html | 840 |
1 files changed, 0 insertions, 840 deletions
diff --git a/contexts/data/lib/closure-library/closure/goog/ui/emoji/emojipicker_test.html b/contexts/data/lib/closure-library/closure/goog/ui/emoji/emojipicker_test.html deleted file mode 100644 index 9beb78f..0000000 --- a/contexts/data/lib/closure-library/closure/goog/ui/emoji/emojipicker_test.html +++ /dev/null @@ -1,840 +0,0 @@ -<!DOCTYPE html> -<html> -<!-- -Copyright 2007 The Closure Library Authors. All Rights Reserved. - -Use of this source code is governed by the Apache License, Version 2.0. -See the COPYING file for details. ---> -<head> -<meta http-equiv="X-UA-Compatible" content="IE=edge"> -<title>Closure Unit Tests - goog.ui.emoji.EmojiPicker</title> -<script src="../../base.js"></script> -<script> - goog.require('goog.dom'); - goog.require('goog.testing.jsunit'); - goog.require('goog.ui.emoji.EmojiPicker'); - goog.require('goog.ui.emoji.SpriteInfo'); -</script> - <link rel="stylesheet" href="../../demos/css/emojisprite.css" /> -</head> -<body> - -<div id="test1"></div> - -<script> - - -// 26 emoji -var emojiGroup1 = [ - 'Emoji 1', - [ - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'] - ]]; - -// 20 emoji -var emojiGroup2 = [ - 'Emoji 2', - [ - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'] - ]]; - -// 20 emoji -var emojiGroup3 = [ - 'Emoji 3', - [ - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'] - ]]; - - var sprite = '../../demos/emoji/sprite.png'; - var sprite2 = '../../demos/emoji/sprite2.png'; - -/** - * Creates a SpriteInfo object with the specified properties. If the image is - * sprited via CSS, then only the first parameter needs a value. If the image - * is sprited via metadata, then the first parameter should be left null. - * - * @param {?string} cssClass CSS class to properly display the sprited image. - * @param {string=} opt_url Url of the sprite image. - * @param {number=} opt_width Width of the image being sprited. - * @param {number=} opt_height Height of the image being sprited. - * @param {number=} opt_xOffset Positive x offset of the image being sprited - * within the sprite. - * @param {number=} opt_yOffset Positive y offset of the image being sprited - * within the sprite. - * @param {boolean=} opt_animated Whether the sprite info is for an animated - * emoji. - */ -function si(cssClass, opt_url, opt_width, opt_height, opt_xOffset, - opt_yOffset, opt_animated) { - return new goog.ui.emoji.SpriteInfo(cssClass, opt_url, opt_width, - opt_height, opt_xOffset, opt_yOffset, opt_animated); -} - -// Contains a mix of sprited emoji via css, sprited emoji via metadata, and -// non-sprited emoji -var spritedEmoji1 = [ - 'Emoji 1', - [ - ['../../demos/emoji/200.gif', 'std.200', si('SPRITE_200')], - ['../../demos/emoji/201.gif', 'std.201', si('SPRITE_201')], - ['../../demos/emoji/202.gif', 'std.202', si('SPRITE_202')], - ['../../demos/emoji/203.gif', 'std.203', si('SPRITE_203')], - ['../../demos/emoji/204.gif', 'std.204', si('SPRITE_204')], - ['../../demos/emoji/200.gif', 'std.200', si('SPRITE_200')], - ['../../demos/emoji/201.gif', 'std.201', si('SPRITE_201')], - ['../../demos/emoji/202.gif', 'std.202', si('SPRITE_202')], - ['../../demos/emoji/203.gif', 'std.203', si('SPRITE_203')], - ['../../demos/emoji/2BE.gif', 'std.2BE', - si(null, sprite, 18, 18, 36, 54)], - ['../../demos/emoji/2BF.gif', 'std.2BF', - si(null, sprite, 18, 18, 0, 126)], - ['../../demos/emoji/2C0.gif', 'std.2C0', - si(null, sprite, 18, 18, 18, 305)], - ['../../demos/emoji/2C1.gif', 'std.2C1', - si(null, sprite, 18, 18, 0, 287)], - ['../../demos/emoji/2C2.gif', 'std.2C2', - si(null, sprite, 18, 18, 18, 126)], - ['../../demos/emoji/2C3.gif', 'std.2C3', - si(null, sprite, 18, 18, 36, 234)], - ['../../demos/emoji/2C4.gif', 'std.2C4', - si(null, sprite, 18, 18, 36, 72)], - ['../../demos/emoji/2C5.gif', 'std.2C5', - si(null, sprite, 18, 18, 54, 54)], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'], - ['../../demos/emoji/204.gif', 'std.204'], - ['../../demos/emoji/200.gif', 'std.200'], - ['../../demos/emoji/201.gif', 'std.201'], - ['../../demos/emoji/202.gif', 'std.202'], - ['../../demos/emoji/203.gif', 'std.203'] - ]]; - -// This group contains a mix of sprited emoji via css, sprited emoji via -// metadata, and non-sprited emoji. -var spritedEmoji2 = [ - 'Emoji 1', - [ - ['../../demos/emoji/200.gif', 'std.200', si('SPRITE_200')], - ['../../demos/emoji/201.gif', 'std.201', si('SPRITE_201')], - ['../../demos/emoji/202.gif', 'std.202', si('SPRITE_202')], - ['../../demos/emoji/203.gif', 'std.203', si('SPRITE_203')], - ['../../demos/emoji/204.gif', 'std.204', si('SPRITE_204')], - ['../../demos/emoji/200.gif', 'std.200', si('SPRITE_200')], - ['../../demos/emoji/201.gif', 'std.201', si('SPRITE_201')], - ['../../demos/emoji/202.gif', 'std.202', si('SPRITE_202')], - ['../../demos/emoji/203.gif', 'std.203', si('SPRITE_203')], - ['../../demos/emoji/2BE.gif', 'std.2BE', - si(null, sprite, 18, 18, 36, 54)], - ['../../demos/emoji/2BF.gif', 'std.2BF', - si(null, sprite, 18, 18, 0, 126)], - ['../../demos/emoji/2C0.gif', 'std.2C0', - si(null, sprite, 18, 18, 18, 305)], - ['../../demos/emoji/2C1.gif', 'std.2C1', - si(null, sprite, 18, 18, 0, 287)], - ['../../demos/emoji/2C2.gif', 'std.2C2', - si(null, sprite, 18, 18, 18, 126)], - ['../../demos/emoji/2C3.gif', 'std.2C3', - si(null, sprite, 18, 18, 36, 234)], - ['../../demos/emoji/2C4.gif', 'std.2C4', - si(null, sprite, 18, 18, 36, 72)], - ['../../demos/emoji/2C5.gif', 'std.2C5', - si(null, sprite, 18, 18, 54, 54)], - ['../../demos/emoji/2C6.gif', 'std.2C6'], - ['../../demos/emoji/2C7.gif', 'std.2C7'], - ['../../demos/emoji/2C8.gif', 'std.2C8'], - ['../../demos/emoji/2C9.gif', 'std.2C9'], - ['../../demos/emoji/2CA.gif', 'std.2CA', - si(null, sprite2, 18, 20, 36, 72, 1)], - ['../../demos/emoji/2E3.gif', 'std.2E3', - si(null, sprite2, 18, 18, 0, 0, 1)], - ['../../demos/emoji/2EF.gif', 'std.2EF', - si(null, sprite2, 18, 20, 0, 300, 1)], - ['../../demos/emoji/2F1.gif', 'std.2F1', - si(null, sprite2, 18, 18, 0, 320, 1)] - ]]; - -var emojiGroups = [emojiGroup1, emojiGroup2, emojiGroup3]; - -function testConstructAndRenderOnePageEmojiPicker() { - var picker = new goog.ui.emoji.EmojiPicker('../../demos/emoji/none.gif'); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.render(); - picker.dispose(); -} - -function testConstructAndRenderMultiPageEmojiPicker() { - var picker = new goog.ui.emoji.EmojiPicker('../../demos/emoji/none.gif'); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.addEmojiGroup(emojiGroup2[0], emojiGroup2[1]); - picker.addEmojiGroup(emojiGroup3[0], emojiGroup3[1]); - picker.render(); - picker.dispose(); -} - -function testExitDocumentCleansUpProperlyForSinglePageEmojiPicker() { - var picker = new goog.ui.emoji.EmojiPicker('../../demos/emoji/none.gif'); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.render(); - picker.enterDocument(); - picker.exitDocument(); - picker.dispose(); -} - -function testExitDocumentCleansUpProperlyForMultiPageEmojiPicker() { - var picker = new goog.ui.emoji.EmojiPicker('../../demos/emoji/none.gif'); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.addEmojiGroup(emojiGroup2[0], emojiGroup2[1]); - picker.render(); - picker.enterDocument(); - picker.exitDocument(); - picker.dispose(); -} - -function testNumGroups() { - var picker = new goog.ui.emoji.EmojiPicker('../../demos/emoji/none.gif'); - - for (var i = 0; i < emojiGroups.length; i++) { - picker.addEmojiGroup(emojiGroups[i][0], emojiGroups[i][1]); - } - - assertTrue(picker.getNumEmojiGroups() == emojiGroups.length); -} - -function testAdjustNumRowsIfNecessaryIsCorrect() { - var picker = new goog.ui.emoji.EmojiPicker('../../demos/emoji/none.gif'); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.setAutoSizeByColumnCount(true); - picker.setNumColumns(5); - assertEquals(5, picker.getNumColumns()); - assertEquals(goog.ui.emoji.EmojiPicker.DEFAULT_NUM_ROWS, picker.getNumRows()); - - picker.adjustNumRowsIfNecessary_(); - - // The emojiGroup has 26 emoji. ceil(26/5) should give 6 rows. - assertEquals(6, picker.getNumRows()); - - // Change col count to 10, should give 3 rows. - picker.setNumColumns(10); - picker.adjustNumRowsIfNecessary_(); - assertEquals(3, picker.getNumRows()); - - // Add another gruop, with 20 emoji. Deliberately set the number of rows too - // low. It should adjust it to three to accommodate the emoji in the first - // group. - picker.addEmojiGroup(emojiGroup2[0], emojiGroup2[1]); - picker.setNumColumns(10); - picker.setNumRows(2); - picker.adjustNumRowsIfNecessary_(); - assertEquals(3, picker.getNumRows()); -}; - -/** - * Helper for testDelayedLoad. Returns true if the two paths end with the same - * file. - * - * E.g., ('../../cool.gif', 'file:///home/usr/somewhere/cool.gif') --> true - * - * @param {string} path1 First url - * @param {string} path2 Second url - */ -function checkPathsEndWithSameFile(path1, path2) { - var pieces1 = path1.split('/'); - var file1 = pieces1[pieces1.length - 1]; - var pieces2 = path2.split('/'); - var file2 = pieces2[pieces2.length - 1]; - - return file1 == file2; -} - -/** - * Gets the emoji URL from a palette element. Palette elements are divs or - * imgs wrapped in an outer div. The returns the background-image if it's a div, - * or the src attribute if it's an image. - * - * @param {Element} element Element to get the image url for - * @return string - */ -function getImageUrl(element) { - element = element.firstChild; // get the wrapped element - if (element.tagName == 'IMG') { - return element.src; - } else { - var url = goog.style.getStyle(element, 'background-image'); - url = url.replace(/url\(/, ''); - url = url.replace(/\)/, ''); - return url; - } -} - -/** - * Checks that the content of an emojipicker page is all images pointing to - * the default img. - * - * @param {goog.ui.emoji.EmojiPalette} page The page of the picker to check - * @param {string} defaultImgUrl The url of the default img - */ -function checkContentIsDefaultImg(page, defaultImgUrl) { - var content = page.getContent(); - - for (var i = 0; i < content.length; i++) { - var url = getImageUrl(content[i]); - assertTrue('img src should be ' + defaultImgUrl + ' but is ' + - url, - checkPathsEndWithSameFile(url, defaultImgUrl)); - } -} - - -/** - * Checks that the content of an emojipicker page is the specified emoji and - * the default img after the emoji are all used. - * - * @param {goog.ui.emoji.EmojiPalette} page The page of the picker to check - * @param {Array.<Array.<string>>} emojiList List of emoji that should be in the - * palette - * @param {string} defaultImgUrl The url of the default img - */ -function checkContentIsEmojiImages(page, emojiList, defaultImg) { - var content = page.getContent(); - - for (var i = 0; i < content.length; i++) { - var url = getImageUrl(content[i]); - if (i < emojiList.length) { - assertTrue('Paths should end with the same file: ' + - url + ', ' + emojiList[i][0], - checkPathsEndWithSameFile(url, emojiList[i][0])); - } else { - assertTrue('Paths should end with the same file: ' + - url + ', ' + defaultImg, - checkPathsEndWithSameFile(url, defaultImg)); - } - } -} - - -function testNonDelayedLoadPaletteCreationForSinglePagePicker() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.render(); - - var page = picker.getPage(0); - assertTrue('Page should be in the document but is not', page.isInDocument()); - - // The content should be the actual emoji images now, with the remainder set - // to the default img - checkContentIsEmojiImages(page, emojiGroup1[1], defaultImg); - - picker.dispose(); -} - - -function testNonDelayedLoadPaletteCreationForMultiPagePicker() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - - for (var i = 0; i < emojiGroups.length; i++) { - picker.addEmojiGroup(emojiGroups[i][0], emojiGroups[i][1]); - } - - picker.render(); - - for (var i = 0; i < emojiGroups.length; i++) { - var page = picker.getPage(i); - assertTrue('Page ' + i + ' should be in the document but is not', - page.isInDocument()); - checkContentIsEmojiImages(page, emojiGroups[i][1], defaultImg); - } - - picker.dispose(); -} - - -function testDelayedLoadPaletteCreationForSinglePagePicker() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(true); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.render(); - - // At this point the picker should have pages filled with the default img - checkContentIsDefaultImg(picker.getPage(0), defaultImg); - - // Now load the images - picker.loadImages(); - - var page = picker.getPage(0); - assertTrue('Page should be in the document but is not', page.isInDocument()); - - // The content should be the actual emoji images now, with the remainder set - // to the default img - checkContentIsEmojiImages(page, emojiGroup1[1], defaultImg); - - picker.dispose(); -} - - -function testGetSelectedEmoji() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - picker.addEmojiGroup(emojiGroup1[0], emojiGroup1[1]); - picker.render(); - - var palette = picker.getPage(0); - - // No emoji should be selected yet - assertUndefined(palette.getSelectedEmoji()); - - // Artificially select the first emoji - palette.setSelectedIndex(0); - - // Now we should get the first emoji back. See emojiGroup1 above. - var emoji = palette.getSelectedEmoji(); - assertEquals(emoji.getId(), 'std.200'); - assertEquals(emoji.getUrl(), '../../demos/emoji/200.gif'); - - picker.dispose(); -} - - -/** - * Checks and verifies the structure of a non-progressively-rendered - * emojipicker. - * - * @param {goog.ui.emoji.EmojiPalette} palette Emoji palette to check. - * @param {Array.<Array.<string>>} emoji Emoji that should be in the palette. - */ -function checkStructureForNonProgressivePicker(palette, emoji) { - // We can hackily check the items by selecting an item and then getting the - // selected item. - for (var i = 0; i < emoji[1].length; i++) { - palette.setSelectedIndex(i); - var emojiInfo = emoji[1][i]; - var cell = palette.getSelectedItem(); - var inner = cell.firstChild; - - // Check that the cell is a div wrapped around something else, and that the - // outer div contains the goomoji attribute - assertEquals('The palette item should be a div wrapped around something', - cell.tagName, "DIV"); - assertNotNull('The outer div is not wrapped around another element', inner); - assertEquals('The palette item should have the goomoji attribute', - cell.getAttribute(goog.ui.emoji.Emoji.ATTRIBUTE), emojiInfo[1]); - - // Now check the contents of the cells - var spriteInfo = emojiInfo[2]; - if (spriteInfo) { - assertEquals(inner.tagName, "DIV"); - var cssClass = spriteInfo.getCssClass(); - if (cssClass) { - assertTrue('Sprite should have its CSS class set', - goog.dom.classes.has(inner, cssClass)); - } else { - checkPathsEndWithSameFile( - goog.style.getStyle(inner, 'background-image'), - spriteInfo.getUrl()); - assertEquals(spriteInfo.getWidthCssValue(), - goog.style.getStyle(inner, 'width')); - assertEquals(spriteInfo.getHeightCssValue(), - goog.style.getStyle(inner, 'height')); - assertEquals((spriteInfo.getXOffsetCssValue() + ' ' + - spriteInfo.getYOffsetCssValue()).replace(/px/g, ''). - replace(/pt/g, ''), - goog.style.getStyle(inner, - 'background-position').replace(/px/g, ''). - replace(/pt/g, '')); - } - } else { - // A non-sprited emoji is just an img - assertEquals(inner.tagName, "IMG"); - checkPathsEndWithSameFile(inner.src, emojiInfo[0]); - } - } -} - - -/** - * Checks and verifies the structure of a progressively-rendered emojipicker. - * - * @param {goog.ui.emoji.EmojiPalette} palette Emoji palette to check. - * @param {Array.<Array.<string>>} emoji Emoji that should be in the palette. - */ -function checkStructureForProgressivePicker(palette, emoji) { - // We can hackily check the items by selecting an item and then getting the - // selected item. - for (var i = 0; i < emoji[1].length; i++) { - palette.setSelectedIndex(i); - var emojiInfo = emoji[1][i]; - var cell = palette.getSelectedItem(); - var inner = cell.firstChild; - - // Check that the cell is a div wrapped around something else, and that the - // outer div contains the goomoji attribute - assertEquals('The palette item should be a div wrapped around something', - cell.tagName, "DIV"); - assertNotNull('The outer div is not wrapped around another element', inner); - assertEquals('The palette item should have the goomoji attribute', - cell.getAttribute(goog.ui.emoji.Emoji.ATTRIBUTE), emojiInfo[1]); - - // Now check the contents of the cells - var spriteInfo = emojiInfo[2]; - if (spriteInfo) { - var cssClass = spriteInfo.getCssClass(); - if (cssClass) { - assertEquals("DIV", inner.tagName); - assertTrue('Sprite should have its CSS class set', - goog.dom.classes.has(inner, cssClass)); - } else { - // There's an inner div wrapping an img tag - assertEquals("DIV", inner.tagName); - var img = inner.firstChild; - assertNotNull('Div should be wrapping something', img); - assertEquals("IMG", img.tagName); - checkPathsEndWithSameFile(img.src, spriteInfo.getUrl()); - assertEquals(spriteInfo.getWidthCssValue(), - goog.style.getStyle(inner, 'width')); - assertEquals(spriteInfo.getHeightCssValue(), - goog.style.getStyle(inner, 'height')); - assertEquals(spriteInfo.getXOffsetCssValue().replace(/px/, ''). - replace(/pt/, ''), - goog.style.getStyle(img, 'left').replace(/px/, ''). - replace(/pt/, '')); - assertEquals(spriteInfo.getYOffsetCssValue().replace(/px/, ''). - replace(/pt/, ''), - goog.style.getStyle(img, 'top').replace(/px/, ''). - replace(/pt/, '')); - } - } else { - // A non-sprited emoji is just an img - assertEquals(inner.tagName, "IMG"); - checkPathsEndWithSameFile(inner.src, emojiInfo[0]); - } - } -} - - -/** - * Checks and verifies the structure of a non-progressive fast-loading picker - * after the animated emoji have loaded. - * - * @param {goog.ui.emoji.EmojiPalette} palette Emoji palette to check. - * @param {Array.<Array.<string>>} emoji Emoji that should be in the palette. - */ -function checkPostLoadStructureForFastLoadNonProgressivePicker(palette, emoji) { - for (var i = 0; i < emoji[1].length; i++) { - palette.setSelectedIndex(i); - var emojiInfo = emoji[1][i]; - var cell = palette.getSelectedItem(); - var inner = cell.firstChild; - - // Check that the cell is a div wrapped around something else, and that the - // outer div contains the goomoji attribute - assertEquals('The palette item should be a div wrapped around something', - cell.tagName, "DIV"); - assertNotNull('The outer div is not wrapped around another element', inner); - assertEquals('The palette item should have the goomoji attribute', - cell.getAttribute(goog.ui.emoji.Emoji.ATTRIBUTE), emojiInfo[1]); - - // Now check the contents of the cells - var url = emojiInfo[0]; // url of the animated emoji - var spriteInfo = emojiInfo[2]; - if (spriteInfo) { - assertEquals(inner.tagName, "DIV"); - if (spriteInfo.isAnimated()) { - var img = new Image(); - img.src = url; - checkPathsEndWithSameFile( - goog.style.getStyle(inner, 'background-image'), - url); - assertEquals(String(img.width), goog.style.getStyle(inner, 'width'). - replace(/px/g, '').replace(/pt/g, '')); - assertEquals(String(img.height), goog.style.getStyle(inner, 'height'). - replace(/px/g, '').replace(/pt/g,'')); - assertEquals('0 0', goog.style.getStyle(inner, - 'background-position').replace(/px/g, ''). - replace(/pt/g, '')); - } else { - var cssClass = spriteInfo.getCssClass(); - if (cssClass) { - assertTrue('Sprite should have its CSS class set', - goog.dom.classes.has(inner, cssClass)); - } else { - checkPathsEndWithSameFile( - goog.style.getStyle(inner, 'background-image'), - spriteInfo.getUrl()); - assertEquals(spriteInfo.getWidthCssValue(), - goog.style.getStyle(inner, 'width')); - assertEquals(spriteInfo.getHeightCssValue(), - goog.style.getStyle(inner, 'height')); - assertEquals((spriteInfo.getXOffsetCssValue() + ' ' + - spriteInfo.getYOffsetCssValue()).replace(/px/g, ''). - replace(/pt/g, ''), - goog.style.getStyle(inner, - 'background-position').replace(/px/g, ''). - replace(/pt/g, '')); - } - } - } else { - // A non-sprited emoji is just an img - assertEquals(inner.tagName, "IMG"); - checkPathsEndWithSameFile(inner.src, emojiInfo[0]); - } - } -} - - -/** - * Checks and verifies the structure of a progressive fast-loading picker - * after the animated emoji have loaded. - * - * @param {goog.ui.emoji.EmojiPalette} palette Emoji palette to check. - * @param {Array.<Array.<string>>} emoji Emoji that should be in the palette. - */ -function checkPostLoadStructureForFastLoadProgressivePicker(palette, emoji) { - for (var i = 0; i < emoji[1].length; i++) { - palette.setSelectedIndex(i); - var emojiInfo = emoji[1][i]; - var cell = palette.getSelectedItem(); - var inner = cell.firstChild; - - // Check that the cell is a div wrapped around something else, and that the - // outer div contains the goomoji attribute - assertEquals('The palette item should be a div wrapped around something', - cell.tagName, "DIV"); - assertNotNull('The outer div is not wrapped around another element', inner); - assertEquals('The palette item should have the goomoji attribute', - cell.getAttribute(goog.ui.emoji.Emoji.ATTRIBUTE), emojiInfo[1]); - - // Now check the contents of the cells - var url = emojiInfo[0]; // url of the animated emoji - var spriteInfo = emojiInfo[2]; - if (spriteInfo) { - if (spriteInfo.isAnimated()) { - var testImg = new Image(); - testImg.src = url; - var img = inner.firstChild; - checkPathsEndWithSameFile(img.src, url); - assertEquals(testImg.width, img.width); - assertEquals(testImg.height, img.height); - assertEquals('0', goog.style.getStyle(img, 'left').replace(/px/g, ''). - replace(/pt/g, '')); - assertEquals('0', goog.style.getStyle(img, 'top').replace(/px/g, ''). - replace(/pt/g, '')); - } else { - var cssClass = spriteInfo.getCssClass(); - if (cssClass) { - assertEquals("DIV", inner.tagName); - assertTrue('Sprite should have its CSS class set', - goog.dom.classes.has(inner, cssClass)); - } else { - // There's an inner div wrapping an img tag - assertEquals("DIV", inner.tagName); - var img = inner.firstChild; - assertNotNull('Div should be wrapping something', img); - assertEquals("IMG", img.tagName); - checkPathsEndWithSameFile(img.src, spriteInfo.getUrl()); - assertEquals(spriteInfo.getWidthCssValue(), - goog.style.getStyle(inner, 'width')); - assertEquals(spriteInfo.getHeightCssValue(), - goog.style.getStyle(inner, 'height')); - assertEquals(spriteInfo.getXOffsetCssValue().replace(/px/, ''). - replace(/pt/, ''), - goog.style.getStyle(img, 'left').replace(/px/, ''). - replace(/pt/, '')); - assertEquals(spriteInfo.getYOffsetCssValue().replace(/px/, ''). - replace(/pt/, ''), - goog.style.getStyle(img, 'top').replace(/px/, ''). - replace(/pt/, '')); - } - } - } else { - // A non-sprited emoji is just an img - assertEquals(inner.tagName, "IMG"); - checkPathsEndWithSameFile(inner.src, emojiInfo[0]); - } - } -} - - -function testPreLoadCellConstructionForFastLoadingNonProgressive() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - picker.setManualLoadOfAnimatedEmoji(true); - picker.setProgressiveRender(false); - picker.addEmojiGroup(spritedEmoji2[0], spritedEmoji2[1]); - picker.render(); - - var palette = picker.getPage(0); - - checkStructureForNonProgressivePicker(palette, spritedEmoji2); - - picker.dispose(); -} - - -function testPreLoadCellConstructionForFastLoadingProgressive() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - picker.setManualLoadOfAnimatedEmoji(true); - picker.setProgressiveRender(true); - picker.addEmojiGroup(spritedEmoji2[0], spritedEmoji2[1]); - picker.render(); - - var palette = picker.getPage(0); - - checkStructureForProgressivePicker(palette, spritedEmoji2); - - picker.dispose(); -} - - -function testCellConstructionForNonProgressiveRenderingSpriting() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - picker.addEmojiGroup(spritedEmoji1[0], spritedEmoji1[1]); - picker.render(); - - var palette = picker.getPage(0); - - checkStructureForNonProgressivePicker(palette, spritedEmoji1); - picker.dispose(); -} - - -function testCellConstructionForProgressiveRenderingSpriting() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(false); - picker.setProgressiveRender(true); - picker.addEmojiGroup(spritedEmoji1[0], spritedEmoji1[1]); - picker.render(); - - var palette = picker.getPage(0); - - checkStructureForProgressivePicker(palette, spritedEmoji1); - - picker.dispose(); -} - - -function testDelayedLoadPaletteCreationForMultiPagePicker() { - var defaultImg = '../../demos/emoji/none.gif'; - var picker = new goog.ui.emoji.EmojiPicker(defaultImg); - picker.setDelayedLoad(true); - - for (var i = 0; i < emojiGroups.length; i++) { - picker.addEmojiGroup(emojiGroups[i][0], emojiGroups[i][1]); - } - - picker.render(); - - // At this point the picker should have pages filled with the default img - for (var i = 0; i < emojiGroups.length; i++) { - checkContentIsDefaultImg(picker.getPage(i), defaultImg); - } - - // Now load the images - picker.loadImages(); - - // The first page should be loaded - var page = picker.getPage(0); - assertTrue('Page ' + i + ' should be in the document but is not', - page.isInDocument()); - checkContentIsEmojiImages(page, emojiGroups[0][1], defaultImg); - - // The other pages should all be filled with the default img since they are - // lazily loaded - for (var i = 1; i < 3; i++) { - checkContentIsDefaultImg(picker.getPage(i), defaultImg); - } - - // Activate the other two pages so that their images get loaded, and check - // that they're now loaded correctly - var tabPane = picker.getTabPane(); - - for (var i = 1; i < 3; i++) { - tabPane.setSelectedIndex(i); - page = picker.getPage(i); - assertTrue(page.isInDocument()); - checkContentIsEmojiImages(page, emojiGroups[i][1], defaultImg); - } - - picker.dispose(); -} - - -</script> -</body> -</html> |