├── .circleci └── config.yml ├── .editorconfig ├── .eslintignore ├── .eslintrc ├── .gitattributes ├── .github ├── ISSUE_TEMPLATE.md └── PULL_REQUEST_TEMPLATE.md ├── .gitignore ├── LICENSE ├── README.md ├── data └── movies.csv ├── docker-compose.yml ├── package-lock.json ├── package.json ├── renovate.json ├── src ├── hello-data │ ├── hello-data-halyard.js │ └── hello-data.js ├── hello-engine │ └── hello-engine.js └── hello-visualization │ ├── app.css │ ├── app.html │ ├── app.js │ ├── index.html │ ├── linechart.js │ ├── resources │ ├── LUI-icons.woff │ ├── Quicksand-Light.otf │ ├── Quicksand-Regular.otf │ ├── Quicksand.LICENSE │ ├── github-social-logo.svg │ └── hello-viz.png │ ├── scatterplot.js │ └── webpack.config.js └── test ├── aw.config.js ├── hello-visualization.spec.js ├── test-hello-data-halyard.sh ├── test-hello-data.sh ├── test-hello-engine.sh └── test-hello-visualization.sh /.circleci/config.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | jobs: 3 | build: 4 | machine: true 5 | working_directory: ~/app 6 | steps: 7 | - checkout 8 | - run: 9 | name: Install node 10 | command: | 11 | set +e 12 | curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.5/install.sh | bash 13 | export NVM_DIR="/opt/circleci/.nvm" 14 | [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" 15 | nvm install v12 16 | nvm alias default v12 17 | # Each step uses the same `$BASH_ENV`, so need to modify it 18 | echo 'export NVM_DIR="/opt/circleci/.nvm"' >> $BASH_ENV 19 | echo "[ -s \"$NVM_DIR/nvm.sh\" ] && . \"$NVM_DIR/nvm.sh\"" >> $BASH_ENV 20 | - run: 21 | name: Install Chrome 22 | command: | 23 | sudo apt-get clean 24 | sudo apt-get update 25 | sudo apt-get install libgbm1 dpkg 26 | wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb 27 | sudo dpkg -i google-chrome-stable_current_amd64.deb 28 | sudo apt-get -fy install 29 | - run: 30 | name: Install dependencies 31 | command: npm install --quiet 32 | - run: 33 | name: Lint 34 | command: npm run lint 35 | - run: 36 | name: Start QIX Engine 37 | command: ACCEPT_EULA=yes docker-compose up -d 38 | - run: 39 | name: Check that QIX Engine is up and running 40 | command: | 41 | set +e 42 | 43 | # Check that Engine is running 44 | ENGINE_ID=$(docker ps -aqf "name=engine") 45 | echo "Engine container id is $ENGINE_ID" 46 | 47 | RETRIES=0 48 | 49 | while [[ "$ENGINE_STATUS" != "running" && $RETRIES -le 30 ]]; do 50 | ENGINE_STATUS=$(docker inspect -f '{{.State.Status}}' "$ENGINE_ID") 51 | echo "Engine status is $ENGINE_STATUS" 52 | sleep 2 53 | RETRIES=$[$RETRIES+1] 54 | done 55 | 56 | if [[ "$ENGINE_STATUS" != "running" ]]; then 57 | echo "QIX Engine did not start up properly" 58 | exit 1 59 | fi 60 | - run: 61 | name: Test of hello-engine 62 | command: ./test/test-hello-engine.sh 63 | - run: 64 | name: Test of hello-data and hello-data-halyard 65 | command: | 66 | ./test/test-hello-data.sh 67 | ./test/test-hello-data-halyard.sh 68 | - run: 69 | name: Start hello-visualization web server 70 | background: true 71 | command: npm run hello-visualization 72 | - run: 73 | name: Test of hello-visualization 74 | command: | 75 | set +e 76 | RETRIES=0 77 | while [[ $RETRIES -lt 30 ]]; do 78 | curl --output /dev/null --silent --head --fail http://localhost:8080 79 | if [[ $? -eq 0 ]]; then 80 | echo "Web server is up" 81 | break 82 | fi 83 | sleep 2 84 | RETRIES=$[$RETRIES+1] 85 | done 86 | ./test/test-hello-visualization.sh 87 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig is awesome: http://EditorConfig.org 2 | 3 | # top-most EditorConfig file 4 | root = true 5 | 6 | # Source files 7 | [*] 8 | charset = utf-8 9 | indent_style = space 10 | indent_size = 2 11 | end_of_line = lf 12 | insert_final_newline = true 13 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | **/node_modules/ 2 | **/dist/ 3 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "node": true, 4 | "mocha": true, 5 | "protractor": true 6 | }, 7 | "globals": { 8 | "EC": true, 9 | "expect": true 10 | }, 11 | "parserOptions": { 12 | "sourceType": "module" 13 | }, 14 | "extends": "airbnb-base", 15 | "root": true 16 | } 17 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Set the default behavior, in case people don't have core.autocrlf set. 2 | * text=auto 3 | 4 | # Unix line endings in all text files. 5 | * text eol=lf 6 | 7 | # Binary files 8 | *.tgz binary 9 | *.woff binary 10 | *.otf binary 11 | *.png binary 12 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ### Description 2 | 3 | [Description of the issue] 4 | 5 | ### Steps to Reproduce 6 | 7 | 1. [Step one] 8 | 2. [Step two] 9 | 3. ... 10 | 11 | ##### Expected behavior 12 | 13 | [What you expected to happen] 14 | 15 | ##### Actual behavior 16 | 17 | [What actually happened] 18 | 19 | ### Environment 20 | 21 | ##### Library 22 | ``` 23 | [ ] Node.js 24 | [ ] Browser 25 | ``` 26 | ##### Operating system 27 | ``` 28 | [ ] Windows 29 | [ ] OSX 30 | [ ] Linux 31 | ``` 32 | ### Versions 33 | 34 | * Node.js: 35 | * Browser: 36 | * Operating system: 37 | * [Other relevant versions] -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | Fixes #[issue number]. 2 | 3 | ### Status 4 | ``` 5 | [ ] Under development 6 | [ ] Waiting for code review 7 | [ ] Waiting for merge 8 | ``` 9 | ### Information 10 | ``` 11 | [ ] Contains breaking changes 12 | [ ] Contains documentation 13 | [ ] Contains test 14 | ``` 15 | ### To-do list 16 | ``` 17 | [ ] [Fix this thing] 18 | [ ] [Fix another thing] 19 | [ ] ... 20 | ``` -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .idea 3 | .vscode/ 4 | *.log 5 | *.orig 6 | test/__artifacts__/ 7 | .DS_Store 8 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License 2 | 3 | Copyright (c) 2017-present QlikTech International AB 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Get started with Qlik Core 2 | 3 | *As of 1 July 2020, Qlik Core is no longer available to new customers. No further maintenance will be done in this repository.* 4 | 5 | This repository contains the source code and assets for the Hello Engine, Hello Data, and Hello Visualization examples found [here](https://core.qlik.com/get-started/) under tutorials. 6 | 7 | Note that before you deploy, you must accept the [Qlik Core EULA](https://core.qlik.com/eula/) by setting the `ACCEPT_EULA` environment variable. 8 | 9 | ```sh 10 | ACCEPT_EULA=yes docker-compose up -d 11 | ``` 12 | 13 | ## Contents 14 | 15 | - [hello-engine](./src/hello-engine/) - Hello Engine example source code 16 | - [hello-data](./src/hello-data/) - Hello Data example source code 17 | - [hello-visualization](./src/hello-visualization/) - Example source code for a line chart and a scatter plot visualization 18 | - [test](./test) - Function tests for the examples (bash scripts) 19 | - [data](./data) - The Movies data, used as user data in the examples 20 | 21 | ## Screenshot 22 | 23 | ![screenshot](./src/hello-visualization/resources/hello-viz.png) 24 | 25 | ## Contributing 26 | 27 | We welcome and encourage contributions! Please read [Open Source at Qlik R&D](https://github.com/qlik-oss/open-source) 28 | for more info on how to get involved. 29 | 30 | ## Found a bug? 31 | 32 | Found a problem with the examples? Don't hesitate to submit an issue. 33 | -------------------------------------------------------------------------------- /data/movies.csv: -------------------------------------------------------------------------------- 1 | Movie,Year,Adjusted Costs,Nominal Costs,Image,Movie Wikipedia Profile,Description 2 | 2012,2009,$220000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/d/dd/2012_Poster.jpg,http://en.wikipedia.org/wiki/2012_(film),"2012 is a 2009 American epicscience fictiondisaster film directed and co-written by Roland Emmerich. It stars John Cusack, Chiwetel Ejiofor, Amanda Peet, Oliver Platt, Thandie Newton, Danny Glover, and Woody Harrelson. It was produced by Columbia Pictures and distributed by Sony Pictures Releasing. Filming began in August 2008 in Vancouver, although it was originally planned to be filmed in Los Angeles." 3 | Armageddon,1998,$203000000,"$140,000,000.00",http://upload.wikimedia.org/wikipedia/en/f/fc/Armageddon-poster06.jpg,http://en.wikipedia.org/wiki/Armageddon_(film),"Armageddon is a 1998 American science fictiondisasterthriller film, directed by Michael Bay, produced by Jerry Bruckheimer, and released by Touchstone Pictures. The film follows a group of blue-collardeep-core drillers sent by NASA to stop a gigantic asteroid on a collision course with Earth. It features an ensemble cast including Bruce Willis, Ben Affleck, Billy Bob Thornton, Liv Tyler, Owen Wilson, Will Patton, Peter Stormare, William Fichtner, Michael Clarke Duncan, Keith David and Steve Buscemi." 4 | Avatar,2009,$261000000,"$237,000,000.00",http://upload.wikimedia.org/wikipedia/en/b/b0/Avatar-Teaser-Poster.jpg,http://en.wikipedia.org/wiki/Avatar_(2009_film),"Avatar (marketed as James Cameron's Avatar) is a 2009 Americanepicscience fiction film directed, written, co-produced, and co-edited by James Cameron, and starring Sam Worthington, Zoe Saldana, Stephen Lang, Michelle Rodriguez, Joel David Moore, Giovanni Ribisi, and Sigourney Weaver. The film is set in the mid-22nd century, when humans are mining a precious mineral called unobtanium on Pandora, a lush habitable moon of a gas giant in the Alpha Centauri star system. The expansion of the mining colony threatens the continued existence of a local tribe of Na'vi – a humanoid species indigenous to Pandora. The film's title refers to a genetically engineered Na'vi body with the mind of a remotely located human, and is used to interact with the natives of Pandora." 5 | Battleship,2012,$215000000,"$209,000,000.00",http://upload.wikimedia.org/wikipedia/en/6/6e/Battleship_Poster.jpg,http://en.wikipedia.org/wiki/Battleship_(film),"Battleship is a 2012 American military science fictionwar film loosely inspired by the classic board game. The film was directed by Peter Berg and released by Universal Pictures (a wholly owned subsidiary of NBCUniversal Entertainment Japan). It was also the only Hasbro property to be produced in association with Dentsu Inc., which left NBCUniversal Entertainment Japan before being spun off as a separate company in February 17, 2014. The film stars Taylor Kitsch, Liam Neeson, Alexander Skarsgård, Rihanna, John Tui, Brooklyn Decker and Tadanobu Asano." 6 | Cars 2,2011,$210000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/7/7f/Cars_2_Poster.jpg,http://en.wikipedia.org/wiki/Cars_2,"Cars 2 is a 2011 American computer-animatedaction comedyspy film produced by Pixar Animation Studios and released by Walt Disney Pictures. The film is the sequel to the 2006 film Cars and features the voices of Owen Wilson, Larry the Cable Guy, Michael Caine, Emily Mortimer, John Turturro, and Eddie Izzard. In the film, race car Lightning McQueen and tow truck Mater head to Japan and Europe to compete in the World Grand Prix, but Mater becomes sidetracked with international espionage. The film is directed by John Lasseter, co-directed by Brad Lewis, written by Ben Queen, and produced by Denise Ream." 7 | Cleopatra,1963,$240000000,"$31,120,000.00",http://upload.wikimedia.org/wikipedia/commons/b/b1/Cleopatra_poster.jpg,http://en.wikipedia.org/wiki/Cleopatra_(1963_film),"Cleopatra is a 1963 epicdrama film directed by Joseph L. Mankiewicz. The screenplay was adapted by Mankiewicz, Ranald MacDougall and Sidney Buchman from a book by Carlo Maria Franzero. The film starred Elizabeth Taylor, Richard Burton, Rex Harrison, Roddy McDowall, and Martin Landau. The music score was by Alex North. It was photographed in 70 mm Todd-AO and DeLuxe Color by Leon Shamroy." 8 | Evan Almighty,2007,$199000000,"$175,000,000.00",http://upload.wikimedia.org/wikipedia/en/1/14/Evan_almightymp1.jpg,http://en.wikipedia.org/wiki/Evan_Almighty,"Evan Almighty is a 2007 American comedy film and the stand-alone sequel to Bruce Almighty (2003). The film was directed by Tom Shadyac, based on the characters created by Steve Koren and Mark O'Keefe from the original film, and starring Steve Carell as the title character. Morgan Freeman reprised his role as God from the original film. Production of the film began in January 2006. Several visual effect companies were used to provide CGI for the numerous animals and the climactic flood scene. The main plot is a modern day retelling of Noah's Ark." 9 | Green Lantern,2011,$210000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/6/6b/Green_Lantern_poster.jpg,http://en.wikipedia.org/wiki/Green_Lantern_(film),"Green Lantern is a 2011 American superhero film based on the DC Comicscharacter of the same name. The film stars Ryan Reynolds, Blake Lively, Peter Sarsgaard, Mark Strong, Angela Bassett and Tim Robbins, with Martin Campbell directing a script by Greg Berlanti and comic book writers Michael Green and Marc Guggenheim, which was subsequently rewritten by Michael Goldenberg.Green Lantern tells the story of Hal Jordan, a test pilot who is selected to become the first human member of the Green Lantern Corps. Hal is given a ring that grants him superpowers and must confront the evil Parallax, who threatens to upset the balance of power in the universe." 10 | Harry Potter and the Half-Blood Prince,2009,$275000000,"$250,000,000.00",http://upload.wikimedia.org/wikipedia/en/3/3f/Harry_Potter_and_the_Half-Blood_Prince_poster.jpg,http://en.wikipedia.org/wiki/Harry_Potter_and_the_Half-Blood_Prince_(film),"Harry Potter and the Half-Blood Prince is a 2009 fantasy film directed by David Yates and distributed by Warner Bros. Pictures. It is based on the novel of the same name by J. K. Rowling. The film, which is the sixth instalment in the Harry Potter film series, was written by Steve Kloves and produced by David Heyman and David Barron. The story follows Harry Potters sixth year at Hogwarts as he becomes obsessed with a mysterious textbook, falls in love, and attempts to retrieve a memory that holds the key to Lord Voldemorts downfall. The film stars Daniel Radcliffe as Harry Potter, alongside Rupert Grint and Emma Watson as Harry's best friends Ron Weasley and Hermione Granger. It is the sequel to Harry Potter and the Order of the Phoenix and is followed by Harry Potter and the Deathly Hallows – Part 1." 11 | Indiana Jones and the Kingdom of the Crystal Skull,2008,$203000000,"$185,000,000.00",http://upload.wikimedia.org/wikipedia/en/d/d5/Kingdomofthecrystalskull.jpg,http://en.wikipedia.org/wiki/Indiana_Jones_and_the_Kingdom_of_the_Crystal_Skull,"Indiana Jones and the Kingdom of the Crystal Skull is a 2008 American science fiction adventure film. It is the fourth film in the Indiana Jones series, created by George Lucas and directed by Steven Spielberg. Released nineteen years after the previous film, the film acknowledges the age of its star Harrison Ford by being set in 1957. It pays tribute to the science fiction B-movies of the era, pitting Indiana Jones against Soviet agents—led by Irina Spalko (Cate Blanchett)— searching for a telepathic crystal skull. Indiana is aided by his former lover Marion Ravenwood (Karen Allen) and son Mutt Williams (Shia LaBeouf). Ray Winstone, John Hurt and Jim Broadbent are also part of the supporting cast." 12 | Iron Man 3,2013,$202000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/d/d5/Iron_Man_3_theatrical_poster.jpg,http://en.wikipedia.org/wiki/Iron_Man_3,"Iron Man 3 (stylized onscreen as Iron Man Three) is a 2013 superhero film featuring the Marvel Comics character Iron Man, produced by Marvel Studios and distributed by Walt Disney Studios Motion Pictures.1 It is the sequel to 2008's Iron Man and 2010's Iron Man 2, and the seventh installment in the Marvel Cinematic Universe. Shane Black directed a screenplay he co-wrote with Drew Pearce, which uses concepts from the ""Extremis"" story arc by Warren Ellis. The film stars Robert Downey, Jr., Gwyneth Paltrow, Don Cheadle, Guy Pearce, Rebecca Hall, Stephanie Szostak, James Badge Dale, Jon Favreau, and Ben Kingsley. In Iron Man 3, Tony Stark tries to recover from posttraumatic stress disorder caused by the events of The Avengers, while investigating a terrorist organization led by the mysterious Mandarin." 13 | John Carter,2012,$257000000,"$250,000,000.00",http://upload.wikimedia.org/wikipedia/en/a/aa/John_carter_poster.jpg,http://en.wikipedia.org/wiki/John_Carter_(film),"John Carter is a 2012 American science fictionadventure film directed by Andrew Stanton and produced by Walt Disney Pictures. It is based on A Princess of Mars, the first book in the Barsoom series of novels by Edgar Rice Burroughs. The film chronicles the first interplanetary adventure of John Carter, portrayed by actor Taylor Kitsch. The film marks the centennial of the character's first appearance. The film is the live-action debut for writer and director Stanton; his previous directorial work includes the Pixar animated films Finding Nemo (2003) and WALL-E (2008). Co-written by Stanton, Mark Andrews and Michael Chabon, it was produced by Jim Morris, Colin Wilson, and Lindsey Collins. The score was composed by Michael Giacchino and released by Walt Disney Records on March 6, 2012. The ensemble cast also features Lynn Collins, Samantha Morton, Mark Strong, Ciarán Hinds, Thomas Haden Church, Dominic West, James Purefoy, and Willem Dafoe." 14 | King Kong,2005,$250000000,"$207,000,000.00",http://upload.wikimedia.org/wikipedia/en/6/6a/Kingkong_bigfinal1.jpg,http://en.wikipedia.org/wiki/King_Kong_(2005_film),"King Kong is a 2005 epicadventure film and remake of the 1933 film of the same name. Directed, co-written and produced by Peter Jackson, it stars Naomi Watts as Ann Darrow, Jack Black as Carl Denham, Adrien Brody as Jack Driscoll and, through motion capture, Andy Serkis as the title character. Set in 1932–33, King Kong tells the story of an overly ambitious filmmaker who coerces his cast and hired ship crew to travel to mysterious Skull Island. There they encounter Kong, a legendary giant gorilla, who they capture and display in New York City, with tragic results." 15 | Man of Steel,2013,$228000000,"$225,000,000.00",http://upload.wikimedia.org/wikipedia/en/8/85/ManofSteelFinalPoster.jpg,http://en.wikipedia.org/wiki/Man_of_Steel_(film),"Man of Steel is a 2013 superhero film based on the DC Comics character Superman, co-produced by Legendary Pictures and Syncopy Films, distributed by Warner Bros. It is the first installment in the DC Cinematic Universe. Directed by Zack Snyder and written by David S. Goyer, the film stars Henry Cavill, Amy Adams, Michael Shannon, Kevin Costner, Diane Lane, Laurence Fishburne, and Russell Crowe. Man of Steel is a reboot of the Superman film series that portrays the character's origin story." 16 | Men in Black 3,2012,$221000000,"$215,000,000.00",http://upload.wikimedia.org/wikipedia/en/8/8a/Men_In_Black_3.jpg,http://en.wikipedia.org/wiki/Men_in_Black_3,"Men in Black 3 (stylized as MIB³ and alternatively spelled Men in Black III) is a 2012 American 3Dscience fictionaction comedy film directed by Barry Sonnenfeld and starring Will Smith, Tommy Lee Jones, and Josh Brolin. It is the third installment in the Men in Black film series based on Lowell Cunninghams The Men in Black comic book series Published by Marvel and Malibu Comics. It was released fifteen years after the original Men in Black (1997) and ten years after the first sequel Men in Black II (2002). Sonnenfeld and Steven Spielberg returned as director and executive producer, respectively. At 106 minutes, it is the longest of the franchise." 17 | Monsters University,2013,$202000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/2/2a/Monsters_University_poster_3.jpg,http://en.wikipedia.org/wiki/Monsters_University,"Monsters University is a 2013 American 3Dcomputer-animatedcomedy film produced by Pixar Animation Studios and released by Walt Disney Pictures. It was directed by Dan Scanlon and produced by Kori Rae, with John Lasseter, Pete Docter, Andrew Stanton and Lee Unkrich as executive producers. It is the fourteenth feature film produced by Pixar and is a prequel to 2001's Monsters, Inc., marking the first time Pixar has made a prequel film." 18 | Oz the Great and Powerful,2013,$218000000,"$215,000,000.00",http://upload.wikimedia.org/wikipedia/en/5/52/Oz_-_The_Great_and_Powerful_Poster.jpg,http://en.wikipedia.org/wiki/Oz_the_Great_and_Powerful,"Oz the Great and Powerful is a 2013 American fantasyadventure film directed by Sam Raimi, produced by Joe Roth, and written by David Lindsay-Abaire and Mitchell Kapner. The film stars James Franco as the titular character, Mila Kunis as Theodora, Rachel Weisz as Evanora, and Michelle Williams as Glinda. Zach Braff, Bill Cobbs, Joey King, and Tony Cox are featured in supporting roles." 19 | Pirates of the Caribbean: At World's End,2007,$341000000,"$300,000,000.00",https://upload.wikimedia.org/wikipedia/en/5/5a/Pirates_AWE_Poster.jpg,http://en.wikipedia.org/wiki/Pirates_of_the_Caribbean:_At_World%27s_End,"Pirates of the Caribbean: At World's End is a 2007 American fantasyswashbuckler film and the third film in the Pirates of the Caribbean film series. The plot follows Will Turner (Orlando Bloom), Elizabeth Swann (Keira Knightley), Hector Barbossa (Geoffrey Rush), and the crew of the Black Pearl rescuing Captain Jack Sparrow (Johnny Depp) from Davy Jones' Locker, and then preparing to fight the East India Trading Company, led by Cutler Beckett (Tom Hollander) and Davy Jones (Bill Nighy), who plan to extinguish piracy forever. Gore Verbinski directed the film, as he did with the previous two. It was shot in two shoots during 2005 and 2006, the former simultaneously with the preceding film, Pirates of the Caribbean: Dead Man's Chest." 20 | Pirates of the Caribbean: Dead Man's Chest,2006,$263000000,"$225,000,000.00",http://upload.wikimedia.org/wikipedia/en/2/2d/Pirates_of_the_caribbean_2_poster_b.jpg,http://en.wikipedia.org/wiki/Pirates_of_the_Caribbean:_Dead_Man%27s_Chest,"Pirates of the Caribbean: Dead Man's Chest is a 2006 American fantasyswashbuckler film and the second film of the Pirates of the Caribbean film series, following Pirates of the Caribbean: The Curse of the Black Pearl (2003). It was directed by Gore Verbinski, written by Ted Elliott and Terry Rossio, and produced by Jerry Bruckheimer. In the film, the marriage of Will Turner (Orlando Bloom) and Elizabeth Swann (Keira Knightley) is interrupted by Lord Cutler Beckett (Tom Hollander), who wants Turner to acquire the compass of Captain Jack Sparrow (Johnny Depp) in a bid to find the Dead Man's Chest. Sparrow discovers his debt to Davy Jones (Bill Nighy) is due." 21 | Quantum of Solace,2008,$219000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/2/2d/Quantum_of_Solace_-_UK_cinema_poster.jpg,http://en.wikipedia.org/wiki/Quantum_of_Solace,"Quantum of Solace (2008) is the twenty-second James Bond film produced by Eon Productions, and is the direct sequel to the 2006 film Casino Royale. Directed by Marc Forster, it features Daniel Craigs second performance as James Bond. In the film, Bond seeks revenge for the death of his lover, Vesper Lynd (Eva Green), and is assisted by Camille Montes (Olga Kurylenko), who is plotting revenge for the murder of her family. The trail eventually leads them to wealthy businessman Dominic Greene (Mathieu Amalric), a member of the Quantum organisation, who intends to stage a coup d'état in Bolivia to seize control of that country's water supply." 22 | Spider-Man 2,2004,$250000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/0/02/Spider-Man_2_Poster.jpg,http://en.wikipedia.org/wiki/Spider-Man_2,"Spider-Man 2 is a 2004 American superhero film directed by Sam Raimi and written by Alvin Sargent from a story by Alfred Gough, Miles Millar, and Michael Chabon. The sequel to the 2002 film Spider-Man, it is the second film in Raimi's Spider-Man film trilogy based on the fictional Marvel Comics character of the same name. Tobey Maguire, Kirsten Dunst, and James Franco reprise their respective roles as Peter Parker/Spider-Man, Mary Jane Watson, and Harry Osborn." 23 | Spider-Man 3,2007,$293000000,"$258,000,000.00",http://upload.wikimedia.org/wikipedia/en/7/7a/Spider-Man_3%2C_International_Poster.jpg,http://en.wikipedia.org/wiki/Spider-Man_3,"Spider-Man 3 is a 2007 American superhero film produced by Marvel Entertainment and Laura Ziskin Productions, and distributed by Columbia Pictures based on the fictionalMarvel Comics character Spider-Man. It was directed by Sam Raimi and scripted by Sam and Ivan Raimi and Alvin Sargent. It is the final film in the Sam Raimi Spider-Man trilogy. The film stars Tobey Maguire, Kirsten Dunst, James Franco, Thomas Haden Church, Topher Grace, Bryce Dallas Howard, Rosemary Harris, J. K. Simmons, James Cromwell and Cliff Robertson in his final film appearance." 24 | Superman,1978,"$199,500,000","$55,000,000.00",http://upload.wikimedia.org/wikipedia/en/6/6d/Superman_ver1.jpg,http://en.wikipedia.org/wiki/Superman_(1978_film),"Superman (also known as Superman: The Movie) is a 1978 British-American superhero film directed by Richard Donner. It is based on the DC Comics character of the same name and stars Marlon Brando, Gene Hackman, Christopher Reeve, Margot Kidder, Glenn Ford, Phyllis Thaxter, Jackie Cooper, Trevor Howard, Marc McClure, Terence Stamp, Valerie Perrine, and Ned Beatty. The film depicts Superman's origin, including his infancy as Kal-El of Krypton and his youthful years in the rural town of Smallville. Disguised as reporter Clark Kent, he adopts a mild-mannered disposition in Metropolis and develops a romance with Lois Lane, while battling the villainous Lex Luthor." 25 | Superman Returns,2006,$239000000,"$204,000,000.00",http://upload.wikimedia.org/wikipedia/en/1/10/Superman_Returns.jpg,http://en.wikipedia.org/wiki/Superman_Returns,"Superman Returns is a 2006 superhero film directed and produced by Bryan Singer. Based on the DC Comics character Superman, the film serves as a homagesequel to the motion pictures Superman (1978) and Superman II (1980), ignoring the events of Superman III (1983) and Superman IV: The Quest for Peace (1987). It stars Brandon Routh as Superman/Clark Kent, as well as Kate Bosworth, Kevin Spacey, James Marsden, Frank Langella, and Parker Posey, and tells the story of the title character returning to Earth after a five-year absence. He finds that his love interestLois Lane has moved on with her life and that his archenemy Lex Luthor is plotting a scheme that will destroy him and the world." 26 | Tangled,2010,$281000000,"$260,000,000.00",http://upload.wikimedia.org/wikipedia/en/a/a8/Tangled_poster.jpg,http://en.wikipedia.org/wiki/Tangled,"Tangled is a 2010 American computer animatedmusicalfantasy-comedy film produced by Walt Disney Animation Studios and released by Walt Disney Pictures. Loosely based on the German fairy tale ""Rapunzel"" in the collection of folk tales published by the Brothers Grimm, it is the 50th animated feature in the Walt Disney Animated Classics series. Featuring the voices of Mandy Moore, Zachary Levi, and Donna Murphy, the film tells the story of a lost princess with long magical hair who yearns to leave her secluded tower. Against her mother's wishes, she accepts the aid of a handsome intruder to take her out into the world which she has never seen." 27 | Terminator 3: Rise of the Machines,2003,$214000000,"$167,000,000.00",http://upload.wikimedia.org/wikipedia/en/3/39/Terminator_3_Rise_of_the_Machines_movie.jpg,http://en.wikipedia.org/wiki/Terminator_3:_Rise_of_the_Machines,"Terminator 3: Rise of the Machines (commonly abbreviated as T3) is a 2003 American science fictionaction film, directed by Jonathan Mostow and starring Arnold Schwarzenegger, Nick Stahl, Claire Danes and Kristanna Loken. It is the third installment of the Terminator series, following Terminator 2: Judgment Day and the first to not involve franchise creator James Cameron, who directed and wrote the two first installments. The plot follows the events of the second installment. After Skynet fails to kill Sarah Connor before her son is born and to kill John himself as a child, it sends back another Terminator, the T-X, in an attempt to wipe out as many Resistance officers as possible. This includes John's future wife, but not John himself as his whereabouts are unknown to Skynet. John's life is placed in danger when the T-X accidentally finds him. The film was moderately well received by critics and turned out to be a box office success." 28 | Terminator Salvation,2009,$220000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/9/95/Terminator-salvation-poster.jpg,http://en.wikipedia.org/wiki/Terminator_Salvation,"Terminator Salvation is a 2009 American/British science fictionaction film directed by McG and starring Christian Bale and Sam Worthington. It is the fourth installment in the original Terminator series. In a departure from the previous installments, which were set between 1984 and 2004 and used time travel as a key plot element, Salvation is set in 2018 and focuses on the war between Skynet and humanity, with the human Resistance fighting against Skynet's killing machines. Bale portrays John Connor, a Resistance fighter and the franchise's central character, while Worthington portrays cyborg Marcus Wright. Terminator Salvation also features Anton Yelchin as a young Kyle Reese, a character first introduced in The Terminator, and depicts the origin of the T-800 Model 101 Terminator." 29 | The Amazing Spider-Man,2012,$205000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/0/02/The_Amazing_Spider-Man_theatrical_poster.jpeg,http://en.wikipedia.org/wiki/The_Amazing_Spider-Man_(2012_film),"The Amazing Spider-Man is a 2012 American superhero film based on the Marvel Comics character Spider-Man and sharing the title of the character's longest-running comic book of the same name. It is the fourth theatrical Spider-Man film produced by Columbia Pictures and Marvel Entertainment, and a reboot of Sam Raimis 2002–07 trilogy preceding it. The film was directed by Marc Webb, written by James Vanderbilt, Alvin Sargent and Steve Kloves and stars Andrew Garfield as Peter Parker / Spider-Man, Emma Stone as Gwen Stacy, Rhys Ifans as Dr. Curtis Connors, Denis Leary as Captain George Stacy along with Martin Sheen and Sally Field as the uncle and aunt of Peter Parker, Ben Parker and May Parker. The film tells the story of Peter Parker, a teenager from New York City who becomes Spider-Man after being bitten by a genetically altered spider. Parker must stop Dr. Curt Connors as a mutated Lizard from spreading a mutation serum to the city's human population." 30 | The Amazing Spider-Man 2,2014,$200000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/0/02/The_Amazing_Spiderman_2_poster.jpg,http://en.wikipedia.org/wiki/The_Amazing_Spider-Man_2,"The Amazing Spider-Man 2 (released with the subtitle Rise of Electro in some markets) is a 2014 American superhero film featuring the Marvel Comics character Spider-Man, directed by Marc Webb and released by Columbia Pictures. It serves as a sequel to the 2012 film The Amazing Spider-Man and was announced in 2011. The studio hired James Vanderbilt to write the screenplay and Alex Kurtzman and Roberto Orci to rewrite it.Andrew Garfield, Emma Stone, Jamie Foxx, Dane DeHaan, Campbell Scott, Embeth Davidtz, Colm Feore, Paul Giamatti, and Sally Field star." 31 | The Avengers,2012,$226000000,"$220,000,000.00",http://upload.wikimedia.org/wikipedia/en/f/f9/TheAvengers2012Poster.jpg,http://en.wikipedia.org/wiki/The_Avengers_(2012_film),"Marvel's The Avengers (classified under the name Marvel Avengers Assemble in the United Kingdom and Ireland), or simply The Avengers, is a 2012 American superhero film based on the Marvel Comics superhero team of the same name, produced by Marvel Studios and distributed by Walt Disney Studios Motion Pictures.1 It is the sixth installment in the Marvel Cinematic Universe. The film was written and directed by Joss Whedon and features an ensemble cast including Robert Downey, Jr., Chris Evans, Mark Ruffalo, Chris Hemsworth, Scarlett Johansson, Jeremy Renner, Tom Hiddleston, Clark Gregg, Cobie Smulders, Stellan Skarsgård, and Samuel L. Jackson. In the film, Nick Fury, director of the peacekeeping organization S.H.I.E.L.D., recruits Iron Man, Captain America, the Hulk, and Thor to form a team that must stop Thor's brother Loki from subjugating Earth." 32 | The Chronicles of Narnia: Prince Caspian,2008,$246000000,"$225,000,000.00",http://upload.wikimedia.org/wikipedia/en/5/59/PrinceCaspianposter.jpg,http://en.wikipedia.org/wiki/The_Chronicles_of_Narnia:_Prince_Caspian,"The Chronicles of Narnia: Prince Caspian is a 2008 epic fantasy film based on Prince Caspian, the second published, fourth chronological novel in C. S. Lewiss epicfantasy series, The Chronicles of Narnia. It is the second in The Chronicles of Narnia film series from Walden Media, following The Chronicles of Narnia: The Lion, the Witch and the Wardrobe (2005). The four Pevensie children (William Moseley, Anna Popplewell, Skandar Keynes, and Georgie Henley) return to Narnia to aid Prince Caspian (Ben Barnes) in his struggle for the throne against his corrupt uncle, King Miraz (Sergio Castellitto). The film was released on May 16, 2008 in the United States and on June 26, 2008 in the United Kingdom. The screenplay based on the novel by C. S. Lewis was written by Stephen McFeely and Christopher Markus." 33 | "The Chronicles of Narnia: The Lion, the Witch and the Wardrobe",2005,$217000000,"$180,000,000.00",http://upload.wikimedia.org/wikipedia/en/1/10/The_Chronicles_of_Narnia_-_The_Lion%2C_the_Witch_and_the_Wardrobe.jpg,"http://en.wikipedia.org/wiki/The_Chronicles_of_Narnia:_The_Lion,_the_Witch_and_the_Wardrobe","The Chronicles of Narnia: The Lion, the Witch and the Wardrobe is a 2005 fantasy adventure film directed by Andrew Adamson and based on The Lion, the Witch and the Wardrobe, the first published and second chronological novel in C. S. Lewiss children's epic fantasy series, The Chronicles of Narnia. It was co-produced by Walden Media and Walt Disney Pictures and distributed by Buena Vista Pictures. William Moseley, Anna Popplewell, Georgie Henley and Skandar Keynes play Peter, Susan, Lucy and Edmund, four British children evacuated during the Blitz to the countryside, who find a wardrobe that leads to the fantasy world of Narnia. There they ally with the Lion Aslan (voiced by Liam Neeson) against the forces of Jadis, the White Witch (Tilda Swinton). The screenplay based on the novel by C. S. Lewis was written by Stephen McFeely and Christopher Markus." 34 | The Dark Knight,2008,$203000000,"$185,000,000.00",http://upload.wikimedia.org/wikipedia/en/8/8a/Dark_Knight.jpg,http://en.wikipedia.org/wiki/The_Dark_Knight_(film),"The Dark Knight is a 2008 superhero film directed, produced, and co-written by Christopher Nolan. Based on the DC Comics character Batman, the film is the second part of Nolan's Batman film series and a sequel to 2005's Batman Begins. Christian Bale reprises the lead role of Bruce Wayne/Batman, with a returning cast of Michael Caine as Alfred Pennyworth, Gary Oldman as James Gordon and Morgan Freeman as Lucius Fox. The film introduces the character of Harvey Dent (Aaron Eckhart), Gotham's newly elected District Attorney and the consort of Bruce Wayne's childhood friend Rachel Dawes (Maggie Gyllenhaal replacing Katie Holmes from the first film), who joins Batman and the police in combating the new rising threat of a criminal mastermind calling himself ""The Joker"" (Heath Ledger)." 35 | The Dark Knight Rises,2012,$236000000,"$230,000,000.00",http://upload.wikimedia.org/wikipedia/en/8/83/Dark_knight_rises_poster.jpg,http://en.wikipedia.org/wiki/The_Dark_Knight_Rises,"The Dark Knight Rises is a 2012 superhero film directed by Christopher Nolan, who co-wrote the screenplay with his brother Jonathan Nolan, and the story, with David S. Goyer. Featuring the DC Comics character Batman, the film is the final installment in Nolan's Batman film trilogy, and the sequel to Batman Begins (2005) and The Dark Knight (2008). Christian Bale reprises the lead role of Bruce Wayne/Batman, with a returning cast of allies: Michael Caine as Alfred Pennyworth, Gary Oldman as James Gordon, and Morgan Freeman as Lucius Fox. The film introduces Selina Kyle (Anne Hathaway), a sly, morally ambiguous cat burglar, and Bane (Tom Hardy), a mercenary bent on destroying Gotham City who forces an older Bruce Wayne to come out of retirement and become Batman again." 36 | The Golden Compass,2007,$205000000,"$180,000,000.00",http://upload.wikimedia.org/wikipedia/en/b/b6/The_Golden_Compass.jpg,http://en.wikipedia.org/wiki/The_Golden_Compass_(film),"The Golden Compass is a 2007 fantasy-adventure film based on Northern Lights, the first novel in Philip Pullman's trilogy His Dark Materials. Directed by Chris Weitz, it stars Dakota Blue Richards, Daniel Craig, Eva Green, Tom Courtenay, Christopher Lee, Nicole Kidman and Sam Elliot. The project was announced in February 2002, following the success of recent adaptations of other fantasy epics, but troubles over the script and the selection of a director caused significant delays. At US$180 million, it was one of New Line Cinemas most expensive projects ever, and its middling success in the US contributed to New Line's February 2008 restructuring." 37 | The Hobbit: An Unexpected Journey,2012,$205000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/b/b3/The_Hobbit-_An_Unexpected_Journey.jpeg,http://en.wikipedia.org/wiki/The_Hobbit:_An_Unexpected_Journey,"The Hobbit: An Unexpected Journey is a 2012 epic fantasyadventure film directed by Peter Jackson. It is the first installment in a three-part film adaptation based on the 1937 novel The Hobbit by J. R. R. Tolkien. It is followed by The Desolation of Smaug (2013) and The Battle of the Five Armies (2014), and together they will act as a prequel to Jackson's The Lord of the Rings film trilogy. The film's screenplay was written by Peter Jackson, his longtime collaborators Fran Walsh and Philippa Boyens, and Guillermo del Toro, who was originally chosen to direct the film before leaving the project in 2010." 38 | The Hobbit: The Desolation of Smaug,2013,$228000000,"$225,000,000.00",http://upload.wikimedia.org/wikipedia/en/4/4f/The_Hobbit_-_The_Desolation_of_Smaug_theatrical_poster.jpg,http://en.wikipedia.org/wiki/The_Hobbit:_The_Desolation_of_Smaug,The Hobbit: The Desolation of Smaug is a 2013 epic fantasyadventure film directed by Peter Jackson. It was produced by WingNut Films in collaboration with New Line Cinema and Metro-Goldwyn-Mayer. It was distributed by Warner Bros. Entertainment Inc. and is the second installment in the three-part film series based on the novel The Hobbit by J. R. R. Tolkien. The film was preceded by An Unexpected Journey (2012) and will be followed by The Battle of the Five Armies (2014). 39 | The Lone Ranger,2013,$228000000,"$225,000,000.00",http://upload.wikimedia.org/wikipedia/en/0/0d/TheLoneRanger2013Poster.jpg,http://en.wikipedia.org/wiki/The_Lone_Ranger_(2013_film),"The Lone Ranger is a 2013 American action western film produced by Walt Disney Pictures and Jerry Bruckheimer Films and directed by Gore Verbinski. Based on the radio series of the same name, the film stars Johnny Depp as Tonto, the narrator of the events, and Armie Hammer as John Reid (The Lone Ranger). It relates Tonto's memories of the duo's earliest efforts to subdue the immoral actions of the corrupt and bring justice in the American Old West. William Fichtner, Barry Pepper, Ruth Wilson, James Badge Dale, Tom Wilkinson and Helena Bonham Carter also are featured in supporting roles. It is the first theatrical film featuring the Lone Ranger and Tonto characters in more than 32 years." 40 | Titanic,1997,$294000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/2/22/Titanic_poster.jpg,http://en.wikipedia.org/wiki/Titanic_(1997_film),"Titanic is a 1997 American epicromanticdisaster film directed, written, co-produced, co-edited and partly financed by James Cameron. A fictionalized account of the sinking of the RMS Titanic, it stars Leonardo DiCaprio and Kate Winslet as members of different social classes who fall in love aboard the ship during its ill-fated maiden voyage." 41 | Toy Story 3,2010,$216000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/6/69/Toy_Story_3_poster.jpg,http://en.wikipedia.org/wiki/Toy_Story_3,"Toy Story 3 is a 2010 American 3Dcomputer-animatedcomedy film, and the third film in the Toy Story series. It was produced by Pixar Animation Studios and released by Walt Disney Pictures. Directed by Lee Unkrich, the screenplay was written by Michael Arndt, while Unkrich wrote the story along with John Lasseter and Andrew Stanton, respectively director and co-writer of the first two films. The film was released worldwide from June through October in the Disney Digital 3-D, RealD, and IMAX 3D formats. Toy Story 3 was the first film to be released theatrically with Dolby Surround 7.1 sound." 42 | Transformers: Age of Extinction,2014,$210000000,"$210,000,000.00",http://upload.wikimedia.org/wikipedia/en/9/94/Transformers_Age_of_Extinction_Poster.jpeg,http://en.wikipedia.org/wiki/Transformers:_Age_of_Extinction,"Transformers: Age of Extinction is a 2014 science fictionaction film based on the Transformers franchise. It is the fourth installment of the live-actionTransformers film series and stars Mark Wahlberg in the lead role. A sequel to Transformers: Dark of the Moon, the film takes place five years later, after the Decepticon invasion of Chicago. Like its predecessors, the film is directed by Michael Bay and executive produced by Steven Spielberg. Ehren Kruger is the film's screenwriter, having written every Transformers film since Transformers: Revenge of the Fallen. The film features an entirely new cast of human characters and is the first in the series to feature the Dinobots. Returning Transformers include Optimus Prime, Bumblebee, Ratchet, Leadfoot, Brains and Megatron (now known as Galvatron). The film was released on June 27, 2014, in IMAX and 3D." 43 | Transformers: Dark of the Moon,2011,$204000000,"$195,000,000.00",http://upload.wikimedia.org/wikipedia/en/b/bf/Transformers_dark_of_the_moon_ver5.jpg,http://en.wikipedia.org/wiki/Transformers:_Dark_of_the_Moon,"Transformers: Dark of the Moon is a 2011 American science fictionaction film based on the Transformers toy line. First released on June 23, 2011, it is the third installment of the live-actionTransformers film series. It is a sequel to 2009's Transformers: Revenge of the Fallen taking place three years after that. The film is also the first in the franchise without the involvement of DreamWorks, leaving the series to be produced solely by Paramount Pictures. Like its predecessors, Transformers and Transformers: Revenge of the Fallen, Transformers: Dark of the Moon is directed by Michael Bay and executive produced by Steven Spielberg. This was the last film in the series to be owned by Takara Tomy, as Hasbro assumed ownership of the Transformers films in Japan. The film's story is set three years after the events of the 2009 film, with the Autobots, during their collaboration with the NEST (Nonbiological Extraterrestrial Species Treaty) military force, discovering a hidden alien technology in possession of humans, which had been found by Apollo 11 on the Moon 42 years earlier. However, the Decepticons unveil a plan to use the technology to enslave humanity in order to restore Cybertron, the home planet of the Transformers." 44 | Transformers: Revenge of the Fallen,2009,$220000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/c/cb/TF2SteelPoster.jpg,http://en.wikipedia.org/wiki/Transformers:_Revenge_of_the_Fallen,"Transformers: Revenge of the Fallen is a 2009 American science fictionaction film directed by Michael Bay and executive produced by Steven Spielberg. It is a sequel to 2007's Transformers and the second installment in the live-actionTransformers series taking place two years after Transformers. The plot revolves around Sam Witwicky (Shia LaBeouf), who is caught in the war between two factions of alien robots, the Autobots and the Decepticons. Sam is having weird visions of Cybertronian symbols, and is being hunted by the Decepticons under the orders of an ancient Decepticon named The Fallen (Tony Todd), who seeks to get revenge on Earth by finding and activating a machine that would provide the Decepticons with an energon source, destroying the sun and all life on Earth in the process." 45 | Troy,2004,$219000000,"$175,000,000.00",http://upload.wikimedia.org/wikipedia/en/b/b8/Troy2004Poster.jpg,http://en.wikipedia.org/wiki/Troy_(film),"Troy is a 2004 American epicwar film written by David Benioff and directed by Wolfgang Petersen. It is based on Homers Iliad, which narrates the story of the 10 year Trojan War. Achilles leads his Myrmidons along with the rest of the Greek army invading the historical city of Troy, defended by Hector's Trojan army. The end of the film (the sacking of Troy) is not taken from the Iliad as the ending of the Iliad was based on Hector's death and funeral burial." 46 | Van Helsing,2004,$200000000,"$160,000,000.00",http://upload.wikimedia.org/wikipedia/en/5/55/Van_Helsing_poster.jpg,http://en.wikipedia.org/wiki/Van_Helsing_(film),"Van Helsing is a 2004 American horroraction film directed by Stephen Sommers. It stars Hugh Jackman as vigilante monster hunter Gabriel Van Helsing, and Kate Beckinsale as Anna Valerious. The film is an homage and tribute to the Universal Horror Monster films from the 1930s and '40s (also produced by Universal Studios which were in turn based on novels by Bram Stoker and Mary Shelley), of which director Stephen Sommers is a fan." 47 | WALL-E,2008,$197000000,"$180,000,000.00",http://upload.wikimedia.org/wikipedia/en/c/c2/WALL-Eposter.jpg,http://en.wikipedia.org/wiki/WALL-E,"WALL-E (stylized with an interpunct as WALL·E) is a 2008 American computer animatedscience fictionromantic comedy film produced by Pixar Animation Studios and directed by Andrew Stanton. The story follows a robot named WALL-E, who is designed to clean up an abandoned, waste-covered Earth far in the future. He falls in love with another robot named EVE, who also has a programmed task, and follows her into outer space on an adventure that changes the destiny of both his kind and humanity. Both robots exhibit an appearance of free will and emotions similar to humans, which develop further as the film progresses." 48 | Waterworld,1995,$266000000,"$172,000,000.00",http://upload.wikimedia.org/wikipedia/en/5/5f/Waterworld.jpg,http://en.wikipedia.org/wiki/Waterworld,"Waterworld is a 1995 American post-apocalypticscience fictionaction film directed by Kevin Reynolds and co-written by Peter Rader and David Twohy. It was based on Rader's original 1986 screenplay and stars Kevin Costner, who also produced it with Charles Gordon and John Davis. It was distributed by Universal Pictures." 49 | Wild Wild West,1999,$241000000,"$170,000,000.00",http://upload.wikimedia.org/wikipedia/en/3/31/Wild_wild_west_poster.jpg,http://en.wikipedia.org/wiki/Wild_Wild_West,"Wild Wild West is a 1999 American steampunkwesternaction-comedy film directed by Barry Sonnenfeld. A big-screen adaptation of the 1965–1969 TV series The Wild Wild West, it stars Will Smith, Kevin Kline (who appears in dual roles as the protagonist Artemus Gordon and as President Ulysses S. Grant), Kenneth Branagh and Salma Hayek." 50 | X-Men: Days of Future Past,2014,$200000000,"$200,000,000.00",http://upload.wikimedia.org/wikipedia/en/0/0c/X-Men_Days_of_Future_Past_poster.jpg,http://en.wikipedia.org/wiki/X-Men:_Days_of_Future_Past,"X-Men: Days of Future Past is a 2014 superhero film based on the fictional X-Men characters that appear in Marvel Comics. Directed by Bryan Singer, it is the seventh installment of the X-Men film series and acts as a sequel to both 2006's X-Men: The Last Stand and 2011's X-Men: First Class. The story, inspired by the 1981 Uncanny X-Men storyline ""Days of Future Past"" produced by Chris Claremont and John Byrne, focuses on two time periods and Wolverine going to 1973 to save the future of mankind. The film stars an ensemble cast, including Hugh Jackman, James McAvoy, Michael Fassbender, Jennifer Lawrence, Halle Berry, Anna Paquin, Ellen Page, Nicholas Hoult, Shawn Ashmore, Peter Dinklage, Ian McKellen, and Patrick Stewart. Simon Kinberg wrote the screenplay from a story conceived by him, Matthew Vaughn, and Jane Goldman." 51 | X-Men: The Last Stand,2006,$246000000,"$210,000,000.00",http://upload.wikimedia.org/wikipedia/en/5/56/X-Men_The_Last_Stand.jpg,http://en.wikipedia.org/wiki/X-Men:_The_Last_Stand,"X-Men: The Last Stand (also known as X-Men 3 or X3) is a 2006 superhero film, based on the X-Men superhero team introduced in Marvel Comics. The film, distributed by 20th Century Fox, is the third installment in the X-Men film series. It was directed by Brett Ratner, written by Simon Kinberg and Zak Penn, and features an ensemble cast, including Hugh Jackman, Halle Berry, Patrick Stewart, Ian McKellen, Anna Paquin, and Famke Janssen. The film's script is loosely based on two X-Men comic book story arcs: ""The Dark Phoenix Saga"" by writer Chris Claremont and artist John Byrne, and ""Gifted"" by writer Joss Whedon and artist John Cassaday, with a plot that revolves around a ""mutant cure"" that causes serious repercussions among mutants and humans, and on the resurrection of Jean Grey." 52 | -------------------------------------------------------------------------------- /docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: "2" 2 | 3 | services: 4 | engine: 5 | image: qlikcore/engine:12.792.0 6 | restart: always 7 | command: -S AcceptEULA=${ACCEPT_EULA} 8 | ports: 9 | - "19076:9076" 10 | volumes: 11 | - ./data:/data 12 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "core-get-started", 3 | "version": "0.0.1", 4 | "description": "Examples on basic usage of QIX Engine running in a Docker container.", 5 | "author": "QlikTech International AB", 6 | "private": true, 7 | "license": "MIT", 8 | "scripts": { 9 | "hello-engine": "node ./src/hello-engine/hello-engine.js", 10 | "hello-data": "node ./src/hello-data/hello-data.js", 11 | "hello-data-halyard": "node ./src/hello-data/hello-data-halyard.js", 12 | "hello-visualization": "webpack-dev-server --config ./src/hello-visualization/webpack.config.js", 13 | "lint": "eslint .", 14 | "lint-fix": "eslint --fix ." 15 | }, 16 | "dependencies": { 17 | "angular": "1.8.1", 18 | "babel-polyfill": "6.26.0", 19 | "enigma.js": "2.7.2", 20 | "halyard.js": "1.3.2", 21 | "picasso-plugin-q": "0.34.0", 22 | "picasso.js": "0.34.0", 23 | "ws": "7.3.1" 24 | }, 25 | "devDependencies": { 26 | "@after-work.js/aw": "6.0.14", 27 | "@after-work.js/transform": "6.0.14", 28 | "@babel/core": "7.11.6", 29 | "@babel/preset-env": "7.11.5", 30 | "babel-loader": "8.1.0", 31 | "babel-plugin-istanbul": "6.0.0", 32 | "copy-webpack-plugin": "6.2.1", 33 | "eslint": "7.11.0", 34 | "eslint-config-airbnb-base": "14.2.0", 35 | "eslint-plugin-import": "2.22.1", 36 | "json-loader": "0.5.7", 37 | "protractor": "7.0.0", 38 | "raw-loader": "4.0.2", 39 | "webdriver-manager": "12.1.7", 40 | "webpack": "4.44.2", 41 | "webpack-cli": "3.3.12", 42 | "webpack-dev-server": "3.11.0" 43 | }, 44 | "engines": { 45 | "node": ">=8.9.3" 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "qlik-oss", 4 | "qlik-oss:groupMinorPatch" 5 | ] 6 | } 7 | -------------------------------------------------------------------------------- /src/hello-data/hello-data-halyard.js: -------------------------------------------------------------------------------- 1 | /* eslint no-console:0 */ 2 | const WebSocket = require('ws'); 3 | const enigma = require('enigma.js'); 4 | const schema = require('enigma.js/schemas/3.2.json'); 5 | const Halyard = require('halyard.js'); 6 | const mixins = require('halyard.js/dist/halyard-enigma-mixin'); 7 | 8 | (async () => { 9 | try { 10 | console.log('Creating Halyard table data representation.'); 11 | const halyard = new Halyard(); 12 | const moviesPath = '/data/movies.csv'; 13 | const moviesTable = new Halyard.Table(moviesPath, { 14 | name: 'Movies', 15 | delimiter: ',', 16 | }); 17 | 18 | halyard.addTable(moviesTable); 19 | 20 | console.log('Opening session app on engine using Halyard mixin.'); 21 | const session = enigma.create({ 22 | schema, 23 | mixins, 24 | url: 'ws://localhost:19076', 25 | createSocket: (url) => new WebSocket(url), 26 | }); 27 | const qix = await session.open(); 28 | const app = await qix.createSessionAppUsingHalyard(halyard); 29 | 30 | console.log('Creating session object with movie titles.'); 31 | const moviesCount = 10; 32 | const properties = { 33 | qInfo: { qType: 'hello-data' }, 34 | qHyperCubeDef: { 35 | qDimensions: [{ qDef: { qFieldDefs: ['Movie'] } }], 36 | qInitialDataFetch: [{ qHeight: moviesCount, qWidth: 1 }], 37 | }, 38 | }; 39 | const object = await app.createSessionObject(properties); 40 | const layout = await object.getLayout(); 41 | const movies = layout.qHyperCube.qDataPages[0].qMatrix; 42 | 43 | console.log(`Listing the ${moviesCount} first movies:`); 44 | movies.forEach((movie) => { console.log(movie[0].qText); }); 45 | 46 | await session.close(); 47 | console.log('Session closed.'); 48 | } catch (err) { 49 | console.log('Whoops! An error occurred.', err); 50 | process.exit(1); 51 | } 52 | })(); 53 | -------------------------------------------------------------------------------- /src/hello-data/hello-data.js: -------------------------------------------------------------------------------- 1 | /* eslint no-console:0 */ 2 | const WebSocket = require('ws'); 3 | const enigma = require('enigma.js'); 4 | const schema = require('enigma.js/schemas/3.2.json'); 5 | 6 | (async () => { 7 | try { 8 | console.log('Creating session app on engine.'); 9 | const session = enigma.create({ 10 | schema, 11 | url: 'ws://localhost:19076/app/', 12 | createSocket: (url) => new WebSocket(url), 13 | }); 14 | const qix = await session.open(); 15 | const app = await qix.createSessionApp(); 16 | 17 | console.log('Creating data connection to local files.'); 18 | await app.createConnection({ 19 | qName: 'data', 20 | qConnectionString: '/data/', 21 | qType: 'folder', 22 | }); 23 | 24 | console.log('Running reload script.'); 25 | const script = `Movies: 26 | LOAD * FROM [lib://data/movies.csv] 27 | (txt, utf8, embedded labels, delimiter is ',');`; 28 | await app.setScript(script); 29 | await app.doReload(); 30 | 31 | console.log('Creating session object with movie titles.'); 32 | const moviesCount = 10; 33 | const properties = { 34 | qInfo: { qType: 'hello-data' }, 35 | qHyperCubeDef: { 36 | qDimensions: [{ qDef: { qFieldDefs: ['Movie'] } }], 37 | qInitialDataFetch: [{ qHeight: moviesCount, qWidth: 1 }], 38 | }, 39 | }; 40 | const object = await app.createSessionObject(properties); 41 | const layout = await object.getLayout(); 42 | const movies = layout.qHyperCube.qDataPages[0].qMatrix; 43 | 44 | console.log(`Listing the ${moviesCount} first movies:`); 45 | movies.forEach((movie) => { console.log(movie[0].qText); }); 46 | 47 | await session.close(); 48 | console.log('Session closed.'); 49 | } catch (err) { 50 | console.log('Whoops! An error occurred.', err); 51 | process.exit(1); 52 | } 53 | })(); 54 | -------------------------------------------------------------------------------- /src/hello-engine/hello-engine.js: -------------------------------------------------------------------------------- 1 | /* eslint no-console:0 */ 2 | const WebSocket = require('ws'); 3 | const enigma = require('enigma.js'); 4 | const schema = require('enigma.js/schemas/3.2.json'); 5 | 6 | (async () => { 7 | try { 8 | console.log('Creating and opening session.'); 9 | const session = enigma.create({ 10 | schema, 11 | url: 'ws://localhost:19076/app', 12 | createSocket: (url) => new WebSocket(url), 13 | }); 14 | const global = await session.open(); 15 | 16 | const version = await global.engineVersion(); 17 | console.log(`Engine version retrieved: ${version.qComponentVersion}`); 18 | 19 | await session.close(); 20 | console.log('Session closed.'); 21 | } catch (err) { 22 | console.log('Whoops! An error occurred.', err); 23 | process.exit(1); 24 | } 25 | })(); 26 | -------------------------------------------------------------------------------- /src/hello-visualization/app.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: quicksand-light; 3 | src: url(resources/Quicksand-Light.otf); 4 | } 5 | 6 | @font-face { 7 | font-family: quicksand-regular; 8 | src: url(resources/Quicksand-Regular.otf); 9 | } 10 | 11 | @font-face { 12 | font-family: lui-icons; 13 | src: url(resources/LUI-icons.woff); 14 | } 15 | 16 | html, 17 | body { 18 | margin: 0; 19 | height: 100%; 20 | } 21 | 22 | body { 23 | font-family: quicksand-regular; 24 | font-size: 14px; 25 | color: white; 26 | background: #4d4d4d; 27 | user-select: none; 28 | overflow: hidden; 29 | } 30 | 31 | app { 32 | width: 100%; 33 | height: 100%; 34 | display: flex; 35 | flex-direction: column; 36 | } 37 | 38 | .header { 39 | height: 80px; 40 | background: linear-gradient( 41 | to right, 42 | rgba(135, 203, 172, 0.82), 43 | rgba(119, 199, 193, 0.82) 44 | ); 45 | display: flex; 46 | justify-content: space-between; 47 | padding: 15px 250px; 48 | box-sizing: border-box; 49 | flex: 0 0 auto; 50 | } 51 | 52 | .content { 53 | flex: 1 1 auto; 54 | display: flex; 55 | flex-direction: column; 56 | justify-content: center; 57 | align-items: center; 58 | min-height: 496px; 59 | padding-bottom: 50px; 60 | overflow-y: auto; 61 | } 62 | 63 | .left-content { 64 | display: flex; 65 | flex-direction: column; 66 | } 67 | 68 | .qliktive { 69 | font-size: 14px; 70 | font-weight: bold; 71 | padding-bottom: 7px; 72 | } 73 | 74 | .hello-visualization { 75 | font-size: 22px; 76 | font-family: quicksand-light; 77 | } 78 | 79 | .right-content { 80 | display: flex; 81 | align-items: center; 82 | } 83 | 84 | .clear-selections { 85 | font-weight: bold; 86 | background: rgba(0, 0, 0, 0.11); 87 | border: 1px solid rgba(0, 0, 0, 0.11); 88 | border-radius: 16px; 89 | padding: 7px 13px; 90 | cursor: pointer; 91 | } 92 | 93 | .clear-selections:hover { 94 | background: rgba(0, 0, 0, 0.15); 95 | } 96 | 97 | .clear-selections:active { 98 | background: rgba(0, 0, 0, 0.25); 99 | } 100 | 101 | .disabled, 102 | .disabled:hover, 103 | .disabled:active { 104 | cursor: default; 105 | color: rgba(255, 255, 255, 0.5); 106 | background: rgba(0, 0, 0, 0.07); 107 | } 108 | 109 | .git-hub-icon { 110 | height: 36px; 111 | margin-left: 20px; 112 | cursor: pointer; 113 | } 114 | 115 | .container { 116 | width: 960px; 117 | text-align: center; 118 | padding: 20px; 119 | border-radius: 11px; 120 | max-width: 100%; 121 | box-sizing: border-box; 122 | } 123 | 124 | .title { 125 | font-size: 22px; 126 | padding-bottom: 10px; 127 | } 128 | 129 | #chart-container-scatterplot { 130 | height: 340px; 131 | margin-top: 40px; 132 | position: relative; 133 | } 134 | 135 | #chart-container-linechart { 136 | height: 340px; 137 | margin-top: 40px; 138 | position: relative; 139 | } 140 | 141 | .picasso-chart circle { 142 | cursor: pointer; 143 | } 144 | 145 | .picasso-chart circle:hover { 146 | fill: #f2f2f2; 147 | } 148 | 149 | .tooltip { 150 | box-sizing: border-box; 151 | display: inline-block; 152 | padding: 5px 10px; 153 | border-radius: 3px; 154 | font-size: 13px; 155 | position: relative; 156 | transition: opacity 50ms ease-out; 157 | opacity: 1; 158 | z-index: 1021; 159 | color: #ffffff; 160 | background-color: rgba(0, 0, 0, 0.9); 161 | } 162 | 163 | .footer { 164 | font-size: 13px; 165 | position: absolute; 166 | width: 100%; 167 | transition: height 0.5s; 168 | height: 50px; 169 | background: linear-gradient( 170 | to right, 171 | rgba(135, 203, 172, 0.82), 172 | rgba(119, 199, 193, 0.82) 173 | ); 174 | bottom: 0; 175 | padding: 10px 250px; 176 | box-sizing: border-box; 177 | } 178 | 179 | .footer.expanded { 180 | transition: height 0.5s; 181 | height: 290px; 182 | } 183 | 184 | .lui-icon--top { 185 | background: rgba(0, 0, 0, 0.11); 186 | border: 1px solid rgba(0, 0, 0, 0.11); 187 | border-radius: 4px; 188 | padding: 6px 9px 7px 9px; 189 | cursor: pointer; 190 | display: inline-block; 191 | } 192 | 193 | .lui-icon--top:hover { 194 | background: rgba(0, 0, 0, 0.15); 195 | } 196 | 197 | .lui-icon--top:active { 198 | background: rgba(0, 0, 0, 0.25); 199 | } 200 | 201 | .lui-icon--top:before { 202 | font-family: lui-icons; 203 | content: "\2D9"; 204 | } 205 | 206 | .lui-icon--top.expanded { 207 | display: inline-block; 208 | transform: rotate(180deg); 209 | } 210 | 211 | .footer-title { 212 | font-size: 15px; 213 | font-weight: bold; 214 | padding-left: 10px; 215 | } 216 | 217 | .info-wrapper { 218 | margin: 15px 0; 219 | display: flex; 220 | } 221 | 222 | .movie-image { 223 | height: 219px; 224 | border-radius: 3px; 225 | } 226 | 227 | .movie-info { 228 | margin-left: 20px; 229 | display: flex; 230 | flex-direction: column; 231 | } 232 | 233 | .info-title { 234 | font-size: 15px; 235 | font-weight: bold; 236 | } 237 | 238 | .info-title { 239 | font-size: 15px; 240 | font-weight: bold; 241 | } 242 | 243 | .info-title:not(:first-child) { 244 | padding-top: 7px; 245 | } 246 | 247 | .movie-description { 248 | max-height: 85px; 249 | overflow-x: hidden; 250 | overflow-y: auto; 251 | } 252 | 253 | .no-movie-selected { 254 | text-align: center; 255 | line-height: 240px; 256 | font-size: 18px; 257 | } 258 | 259 | .error { 260 | position: absolute; 261 | top: 0; 262 | width: 100%; 263 | height: 100%; 264 | background: rgba(115, 115, 115, 0.4); 265 | display: flex; 266 | justify-content: center; 267 | align-items: center; 268 | } 269 | 270 | .error-wrapper { 271 | display: flex; 272 | flex-direction: column; 273 | align-items: center; 274 | } 275 | 276 | .lui-icon--warning:before { 277 | font-family: lui-icons; 278 | font-size: 56px; 279 | content: "\E8"; 280 | } 281 | 282 | .error-title { 283 | font-size: 25px; 284 | padding-top: 10px; 285 | padding-bottom: 15px; 286 | } 287 | 288 | @media screen and (max-width: 1200px) { 289 | .header { 290 | padding: 15px 25px; 291 | } 292 | 293 | .footer { 294 | padding: 10px 25px; 295 | } 296 | } 297 | -------------------------------------------------------------------------------- /src/hello-visualization/app.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | Qliktive 4 | Hello Visualization 5 |
6 |
7 |
Clear selections
8 | 9 |
10 |
11 |
12 |
13 |
Top 50 most expensive movies
14 |
Comparison of top 50 most expensive movies and their imdb ratings
15 |
16 |
17 |
18 |
Total cost distributed over time
19 |
20 |
21 |
22 |
23 |
24 | 25 | Movie Information 26 |
27 |
28 | 29 |
30 | Title 31 | 32 | Year 33 | 34 | Genre 35 | 36 | Description 37 | 38 |
39 |
40 |
No movie is selected
41 |
42 | 43 |
44 |
45 | 46 | Oops! Something went wrong. 47 | {{$ctrl.error ? $ctrl.error : "Unexpected error"}} 48 |
49 |
50 | -------------------------------------------------------------------------------- /src/hello-visualization/app.js: -------------------------------------------------------------------------------- 1 | /* eslint-env browser */ 2 | 3 | import Halyard from 'halyard.js'; 4 | import angular from 'angular'; 5 | import enigma from 'enigma.js'; 6 | import enigmaMixin from 'halyard.js/dist/halyard-enigma-mixin'; 7 | import qixSchema from 'enigma.js/schemas/3.2.json'; 8 | import template from './app.html'; 9 | import Scatterplot from './scatterplot'; 10 | import Linechart from './linechart'; 11 | import 'babel-polyfill'; 12 | 13 | const halyard = new Halyard(); 14 | 15 | angular.module('app', []).component('app', { 16 | bindings: {}, 17 | controller: ['$scope', '$q', '$http', function Controller($scope, $q, $http) { 18 | $scope.dataSelected = false; 19 | $scope.showFooter = false; 20 | 21 | $scope.toggleFooter = () => { 22 | $scope.showFooter = !$scope.showFooter; 23 | if (!$scope.showFooter && $scope.dataSelected) { 24 | this.clearAllSelections(); 25 | } 26 | }; 27 | 28 | $scope.openGithub = () => { 29 | window.open('https://github.com/qlik-oss/core-get-started'); 30 | }; 31 | 32 | this.connected = false; 33 | this.painted = false; 34 | this.connecting = true; 35 | 36 | let app = null; 37 | let scatterplotObject = null; 38 | let linechartObject = null; 39 | 40 | const select = async (value) => { 41 | const field = await app.getField('Movie'); 42 | field.select(value); 43 | $scope.dataSelected = true; 44 | const layout = await this.getMovieInfo(); 45 | Scatterplot.showDetails(layout); 46 | $scope.showFooter = true; 47 | $scope.$digest(); 48 | }; 49 | 50 | const scatterplotProperties = { 51 | qInfo: { 52 | qType: 'visualization', 53 | qId: '', 54 | }, 55 | type: 'my-picasso-scatterplot', 56 | labels: true, 57 | qHyperCubeDef: { 58 | qDimensions: [{ 59 | qDef: { 60 | qFieldDefs: ['Movie'], 61 | qSortCriterias: [{ 62 | qSortByAscii: 1, 63 | }], 64 | }, 65 | }], 66 | qMeasures: [{ 67 | qDef: { 68 | qDef: '[Adjusted Costs]', 69 | qLabel: 'Adjusted cost ($)', 70 | }, 71 | qSortBy: { 72 | qSortByNumeric: -1, 73 | }, 74 | }, 75 | { 76 | qDef: { 77 | qDef: '[imdbRating]', 78 | qLabel: 'imdb rating', 79 | }, 80 | }], 81 | qInitialDataFetch: [{ 82 | qTop: 0, qHeight: 50, qLeft: 0, qWidth: 3, 83 | }], 84 | qSuppressZero: false, 85 | qSuppressMissing: true, 86 | }, 87 | }; 88 | 89 | const scatterplot = new Scatterplot(); 90 | 91 | const paintScatterPlot = (layout) => { 92 | scatterplot.paintScatterplot(document.getElementById('chart-container-scatterplot'), layout, { 93 | select, 94 | clear: () => this.clearAllSelections(), 95 | hasSelected: $scope.dataSelected, 96 | }); 97 | this.painted = true; 98 | }; 99 | 100 | const linechartProperties = { 101 | qInfo: { 102 | qType: 'visualization', 103 | qId: '', 104 | }, 105 | type: 'my-picasso-linechart', 106 | labels: true, 107 | qHyperCubeDef: { 108 | qDimensions: [{ 109 | qDef: { 110 | qFieldDefs: ['Year'], 111 | qSortCriterias: [{ 112 | qSortByAscii: 1, 113 | }], 114 | }, 115 | }], 116 | qMeasures: [{ 117 | qDef: { 118 | qDef: 'Sum([Adjusted Costs])', 119 | qLabel: 'Adjusted Costs in total ($)', 120 | }, 121 | qSortBy: { 122 | qSortByNumeric: -1, 123 | }, 124 | }, 125 | ], 126 | qInitialDataFetch: [{ 127 | qTop: 0, qHeight: 50, qLeft: 0, qWidth: 3, 128 | }], 129 | qSuppressZero: false, 130 | qSuppressMissing: false, 131 | }, 132 | }; 133 | 134 | const linechart = new Linechart(); 135 | 136 | const paintLineChart = (layout) => { 137 | linechart.paintLinechart(document.getElementById('chart-container-linechart'), layout); 138 | this.painted = true; 139 | }; 140 | 141 | this.generateGUID = () => 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => { 142 | // eslint-disable-next-line no-bitwise 143 | const r = Math.random() * 16 | 0; 144 | // eslint-disable-next-line no-bitwise 145 | const v = c === 'x' ? r : ((r & 0x3) | 0x8); 146 | return v.toString(16); 147 | }); 148 | 149 | this.$onInit = () => { 150 | const config = { 151 | Promise: $q, 152 | schema: qixSchema, 153 | mixins: enigmaMixin, 154 | url: `ws://${window.location.hostname}:19076/app/${this.generateGUID()}`, 155 | }; 156 | 157 | // Add local data 158 | const filePathMovie = '/data/movies.csv'; 159 | const tableMovie = new Halyard.Table(filePathMovie, { 160 | name: 'Movies', 161 | fields: [ 162 | { src: 'Movie', name: 'Movie' }, 163 | { src: 'Year', name: 'Year' }, 164 | { src: 'Adjusted Costs', name: 'Adjusted Costs' }, 165 | { src: 'Description', name: 'Description' }, 166 | { src: 'Image', name: 'Image' }, 167 | ], 168 | delimiter: ',', 169 | }); 170 | halyard.addTable(tableMovie); 171 | 172 | // Add web data 173 | (async () => { 174 | const data = await $http.get('https://gist.githubusercontent.com/carlioth/b86ede12e75b5756c9f34c0d65a22bb3/raw/e733b74c7c1c5494669b36893a31de5427b7b4fc/MovieInfo.csv'); 175 | const table = new Halyard.Table(data.data, { name: 'MoviesInfo', delimiter: ';', characterSet: 'utf8' }); 176 | halyard.addTable(table); 177 | let qix; 178 | try { 179 | qix = await enigma.create(config).open(); 180 | this.connected = true; 181 | this.connecting = false; 182 | } catch (error) { 183 | this.error = 'Could not connect to QIX Engine'; 184 | this.connecting = false; 185 | } 186 | 187 | try { 188 | app = await qix.createSessionAppUsingHalyard(halyard); 189 | } catch (error) { 190 | this.error = 'Could not create session app'; 191 | this.connected = false; 192 | this.connecting = false; 193 | } 194 | await app.getAppLayout(); 195 | 196 | scatterplotObject = await app.createSessionObject(scatterplotProperties); 197 | 198 | const updateScatterPlot = (async () => { 199 | const layout = await scatterplotObject.getLayout(); 200 | paintScatterPlot(layout); 201 | }); 202 | 203 | scatterplotObject.on('changed', updateScatterPlot); 204 | updateScatterPlot(); 205 | 206 | linechartObject = await app.createSessionObject(linechartProperties); 207 | const linechartUpdate = (async () => { 208 | const layout = await linechartObject.getLayout(); 209 | paintLineChart(layout); 210 | }); 211 | 212 | linechartObject.on('changed', linechartUpdate); 213 | linechartUpdate(); 214 | })(); 215 | }; 216 | 217 | this.clearAllSelections = () => { 218 | if ($scope.dataSelected) { 219 | $scope.dataSelected = false; 220 | app.clearAll(); 221 | } 222 | $scope.showFooter = false; 223 | }; 224 | 225 | this.getMovieInfo = async () => { 226 | const tableProperties = { 227 | qInfo: { 228 | qType: 'visualization', 229 | qId: '', 230 | }, 231 | type: 'my-info-table', 232 | labels: true, 233 | qHyperCubeDef: { 234 | qDimensions: [{ 235 | qDef: { 236 | qFieldDefs: ['Movie'], 237 | }, 238 | }, 239 | { 240 | qDef: { 241 | qFieldDefs: ['Image'], 242 | }, 243 | }, 244 | { 245 | qDef: { 246 | qFieldDefs: ['Year'], 247 | }, 248 | }, 249 | { 250 | qDef: { 251 | qFieldDefs: ['Genre'], 252 | }, 253 | }, 254 | { 255 | qDef: { 256 | qFieldDefs: ['Description'], 257 | }, 258 | }, 259 | ], 260 | qInitialDataFetch: [{ 261 | qTop: 0, qHeight: 50, qLeft: 0, qWidth: 50, 262 | }], 263 | qSuppressZero: false, 264 | qSuppressMissing: true, 265 | }, 266 | }; 267 | const model = await app.createSessionObject(tableProperties); 268 | return model.getLayout(); 269 | }; 270 | }], 271 | template, 272 | }); 273 | 274 | angular.bootstrap(document, ['app']); 275 | -------------------------------------------------------------------------------- /src/hello-visualization/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Top 50 most expensive movies 7 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/hello-visualization/linechart.js: -------------------------------------------------------------------------------- 1 | /* eslint-env browser */ 2 | /* eslint import/extensions:0 */ 3 | 4 | import picasso from 'picasso.js'; 5 | import picassoQ from 'picasso-plugin-q'; 6 | 7 | picasso.use(picassoQ); 8 | 9 | export default class Linechart { 10 | constructor() { 11 | this.axisPainted = false; 12 | this.pic = null; 13 | } 14 | 15 | paintLinechart(element, layout) { 16 | if (!(layout.qHyperCube 17 | && layout.qHyperCube.qDataPages 18 | && layout.qHyperCube.qDataPages[0] 19 | && layout.qHyperCube.qDataPages[0].qMatrix) 20 | ) { 21 | return; 22 | } 23 | const settings = { 24 | collections: [ 25 | { 26 | key: 'coll', 27 | data: { 28 | extract: { 29 | field: 'qDimensionInfo/0', 30 | value: (v) => v.qNum, 31 | props: { 32 | movie: { value: (v) => v.qText }, 33 | movieCount: { field: 'qMeasureInfo/0' }, 34 | }, 35 | }, 36 | }, 37 | }, 38 | ], 39 | scales: { 40 | x: { data: { field: 'qDimensionInfo/0' }, expand: 0.05, type: 'linear' }, 41 | y: { data: { field: 'qMeasureInfo/0' }, expand: 0.1, invert: true }, 42 | }, 43 | components: [ 44 | { 45 | key: 'xaxis', 46 | type: 'axis', 47 | scale: 'x', 48 | dock: 'bottom', 49 | formatter: { 50 | type: 'd3-number', 51 | }, 52 | settings: { labels: { fill: '#f2f2f2' } }, 53 | 54 | }, 55 | { 56 | key: 'yaxis', 57 | type: 'axis', 58 | scale: 'y', 59 | dock: 'left', 60 | settings: { labels: { fill: '#f2f2f2' } }, 61 | }, 62 | 63 | { 64 | key: 'xtitle', 65 | type: 'text', 66 | scale: 'x', 67 | dock: 'bottom', 68 | style: { 69 | text: { fill: '#f2f2f2' }, 70 | }, 71 | }, 72 | { 73 | key: 'ytitle', 74 | type: 'text', 75 | scale: 'y', 76 | dock: 'left', 77 | style: { 78 | text: { fill: '#f2f2f2' }, 79 | }, 80 | }, 81 | { 82 | key: 'lines', 83 | type: 'line', 84 | data: { collection: 'coll' }, 85 | 86 | settings: { 87 | 88 | coordinates: { 89 | major: { scale: 'x' }, 90 | minor: { scale: 'y', ref: 'movieCount' }, 91 | }, 92 | layers: { 93 | line: {}, 94 | }, 95 | }, 96 | }], 97 | }; 98 | 99 | if (!this.pic) { 100 | this.pic = picasso.chart({ 101 | element, 102 | data: [{ 103 | type: 'q', 104 | key: 'qHyperCube', 105 | data: layout.qHyperCube, 106 | }], 107 | settings, 108 | }); 109 | } else { 110 | this.pic.update({ 111 | data: [{ 112 | type: 'q', 113 | key: 'qHyperCube', 114 | data: layout.qHyperCube, 115 | }], 116 | settings, 117 | }); 118 | } 119 | } 120 | 121 | static hideTooltip() { 122 | const elements = document.getElementsByClassName('tooltip'); 123 | if (elements[0]) { 124 | document.body.removeChild(elements[0]); 125 | } 126 | } 127 | 128 | static showTooltip(text, point) { 129 | const currentTooltip = document.createElement('div'); 130 | currentTooltip.appendChild(document.createTextNode(text)); 131 | currentTooltip.style.position = 'absolute'; 132 | currentTooltip.style.top = '-99999px'; 133 | currentTooltip.style.left = '-99999px'; 134 | currentTooltip.classList.add('tooltip'); 135 | 136 | document.body.appendChild(currentTooltip); 137 | 138 | // Reposition the tooltip 139 | currentTooltip.style.top = `${point.y}px`; 140 | currentTooltip.style.left = `${(point.x + 5)}px`; 141 | } 142 | } 143 | -------------------------------------------------------------------------------- /src/hello-visualization/resources/LUI-icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/qlik-oss/core-get-started/79d50c483ad728674214065a48294f9cf6de6851/src/hello-visualization/resources/LUI-icons.woff -------------------------------------------------------------------------------- /src/hello-visualization/resources/Quicksand-Light.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/qlik-oss/core-get-started/79d50c483ad728674214065a48294f9cf6de6851/src/hello-visualization/resources/Quicksand-Light.otf -------------------------------------------------------------------------------- /src/hello-visualization/resources/Quicksand-Regular.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/qlik-oss/core-get-started/79d50c483ad728674214065a48294f9cf6de6851/src/hello-visualization/resources/Quicksand-Regular.otf -------------------------------------------------------------------------------- /src/hello-visualization/resources/Quicksand.LICENSE: -------------------------------------------------------------------------------- 1 | See: http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL_web 2 | From: http://www.fontsc.com/font/quicksand 3 | -------------------------------------------------------------------------------- /src/hello-visualization/resources/github-social-logo.svg: -------------------------------------------------------------------------------- 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 | -------------------------------------------------------------------------------- /src/hello-visualization/resources/hello-viz.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/qlik-oss/core-get-started/79d50c483ad728674214065a48294f9cf6de6851/src/hello-visualization/resources/hello-viz.png -------------------------------------------------------------------------------- /src/hello-visualization/scatterplot.js: -------------------------------------------------------------------------------- 1 | /* eslint-env browser */ 2 | /* eslint import/extensions:0 */ 3 | 4 | import picasso from 'picasso.js'; 5 | import picassoQ from 'picasso-plugin-q'; 6 | 7 | picasso.use(picassoQ); 8 | 9 | export default class Scatterplot { 10 | constructor() { 11 | this.axisPainted = false; 12 | this.pic = null; 13 | } 14 | 15 | paintScatterplot(element, layout, selectionAPI) { 16 | if (!(layout.qHyperCube 17 | && layout.qHyperCube.qDataPages 18 | && layout.qHyperCube.qDataPages[0] 19 | && layout.qHyperCube.qDataPages[0].qMatrix) 20 | ) { 21 | return; 22 | } 23 | if (selectionAPI.hasSelected) { 24 | return; // keep selected chart state 25 | } 26 | const settings = { 27 | collections: [ 28 | { 29 | key: 'coll', 30 | data: { 31 | extract: { 32 | field: 'qDimensionInfo/0', 33 | props: { 34 | movie: { value: (v) => v.qText }, 35 | cost: { field: 'qMeasureInfo/0' }, 36 | rating: { field: 'qMeasureInfo/1' }, 37 | }, 38 | }, 39 | }, 40 | }, 41 | ], 42 | scales: { 43 | x: { data: { field: 'qMeasureInfo/1' }, expand: 0.1 }, 44 | y: { data: { field: 'qMeasureInfo/0' }, expand: 0.1, invert: true }, 45 | }, 46 | components: [ 47 | { 48 | key: 'xaxis', 49 | type: 'axis', 50 | scale: 'x', 51 | dock: 'bottom', 52 | settings: { labels: { fill: '#f2f2f2' } }, 53 | }, 54 | { 55 | key: 'yaxis', 56 | type: 'axis', 57 | scale: 'y', 58 | dock: 'left', 59 | settings: { labels: { fill: '#f2f2f2' } }, 60 | }, 61 | { 62 | key: 'xtitle', 63 | type: 'text', 64 | scale: 'x', 65 | dock: 'bottom', 66 | style: { 67 | text: { fill: '#f2f2f2' }, 68 | }, 69 | }, 70 | { 71 | key: 'ytitle', 72 | type: 'text', 73 | scale: 'y', 74 | dock: 'left', 75 | style: { 76 | text: { fill: '#f2f2f2' }, 77 | }, 78 | }, 79 | { 80 | key: 'points', 81 | type: 'point', 82 | data: { collection: 'coll' }, 83 | brush: { 84 | trigger: [{ 85 | on: 'tap', 86 | action: 'set', 87 | data: ['movie'], 88 | propagation: 'stop', 89 | contexts: ['highlight'], 90 | }, { 91 | on: 'over', 92 | action: 'set', 93 | data: ['movie'], 94 | propagation: 'stop', 95 | contexts: ['tooltip'], 96 | }], 97 | consume: [{ 98 | context: 'highlight', 99 | style: { 100 | inactive: { 101 | fill: 'rgba(109, 232, 193, 0.3)', 102 | }, 103 | }, 104 | }, { 105 | context: 'tooltip', 106 | }], 107 | }, 108 | settings: { 109 | x: { scale: 'x', ref: 'rating' }, 110 | y: { scale: 'y', ref: 'cost' }, 111 | size: 0.4, 112 | opacity: 0.8, 113 | fill: 'rgba(109, 232, 193, 1.0)', 114 | }, 115 | }, 116 | ], 117 | }; 118 | 119 | if (!this.pic) { 120 | this.pic = picasso.chart({ 121 | element, 122 | data: [{ 123 | type: 'q', 124 | key: 'qHyperCube', 125 | data: layout.qHyperCube, 126 | }], 127 | settings, 128 | }); 129 | 130 | this.pic.brush('highlight').on('update', (added) => { 131 | if (added[0]) { 132 | selectionAPI.select(added[0].values[0]); 133 | } else { 134 | this.pic.brush('highlight').end(); 135 | selectionAPI.clear(); 136 | } 137 | }); 138 | this.pic.brush('tooltip').on('update', (added) => { 139 | if (added.length) { 140 | const s = this.pic.getAffectedShapes('tooltip')[0]; 141 | const rect = s.element.getBoundingClientRect(); 142 | const p = { 143 | x: s.bounds.x + s.bounds.width + rect.x + 5, 144 | y: s.bounds.y + (s.bounds.height / 2) + (rect.y - 28), 145 | }; 146 | Scatterplot.showTooltip(s.data.movie.value, p); 147 | } else { 148 | Scatterplot.hideTooltip(); 149 | } 150 | }); 151 | } else { 152 | this.pic.update({ 153 | data: [{ 154 | type: 'q', 155 | key: 'qHyperCube', 156 | data: layout.qHyperCube, 157 | }], 158 | settings, 159 | }); 160 | } 161 | } 162 | 163 | static showDetails(layout) { 164 | if (!(layout.qHyperCube 165 | && layout.qHyperCube.qDataPages 166 | && layout.qHyperCube.qDataPages[0] 167 | && layout.qHyperCube.qDataPages[0].qMatrix) 168 | ) { 169 | return; 170 | } 171 | 172 | const data = layout.qHyperCube.qDataPages[0].qMatrix.map((item) => ({ 173 | movie: item[0].qText, 174 | image: item[1].qText, 175 | year: item[2].qText, 176 | genre: item[3].qText, 177 | description: item[4].qText, 178 | })); 179 | 180 | const image = document.getElementsByClassName('movie-image')[0]; 181 | image.src = data[0].image; 182 | 183 | const title = document.getElementsByClassName('movie-title')[0]; 184 | title.innerHTML = data[0].movie; 185 | 186 | const year = document.getElementsByClassName('movie-year')[0]; 187 | year.innerHTML = data[0].year; 188 | 189 | const genre = document.getElementsByClassName('movie-genre')[0]; 190 | genre.innerHTML = data[0].genre; 191 | 192 | const description = document.getElementsByClassName('movie-description')[0]; 193 | description.innerHTML = data[0].description; 194 | } 195 | 196 | static hideTooltip() { 197 | const elements = document.getElementsByClassName('tooltip'); 198 | if (elements[0]) { 199 | document.body.removeChild(elements[0]); 200 | } 201 | } 202 | 203 | static showTooltip(text, point) { 204 | Scatterplot.hideTooltip(); 205 | const currentTooltip = document.createElement('div'); 206 | currentTooltip.appendChild(document.createTextNode(text)); 207 | currentTooltip.style.position = 'absolute'; 208 | currentTooltip.style.top = '-99999px'; 209 | currentTooltip.style.left = '-99999px'; 210 | currentTooltip.classList.add('tooltip'); 211 | 212 | document.body.appendChild(currentTooltip); 213 | 214 | // Reposition the tooltip 215 | currentTooltip.style.top = `${point.y}px`; 216 | currentTooltip.style.left = `${(point.x + 5)}px`; 217 | } 218 | } 219 | -------------------------------------------------------------------------------- /src/hello-visualization/webpack.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-env node */ 2 | 3 | const path = require('path'); 4 | const CopyWebpackPlugin = require('copy-webpack-plugin'); 5 | 6 | module.exports = { 7 | mode: 'development', 8 | context: path.resolve(__dirname), 9 | entry: { app: './app.js' }, 10 | output: { 11 | filename: 'app.js', 12 | path: path.resolve(__dirname, 'dist'), 13 | }, 14 | devServer: { host: '0.0.0.0', port: '8080', disableHostCheck: true }, 15 | stats: { 16 | colors: true, 17 | modules: true, 18 | reasons: true, 19 | errorDetails: true, 20 | }, 21 | devtool: 'source-map', 22 | module: { 23 | rules: [ 24 | { 25 | test: /\.html$/, 26 | loader: 'raw-loader', 27 | }, 28 | { 29 | test: /\.js$/, 30 | loader: 'babel-loader', 31 | exclude: [path.resolve(__dirname, 'node_modules')], 32 | query: { presets: ['@babel/preset-env'] }, 33 | }, 34 | ], 35 | }, 36 | plugins: [ 37 | new CopyWebpackPlugin({ 38 | patterns: [ 39 | { from: 'index.html' }, 40 | { from: 'app.html' }, 41 | { from: 'app.css' }, 42 | { from: 'resources/', to: 'resources/' }, 43 | ], 44 | }), 45 | ], 46 | }; 47 | -------------------------------------------------------------------------------- /test/aw.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const extend = require('extend'); // eslint-disable-line import/no-extraneous-dependencies 3 | const util = require('util'); 4 | 5 | module.exports = function initConfig(baseConfig) { 6 | const config = { 7 | baseUrl: 'http://localhost:1337/', 8 | artifactsPath: 'test/__artifacts__', 9 | directConnect: true, 10 | capabilities: { 11 | browserName: 'chrome', 12 | unexpectedAlertBehaviour: 'accept', 13 | chromeOptions: { 14 | args: ['--disable-infobars'], 15 | }, 16 | }, 17 | mochaOpts: { 18 | bail: true, 19 | }, 20 | specs: [ 21 | path.resolve(__dirname, './*.spec.js'), 22 | ], 23 | beforeLaunch() { }, 24 | onComplete() { 25 | browser.manage().logs().get('browser').then((browserLog) => { 26 | console.log(`log: ${util.inspect(browserLog)}`); //eslint-disable-line 27 | }); 28 | }, 29 | }; 30 | return extend(true, baseConfig, config); 31 | }; 32 | -------------------------------------------------------------------------------- /test/hello-visualization.spec.js: -------------------------------------------------------------------------------- 1 | describe('hello-visualization test', () => { 2 | beforeEach(async () => { 3 | await browser.get('http://localhost:8080'); 4 | await browser.driver.manage().window().maximize(); 5 | }); 6 | it('Movie title should match the movie clicked on ', async () => { 7 | const pointElement = $("circle[data-value='17']"); 8 | const titleElement = $('.movie-title'); 9 | 10 | browser.wait(EC.visibilityOf(pointElement)); 11 | pointElement.click(); 12 | browser.wait(EC.visibilityOf(titleElement)); 13 | const movieTitle = await titleElement.getText(); 14 | expect(movieTitle).to.equal("Pirates of the Caribbean: At World's End"); 15 | }); 16 | 17 | it('Clear selections button should hide the info panel', async () => { 18 | const pointElement = $("circle[data-value='17']"); 19 | browser.wait(EC.visibilityOf(pointElement)); 20 | pointElement.click(); 21 | 22 | const infoWrapper = $('.info-wrapper'); 23 | const clearSelectionButton = $('.clear-selections'); 24 | browser.wait(EC.elementToBeClickable(clearSelectionButton)); 25 | expect(await clearSelectionButton.getAttribute('class')).to.not.contain('disabled'); 26 | expect(await infoWrapper.getAttribute('class')).to.not.contain('ng-hide'); 27 | clearSelectionButton.click(); 28 | expect(await infoWrapper.getAttribute('class')).to.contain('ng-hide'); 29 | expect(await clearSelectionButton.getAttribute('class')).to.contain('disabled'); 30 | }); 31 | }); 32 | -------------------------------------------------------------------------------- /test/test-hello-data-halyard.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | set -e 3 | cd "$(dirname "$0")" 4 | cd .. 5 | 6 | # grep for expected last five movies and session close to verify correctness. 7 | expected_five_last_movies="Cleopatra\nEvan Almighty\nGreen Lantern\nHarry Potter and the Half-Blood Prince\nIndiana Jones and the Kingdom of the Crystal Skull" 8 | if node src/hello-data/hello-data-halyard.js | grep -Pzo "$expected_five_last_movies"; then 9 | echo $'\nhello-data-halyard test succeded' 10 | exit 0 11 | else 12 | echo $'\nhello-data-halyard test failed' 13 | exit 1 14 | fi 15 | -------------------------------------------------------------------------------- /test/test-hello-data.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | set -e 3 | cd "$(dirname "$0")" 4 | cd .. 5 | 6 | # grep for expected last five movies and session close to verify correctness. 7 | expected_five_last_movies="Cleopatra\nEvan Almighty\nGreen Lantern\nHarry Potter and the Half-Blood Prince\nIndiana Jones and the Kingdom of the Crystal Skull" 8 | if node src/hello-data/hello-data.js | grep -Pzo "$expected_five_last_movies"; then 9 | echo $'\nhello-data test succeded' 10 | exit 0 11 | else 12 | echo $'\nhello-data test failed' 13 | exit 1 14 | fi 15 | -------------------------------------------------------------------------------- /test/test-hello-engine.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | set -e 3 | cd "$(dirname "$0")" 4 | cd .. 5 | 6 | # Get the current version. 7 | version=$(grep "image: qlikcore/engine" docker-compose.yml | cut -d':' -f3-) 8 | 9 | # grep for expected string to verify correctness. 10 | if node src/hello-engine/hello-engine.js | grep "Engine version retrieved: $version"; then 11 | echo $'\nHello Engine test succeded' 12 | exit 0 13 | else 14 | echo $'\nHello Engine test failed' 15 | exit 1 16 | fi 17 | -------------------------------------------------------------------------------- /test/test-hello-visualization.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | set -e 3 | cd "$(dirname "$0")" 4 | cd .. 5 | 6 | npx webdriver-manager update --standalone false --gecko false 7 | npx aw protractor -c ./test/aw.config.js 8 | --------------------------------------------------------------------------------