<commit_before>/*
 * Rapid Interface Builder (RIB) - A simple WYSIWYG HTML5 app creator
 * Copyright (c) 2011-2012, Intel Corporation.
 *
 * This program is licensed under the terms and conditions of the
 * Apache License, version 2.0.  The full text of the Apache License is at
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 */
"use strict";

// Layout view widget

(function($, undefined) {

    $.widget('rib.liveView', $.rib.baseView, {

        options: {
            iframe: null,
            contentDocument: null,
        },

        _create: function() {
            var o = this.options,
                controlPanel,
                pagePanel,
                devicePanel,
                deviceToolbar,
                deviceSelect,
                addDeviceButton,
                deviceWrapper,
                rotateDeviceButton,
                widget = this;

            // Chain up to base class _create()
            $.rib.baseView.prototype._create.call(this);

            widget._sysDevices = {};
            widget._userDevices = {};

            controlPanel = $('<div/>')
                .addClass('tools')
                .addClass('hbox')
                .addClass('flex0');

            pagePanel = $('<div/>')
                .addClass('panel-section')
                .addClass('vbox')
                .addClass('flex0')
                .css({ "min-width": 300, 
                       "max-width": 300})  // FIXME: do this in CSS
                .pageView();
            pagePanel.pageView('option', 'model', ADM);

            devicePanel = $('<div/>')
                .addClass('panel-section')
                .addClass('vbox')
                .addClass('flex1');

            $('<div/>')
                .addClass('panel-section-header')
                .append('<div>devices</div>')
                .children().last()
                    .addClass('title')
                    .end()
                .end()
                .appendTo(devicePanel);

            deviceToolbar = $('<div/>')
                .addClass('panel-section-contents')
                .appendTo(devicePanel);

            widget._recentDevices = $('<select/>').appendTo(deviceToolbar)
                .append('<option value="1">Recently Used</option>')
                .change(function() {
                    $("option:selected", this).each(function () {
                        if ($(this).val() !== "1") {
                            widget._refreshDeviceList($(this).text());
                            widget._recentDevices.children().first().attr('selected', true);
                        }
                    });
                });
            widget._deviceSelect = $('<select></select>')
                .addClass("separated")
                .appendTo(deviceToolbar)
                .change(function () {
                    $("option:selected", this).each(function () {
                        widget._screenHeight.val($(this).data('deviceInfo').screen.height);
                        widget._screenWidth.val($(this).data('deviceInfo').screen.width);
                        widget._projectDevice.screenHeight = widget._screenHeight.val();
                        widget._projectDevice.screenWidth = widget._screenWidth.val();
                        widget._projectDevice.rotating = false;
                        widget._projectDevice.name = $(this).text();
                        $.rib.pmUtils.pInfoDirty = true;
                        widget._setDevice();
                        if (widget._recentDevices) {
                            var recentDevices = {},
                                recentOptions = widget._recentDevices.find("option"),
                                recentOption = widget._findOptionByText(widget._recentDevices,
                                $(this).text());
                            if (recentOption.length == 0 )
                                recentOption = $('<option/>').text($(this).text());
                            recentOption.insertAfter(recentOptions.first());
                            if (recentOptions.length > 6)
                                recentOptions.last().remove();
                            recentDevices.devices = [];
                            recentOptions.not(":first").each(function () {
                                recentDevices.devices.push($(this).text());
                            });
                            $.rib.fsUtils.write("recent_devices.json", JSON.stringify(recentDevices));
                        }
                    });
            });

            $.rib.fsUtils.read("recent_devices.json", function(result) {
                try {
                    var recentDevices = $.parseJSON(result);
                    if (recentDevices)
                        recentDevices = recentDevices.devices;
                    for (var i in recentDevices)
                        $('<option/>').text(recentDevices[i]).appendTo(widget._recentDevices);

                } catch(e) {
                    alert(e.stack);
                    return false;
                }
            });
            $.getJSON("src/assets/devices.json", function (data) {
                widget._sysDevices = data;
                widget._refreshDeviceList(widget._projectDevice.name);
                $.rib.fsUtils.read("devices.json", function(result) {
                    try {
                        widget._userDevices = $.parseJSON(result);
                        widget._refreshDeviceList(widget._projectDevice.name);
                    } catch(e) {
                        alert(e.stack);
                        return false;
                    }
                });
            });

            addDeviceButton = $('<a/>')
                .addClass("addDevice separated")
                .appendTo(deviceToolbar)
                .click( function () {
                    $("<form/>")
                        .addClass("deviceSetting")
                        .append('<label for="name">Device Name</label>')
                        .append('<input required name="name"/>')
                        .append('<label for="screenWidth">Screen</label>')
                        .append('<input name="screenWidth" type="number" max="10000"  style="width:4em" required size="4"/>').append('x')
                        .append('<input name="screenHeight" type="number" max="10000" style="width:4em" required size="4"/>')
                        .append('<br/>')
                        .append('<input type="submit" class="submit" value="Done"></input>')
                        .append($('<a href="javascript:void(0)">Cancel</a>').click( function() { $(this).parent().dialog("close"); }))
                        .submit( function () {
                            var values = {},
                                form = this;
                            try{
                                $.each($(this).serializeArray(), function(i, field) {
                                        values[field.name] = field.value;
                                });
                                widget._userDevices[values.name] = widget._cloneSelectedDeviceInfo();
                                widget._modifyScreenSize(widget._userDevices[values.name], values.screenWidth, values.screenHeight);
                                widget._refreshDeviceList(values.name);
                                $.rib.fsUtils.write("devices.json", JSON.stringify(widget._userDevices), function(fileEntry){
                                    alert("New device " + values.name + " sucessfully created!");
                                    $(form).dialog('close');
                                });
                            }catch (e){
                               alert(e);
                            }
                            return false;
                        })
                        .dialog({title:"Add Device", modal:true, width: 400, height: 285, resizable:false });
                });
            $('<a href="javascript:void(0)">Add Device</a>').appendTo(deviceToolbar).click(function () {
                addDeviceButton.trigger('click');
            });

            rotateDeviceButton = $('<a/>')
                .addClass("rotateDevice separated")
                .appendTo(deviceToolbar)
                .click( function () {
                    var screenWidth = widget._screenWidth.val();
                    widget._projectDevice.rotating = !widget._projectDevice.rotating;
                    $.rib.pmUtils.pInfoDirty = true;
                    widget._screenWidth.val(widget._screenHeight.val());
                    widget._screenHeight.val(screenWidth);
                    widget._setDevice();
                });
            $('<a href="javascript:void(0)">Rotate</a>').appendTo(deviceToolbar).click(function () {
                rotateDeviceButton.trigger('click');
            });

            $('<label for="screenWidth">Screen:</label>')
                .addClass("separated")
                .appendTo(deviceToolbar);
            widget._screenWidth =
                $('<input name="screenWidth" type="number" min="0" class="screenCoordinate"/>')
                .change( function () {
                    widget._projectDevice.screenWidth = $(this).val();
                    $.rib.pmUtils.pInfoDirty = true;
                    widget._setDevice();
                })
                .appendTo(deviceToolbar);
            $('<label for="screenHeight"> x </label>').appendTo(deviceToolbar);
            widget._screenHeight =
                $('<input name="screenHeight" type="number" min="0" class="screenCoordinate"/>')
                .change( function () {
                    widget._projectDevice.screenHeight = $(this).val();
                    $.rib.pmUtils.pInfoDirty = true;
                    widget._screenWidth.trigger('change');<commit_msg>[Live View] Fix issue #18: Preview rotation rotates the frame only, iframe aspect-ratio stays the same.<commit_after>/*
 * Rapid Interface Builder (RIB) - A simple WYSIWYG HTML5 app creator
 * Copyright (c) 2011-2012, Intel Corporation.
 *
 * This program is licensed under the terms and conditions of the
 * Apache License, version 2.0.  The full text of the Apache License is at
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 */
"use strict";

// Layout view widget

(function($, undefined) {

    $.widget('rib.liveView', $.rib.baseView, {

        options: {
            iframe: null,
            contentDocument: null,
        },

        _create: function() {
            var o = this.options,
                controlPanel,
                pagePanel,
                devicePanel,
                deviceToolbar,
                deviceSelect,
                addDeviceButton,
                deviceWrapper,
                rotateDeviceButton,
                widget = this;

            // Chain up to base class _create()
            $.rib.baseView.prototype._create.call(this);

            widget._sysDevices = {};
            widget._userDevices = {};

            controlPanel = $('<div/>')
                .addClass('tools')
                .addClass('hbox')
                .addClass('flex0');

            pagePanel = $('<div/>')
                .addClass('panel-section')
                .addClass('vbox')
                .addClass('flex0')
                .css({ "min-width": 300, 
                       "max-width": 300})  // FIXME: do this in CSS
                .pageView();
            pagePanel.pageView('option', 'model', ADM);

            devicePanel = $('<div/>')
                .addClass('panel-section')
                .addClass('vbox')
                .addClass('flex1');

            $('<div/>')
                .addClass('panel-section-header')
                .append('<div>devices</div>')
                .children().last()
                    .addClass('title')
                    .end()
                .end()
                .appendTo(devicePanel);

            deviceToolbar = $('<div/>')
                .addClass('panel-section-contents')
                .appendTo(devicePanel);

            widget._recentDevices = $('<select/>').appendTo(deviceToolbar)
                .append('<option value="1">Recently Used</option>')
                .change(function() {
                    $("option:selected", this).each(function () {
                        if ($(this).val() !== "1") {
                            widget._refreshDeviceList($(this).text());
                            widget._recentDevices.children().first().attr('selected', true);
                        }
                    });
                });
            widget._deviceSelect = $('<select></select>')
                .addClass("separated")
                .appendTo(deviceToolbar)
                .change(function () {
                    $("option:selected", this).each(function () {
                        widget._screenHeight.val($(this).data('deviceInfo').screen.height);
                        widget._screenWidth.val($(this).data('deviceInfo').screen.width);
                        widget._projectDevice.screenHeight = widget._screenHeight.val();
                        widget._projectDevice.screenWidth = widget._screenWidth.val();
                        widget._projectDevice.rotating = false;
                        widget._projectDevice.name = $(this).text();
                        $.rib.pmUtils.pInfoDirty = true;
                        widget._setDevice();
                        if (widget._recentDevices) {
                            var recentDevices = {},
                                recentOptions = widget._recentDevices.find("option"),
                                recentOption = widget._findOptionByText(widget._recentDevices,
                                $(this).text());
                            if (recentOption.length == 0 )
                                recentOption = $('<option/>').text($(this).text());
                            recentOption.insertAfter(recentOptions.first());
                            if (recentOptions.length > 6)
                                recentOptions.last().remove();
                            recentDevices.devices = [];
                            recentOptions.not(":first").each(function () {
                                recentDevices.devices.push($(this).text());
                            });
                            $.rib.fsUtils.write("recent_devices.json", JSON.stringify(recentDevices));
                        }
                    });
            });

            $.rib.fsUtils.read("recent_devices.json", function(result) {
                try {
                    var recentDevices = $.parseJSON(result);
                    if (recentDevices)
                        recentDevices = recentDevices.devices;
                    for (var i in recentDevices)
                        $('<option/>').text(recentDevices[i]).appendTo(widget._recentDevices);

                } catch(e) {
                    alert(e.stack);
                    return false;
                }
            });
            $.getJSON("src/assets/devices.json", function (data) {
                widget._sysDevices = data;
                widget._refreshDeviceList(widget._projectDevice.name);
                $.rib.fsUtils.read("devices.json", function(result) {
                    try {
                        widget._userDevices = $.parseJSON(result);
                        widget._refreshDeviceList(widget._projectDevice.name);
                    } catch(e) {
                        alert(e.stack);
                        return false;
                    }
                });
            });

            addDeviceButton = $('<a/>')
                .addClass("addDevice separated")
                .appendTo(deviceToolbar)
                .click( function () {
                    $("<form/>")
                        .addClass("deviceSetting")
                        .append('<label for="name">Device Name</label>')
                        .append('<input required name="name"/>')
                        .append('<label for="screenWidth">Screen</label>')
                        .append('<input name="screenWidth" type="number" max="10000"  style="width:4em" required size="4"/>').append('x')
                        .append('<input name="screenHeight" type="number" max="10000" style="width:4em" required size="4"/>')
                        .append('<br/>')
                        .append('<input type="submit" class="submit" value="Done"></input>')
                        .append($('<a href="javascript:void(0)">Cancel</a>').click( function() { $(this).parent().dialog("close"); }))
                        .submit( function () {
                            var values = {},
                                form = this;
                            try{
                                $.each($(this).serializeArray(), function(i, field) {
                                        values[field.name] = field.value;
                                });
                                widget._userDevices[values.name] = widget._cloneSelectedDeviceInfo();
                                widget._modifyScreenSize(widget._userDevices[values.name], values.screenWidth, values.screenHeight);
                                widget._refreshDeviceList(values.name);
                                $.rib.fsUtils.write("devices.json", JSON.stringify(widget._userDevices), function(fileEntry){
                                    alert("New device " + values.name + " sucessfully created!");
                                    $(form).dialog('close');
                                });
                            }catch (e){
                               alert(e);
                            }
                            return false;
                        })
                        .dialog({title:"Add Device", modal:true, width: 400, height: 285, resizable:false });
                });
            $('<a href="javascript:void(0)">Add Device</a>').appendTo(deviceToolbar).click(function () {
                addDeviceButton.trigger('click');
            });

            rotateDeviceButton = $('<a/>')
                .addClass("rotateDevice separated")
                .appendTo(deviceToolbar)
                .click( function () {
                    widget._projectDevice.rotating = !widget._projectDevice.rotating;
                    widget._projectDevice.screenWidth = widget._screenHeight.val();
                    widget._projectDevice.screenHeight = widget._screenWidth.val();
                    $.rib.pmUtils.pInfoDirty = true;
                    widget._screenWidth.val(widget._projectDevice.screenWidth);
                    widget._screenHeight.val(widget._projectDevice.screenHeight);
                    widget._setDevice();
                });
            $('<a href="javascript:void(0)">Rotate</a>').appendTo(deviceToolbar).click(function () {
                rotateDeviceButton.trigger('click');
            });

            $('<label for="screenWidth">Screen:</label>')
                .addClass("separated")
                .appendTo(deviceToolbar);
            widget._screenWidth =
                $('<input name="screenWidth" type="number" min="0" class="screenCoordinate"/>')
                .change( function () {
                    widget._projectDevice.screenWidth = $(this).val();
                    $.rib.pmUtils.pInfoDirty = true;
                    widget._setDevice();
                })
                .appendTo(deviceToolbar);
            $('<label for="screenHeight"> x </label>').appendTo(deviceToolbar);
            widget._screenHeight =
                $('<input name="screenHeight" type="number" min="0" class="screenCoordinate"/>')
                .change( function () {
                    widget._projectDevice.screenHeight = $(this).val();
                    $.rib.pmUtils.pInfoDirty = true;
                    widget._screenWidth.trigger('change');
{'fraction_non_alphanumeric': 0.13151191249188351, 'fraction_numerical': 0.005194545726986664, 'mean_word_length': 1.2649321266968325, 'pattern_counts': {'":': 6, '<': 81, '<?xml version=': 0, '>': 83, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 6, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5246566', 'n_tokens_mistral': 4802, 'n_tokens_neox': 4406, 'n_words': 721}